/* GENERAL STYLING */ #lys-stripe img {border:none !important;} #lys-stripe {z-index:10001 !important;position:fixed;left:0; top:0px; height:42px !important;width:100% !important;padding:0 !important;margin:0; background:#b73ba5 !important; border-bottom:1px solid #77266a !important; border-top:1px solid #77266a !important; text-shadow: 0 -1px 0 rgba(0,0,0,0.3) !important; box-shadow: inset 0 2px 1px rgba(0,0,0,0.07), inset 0 6px 10px rgba(0,0,0,0.15), inset 0 -1px 0px rgba(255,255,255,0.15), 0 2px 0px rgba(0,0,0,0.15) !important; font-family:arial, sans-serif !important; } #lys-stripe #lys-wrapper {position:relative !important;width:980px !important;margin:0 auto !important;} #lys-stripe #lys-wrapper * {margin:0;padding:0;line-height:100%;font-size:12px;color:#fff;display:block;font-family:Arial, Helvetica, sans-serif;text-decoration:none;border:0;outline:0;} #lys-stripe #lys-btnfacebook img {display:block !important;position:absolute !important;left:7px !important;top:5px !important;} #lys-stripe #lys-btnfacebook span {font-size:15px !important;line-height:24px !important;padding:0 !important;margin:0 !important;} .lys-right {float:right !important;} .lys-clear {clear:both !important;} .lys-nopadding td {padding:0 !important;} .lys-announcement { font-family:arial, sans-serif !important; position:relative !important;background:#b73ba5 !important;color:#fff !important;text-shadow:-1px -1px rgba(0,0,0,0.25) !important;font-weight:normal !important;font-size:12px !important;line-height:12px !important;margin:10px 0 10px !important;padding:7px 10px !important;border-radius:3px !important;box-shadow:inset 0 -1px 3px rgba(0,0,0,0.25) !important;font-family:Arial, Helvetica, sans-serif !important;display:block !important;clear:both !important;} .lys-announcement strong {color:inherit !important;} .lys-announcement-checkout {float:none !important;clear:both !important; text-transform:uppercase !important;text-align:center !important;margin:15px 0 !important;line-height:30px !important;height:30px !important;clear:both !important;position:relative !important;background:#b73ba5 !important;color:#fff !important;text-shadow:-1px -1px rgba(0,0,0,0.25) !important;font-weight:bold !important;font-size:11px !important;padding:0px 10px !important;border-radius:3px !important;box-shadow:inset 0 -1px 3px rgba(0,0,0,0.25) !important;font-family:Arial, Helvetica, sans-serif !important;display:block !important;} .lys-like {position:relative !important;margin-top:12px !important;} .lys-checkout td {padding:5px 0 30px !important;} #lys-SliderHolder {position:relative !important;float:right !important;padding:10px 20px 20px !important;text-align:left !important;font-weight:bold !important;border:5px solid #b73ba5 !important;border-radius:10px !important;} #lys-SliderHolder div {position:relative !important;margin:11px 0 0 !important;} #lys-SliderHolder div.lys-right {margin:0 !important;} #lys-SliderHolder div span {font-weight:bold !important;font-size:14px !important;} #lys-Button {font-weight:bold !important;text-align:center !important;cursor:pointer !important;font-size:9px !important;text-transform:uppercase !important;padding:7px 8px !important;border-radius:3px !important;background:#999 !important;color:#fff !important;text-shadow:-1px -1px rgba(0,0,0,0.25) !important;box-shadow:inset 0 -1px 2px rgba(0,0,0,0.25) !important;letter-spacing:1px !important;} #lys-Button:hover {background:#666 !important;} #lys-slider {margin:25px 7px 20px !important;width:265px !important;} #lys-Valute {font-size:1em !important;} .lys-info {margin-left:10px !important;position:absolute !important;top:50% !important;left:100px !important;margin-top:-11px !important;padding-top:2px !important;height:21px !important;line-height:20px !important;} .lys-info .lys-pts {position:relative !important;background:#b73ba5 !important;color:#fff !important;text-shadow:-1px -1px rgba(0,0,0,0.25) !important;font-weight:bold !important;font-size:12px !important;padding:4px 7px !important;border-radius:3px !important;box-shadow:inset 0 -1px 3px rgba(0,0,0,0.25) !important;margin-right:5px !important;font-family:Arial, Helvetica, sans-serif !important;} .lys-info .lys-pts .lys-arr {display:block !important;position:absolute !important;left:-4px !important;top:50% !important;margin-top:-6px !important;width:0 !important;height:0 !important;border-top:6px solid transparent !important;border-bottom:6px solid transparent !important;border-right:6px solid #b73ba5 !important;border-left:0 !important;} #lys-onboard { font-family:arial, sans-serif !important; position: fixed; width: 560px; height: 430px; top: 50%; left: 50%; margin: -13% 0 0 -14%; z-index: 99999999 !important; border-radius: 4px; border: 1px solid #fff !important; box-shadow: 0 0 1px rgba(0,0,0,0.8), 0 0 7px rgba(0,0,0,0.2), 0 0 15px rgba(0,0,0,0.2), 0 0 150px rgba(0,0,0,0.2);!important; text-align: center; line-height: 150%; color: #666; box-sizing: border-box; background: #fff; /* Old browsers */ background: -moz-linear-gradient(top, #fff 0%, #eeeeee 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#eeeeee)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #fff 0%,#eeeeee 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #fff 0%,#eeeeee 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #fff 0%,#eeeeee 100%); /* IE10+ */ background: linear-gradient(to bottom, #fff 70%,#eeeeee 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */; display: none;} #lys-onboard .lys-onboard-title { font-size: 24px;font-weight: bold;color: #000;line-height: 100%;margin: 0;padding: 23px 0; width: 100%;border: 0;border-radius: 5px 5px 0 0;border-bottom: 1px solid #dfdfdf;background: #fff;text-shadow: 0 1px #fff; } #lys-onboard .lys-onboard-content { font-size: 15px; line-height: 150%; padding: 25px 20px 05px; overflow: auto; } #lys-onboard .lys-onboard-tagline { margin: 0 25px 29px; font-size: 18px; color: #888; padding: 0; font-weight: normal; display: block; } #lys-onboard .lys-onboard-step { float:left; width:30%; margin:0 1.5% 20px;line-height: 130%;font-size: 12px;text-align: left;color: #000; } #lys-onboard .lys-onboard-step img.lys-pic { margin-bottom: 5px; border: 1px solid #afafaf; border-radius: 4px; box-sizing: border-box; border-bottom-width: 2px; } #lys-onboard .lys-onboard-button { font-size: 18px; padding: 12px 0px 15px; background: #b73ba5 !important; border: 1px solid #77266a !important; text-shadow: 0 -1px 0 rgba(0,0,0,0.3) !important; box-shadow: inset 0 -1px 0px rgba(0,0,0,0.2), inset 0 -5px 10px rgba(0,0,0,0.15), inset 0 1px 0px rgba(255,255,255,0.15); color: #fff; border-radius: 4px; display: block; width: 220px !important; margin: 0px auto 0; } #lys-onboard .lys-onboard-later { font-size: 13px; margin: 6px 0px; color: #b73ba5; display: block; } #lys-onboard .lys-onboard-avatar { float:left; width:16%; margin:0 2% 20px;text-align: center; padding:12px 0 0px; box-sizing:border-box; border: 2px solid rgba(0,0,0,0.1); border-radius: 9px; } #lys-onboard .lys-onboard-avatar:hover { border-color:#b73ba5; background:#fff; cursor:pointer; } #lys-onboard .lys-onboard-avatar img.lys-avatar { margin:3px auto 10px; } /* NOTIFICATIONS STYLING */ .notify-osd {opacity:1 !important;position:fixed !important;top:20px !important;right:20px !important;width:300px !important;z-index:110000 !important; font-family:arial, sans-serif !important;} .notify-osd:hover {cursor:default !important;} .notify-osd * {opacity:1 !important;text-shadow:none !important;box-shadow:none !important;border:0 !important;margin:0 !important;padding:0 !important;height:auto !important;width:auto !important;font-family:Arial, sans-serif !important;} .notify-osd > div {padding:0 !important;position:relative !important;} .notify-osd table {width:100% !important;margin:0 !important;border:0 !important;padding:0 !important;-webkit-border-horizontal-spacing:0 !important;-webkit-border-vertical-spacing:0 !important;} .notify-osd table td {margin:0 !important;padding:0 !important;border:0 !important;} .notify-osd .notify-osd-dismiss {text-indent:-99999px !important;display:block !important;position:absolute !important;width:25px !important;height:25px !important;right:-11px !important;top:-11px !important;background:url(../img/close.png) no-repeat !important;cursor:pointer !important;z-index:999 !important;} .notify-osd td.notify-osd-icon {height:48px !important;width:48px !important;vertical-align:top !important;} .notify-osd td.notify-osd-content {vertical-align:center !important;} .notify-osd td.notify-osd-content h4 {margin:0 !important;padding:25px !important;text-align:center !important;color:#666 !important;font-size:18px !important;text-transform:uppercase !important;letter-spacing:1px !important;font-weight:bold !important;background:#fff !important;border-radius:9px 9px 0 0 !important;} .notify-osd td.notify-osd-content p {margin:0 !important;padding:25px 0 !important;text-align:center !important;color:#fff !important;font-size:14px !important;font-weight:normal !important;background:#b73ba5 !important;} .notify-osd td.notify-osd-content h5 {margin:0 !important;padding:25px !important;text-align:center !important;color:#999 !important;font-size:14px !important;font-weight:bold !important;background:#fff !important;border-radius:0 0 9px 9px !important;} .notify-osd td.notify-osd-content .lys-title {font-weight:bold !important;} .notify-osd td.notify-osd-content .lys-notification {text-align:left !important;font-size:12px !important;background:rgba(0,0,0,0.75) !important;color:#fff !important;padding:11px 0 12px 18px !important;border-radius:12px !important;line-height:18px !important;border:3px solid #fff !important;box-shadow:1px 1px 6px rgba(0,0,0,0.33) !important;} .notify-osd td.notify-osd-content .lys-notification .lys-corner {position:absolute !important;height:0 !important;width:0 !important;background:transparent !important;border:8px solid transparent !important;border-right-color:#fff !important;left:-16px !important;top:50% !important;margin-top:-9px !important;} .notify-osd td.notify-osd-content .lys-badge {position:absolute !important;left:-80px !important;top:0 !important;width:60px !important;height:65px !important;background-position:left center !important;background-size:contain !important;background-repeat:no-repeat !important;} .notify-osd td.notify-osd-content .lys-badge-achievement {background-image:url(../img/badges/achievement.png) !important;} .notify-osd td.notify-osd-content .lys-badge-facebook {background-image:url(../img/badges/facebook.png) !important;} .notify-osd td.notify-osd-content .lys-badge-googleplus {background-image:url(../img/badges/googleplus.png) !important;} .notify-osd td.notify-osd-content .lys-badge-newsletter {background-image:url(../img/badges/newsletter.png) !important;} .notify-osd td.notify-osd-content .lys-badge-pinterest {background-image:url(../img/badges/pinterest.png) !important;} .notify-osd td.notify-osd-content .lys-badge-purchase {background-image:url(../img/badges/purchase.png) !important;} .notify-osd td.notify-osd-content .lys-badge-review {background-image:url(../img/badges/review.png) !important;} .notify-osd td.notify-osd-content .lys-badge-survey {background-image:url(../img/badges/survey.png) !important;} .notify-osd td.notify-osd-content .lys-badge-twitter {background-image:url(../img/badges/twitter.png) !important;} .notify-osd td.notify-osd-content .lys-badge-visit {background-image:url(../img/badges/visit.png) !important;} /* TOOLTIPS */ .tipsy {font-size:13px !important;line-height:18px !important;position:absolute !important;padding:5px !important;z-index:100000 !important;letter-spacing:0 !important; font-family:arial, sans-serif !important;} .tipsy-inner {background-color:#000 !important;color:#FFF !important;max-width:300px !important;padding:13px 20px 15px !important;text-align:center !important;} .tipsy-inner {border-radius:5px !important;-moz-border-radius:5px !important;-webkit-border-radius:5px !important;letter-spacing:0 !important;} .tipsy-arrow {position:absolute !important;width:0 !important;height:0 !important;line-height:0 !important;border:5px dashed #000 !important;} .tipsy-arrow-n {border-bottom-color:#000 !important;} .tipsy-arrow-s {border-top-color:#000 !important;} .tipsy-arrow-e {border-left-color:#000 !important;} .tipsy-arrow-w {border-right-color:#000 !important;} .tipsy-n .tipsy-arrow {top:0px !important;left:50% !important;margin-left:-5px !important;border-bottom-style:solid !important;border-top:none !important;border-left-color:transparent !important;border-right-color:transparent !important;} .tipsy-nw .tipsy-arrow {top:0 !important;left:10px !important;border-bottom-style:solid !important;border-top:none !important;border-left-color:transparent !important;border-right-color:transparent !important;} .tipsy-ne .tipsy-arrow {top:0 !important;right:10px !important;border-bottom-style:solid !important;border-top:none !important; border-left-color:transparent !important;border-right-color:transparent !important;} .tipsy-s .tipsy-arrow {bottom:0 !important;left:50% !important;margin-left:-5px !important;border-top-style:solid !important;border-bottom:none !important; border-left-color:transparent !important;border-right-color:transparent !important;} .tipsy-sw .tipsy-arrow {bottom:0 !important;left:10px !important;border-top-style:solid !important;border-bottom:none !important; border-left-color:transparent !important;border-right-color:transparent !important;} .tipsy-se .tipsy-arrow {bottom:0 !important;right:10px !important;border-top-style:solid !important;border-bottom:none !important;border-left-color:transparent !important;border-right-color:transparent !important;} .tipsy-e .tipsy-arrow {right:0 !important;top:50% !important;margin-top:-5px !important;border-left-style:solid !important;border-right:none !important;border-top-color:transparent !important;border-bottom-color:transparent !important;} .tipsy-w .tipsy-arrow {left:0 !important;top:50% !important;margin-top:-5px !important;border-right-style:solid !important;border-left:none !important;border-top-color:transparent !important;border-bottom-color:transparent !important;} /* BOTTOM BAR STYLING */ #lys-bar { width: 350px; box-shadow: rgba(0, 0, 0, 0.15) 0px -4px 15px inset, rgba(0, 0, 0, 0.30) 0px 4px 4px; border-radius:5px 5px 0 0; position: fixed; left: 50%; bottom: 0 !important; margin-left: -175px; display: block; z-index: 99999; height: 55px; cursor: pointer; background: #b73ba5 !important; font-family:arial, sans-serif !important; z-index: 100;width: 475px;margin-left: -237px;box-shadow: rgba(0, 0, 0, 0.15) 0px -4px 15px inset, rgba(0,0,0, 0.5) 0px 2px 3px 1px, inset rgba(0,0,0,0.3) 0 0px 0 1px;/* border: 2px solid #fff; */border-bottom: 0; } #lys-bar .lys-bar-box { box-sizing:content-box; border-radius:5px 0 0 0; float: left; width: 136px; padding: 9px 4px 0; height: 46px; text-align: center; border-right: 1px solid rgba(255,255,255,0.2); width: 160px;} #lys-bar .lys-bar-box:hover { background:rgba(255,255,255,0.15); } #lys-bar .lys-bar-box .lys-bar-avatar { float: left; margin: 0 11px 0 5px; background: rgba(0,0,0,0.15); border-radius: 6px; padding: 0; box-shadow: inset 0 1px 0px rgba(0,0,0,0.1), 0 1px 0 rgba(255,255,255,0.1); width: 40px !important; float: left; margin-right: 0; box-shadow: inset 0 1px 0px rgba(0,0,0,0.2), 0 1px 0 rgba(255,255,255,0.2);} #lys-bar .lys-bar-box .lys-coins { margin: 2px 0 0 !important; } #lys-bar .lys-bar-box .lys-coins .lys-coin {margin: 1px 3px;display: inline;} #lys-bar .lys-bar-box .lys-coins .lys-coin .lys-coin-img { border-radius: 50px; box-shadow: 0 1px 1px rgba(0,0,0,0.3); vertical-align: baseline; width: 16px !important; } #lys-bar .lys-bar-box .lys-coins .lys-coin div { display: inline; vertical-align: 3px; margin-left: 0; font-size: 12px; font-weight: normal; color: #fff; text-shadow: 0 -1px rgba(0,0,0,0.2); letter-spacing: 0; #joyRideTipContentStripe * { font-family:arial, sans-serif !important;} font-size: 13px; } #lys-bar .lys-bar-rewards { text-align: center; width: 90px; border-left: 1px solid rgba(0,0,0,0.3); border-radius: 0; } #lys-bar .lys-bar-rewards strong { font-weight: bold; line-height:18px; color: #fff; font-size: 13px; text-shadow: 0 -1px rgba(0,0,0,0.2); } #lys-bar .lys-bar-info { box-sizing:content-box; position:relative; float: left; width: 122px; padding: 10px 20px 1px; height: 46px; box-shadow: inset 1px 0 0 rgba(0,0,0,0.15), -1px 0 0 rgba(255,255,255,0.1); font-weight: bold; color: #fff; font-size: 13px; text-shadow: 0 -1px rgba(0,0,0,0.2); text-align: center; line-height: 18px; padding-top: 8px; box-shadow: inset 1px 0 0 rgba(0,0,0,0.3), -1px 0 0 rgba(255,255,255,0.2);} #lys-bar .lys-bar-info:hover { background:rgba(255,255,255,0.15); box-shadow: -1px 0 0 rgba(0,0,0,0.15); } #lys-bar .lys-bar-info .lys-bar-info-arr { z-index: 999999; position:absolute; left:50%; top:-7px; margin-left:-4px; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid #b73ba5; top: -6px; } #lys-bar .lys-bar-help { float: left; width: 44px; padding: 0; height: 55px; box-shadow: inset 1px 0 0 rgba(0,0,0,0.1), -1px 0 0 rgba(255,255,255,0.1); line-height: 54px; color: rgba(0,0,0,0.3); text-align: center; font-size: 29px; font-weight: bold; background: rgba(0,0,0,0.08); text-shadow: 0 1px 0 rgba(255,255,255,0.15); border-radius:0 5px 0 0; color: #fff; box-shadow: inset 1px 0 0 rgba(0,0,0,0.3), -1px 0 0 rgba(255,255,255,0.2); } #lys-bar .lys-bar-help:hover { background:rgba(0,0,0,0.15); color:#fff; text-shadow:none; } #lys-bar .lys-bar-help #lys-bar-question-mark { line-height: 54px !important; text-align: center; font-size: 29px !important; } #lys-bar .lys-rollout { position: absolute; width: 458px; bottom: 55px; background: #fff; z-index: 99999; margin: 0 7px; display: block; border-radius: 5px 5px 0 0; color: #444; border: 1px solid #a4a4a4; cursor:default; display: none; box-shadow: -3px 0 0 rgba(0,0,0,0.1), 3px 0 0 rgba(0,0,0,0.1), 0 -3px 0 rgba(0,0,0,0.1), inset 0 -4px 0px rgba(0,0,0,0.1); border-bottom: 0; } #lys-bar .lys-rollout .lys-rollout-title { position: relative; background-color: #eee !important; background: -moz-linear-gradient(top, #fcfcfc, #eee) !important; background: -ms-linear-gradient(top, #fcfcfc, #eee) !important; background: -webkit-linear-gradient(top, #fcfcfc, #eee) !important; padding: 8px 15px 6px; font-size: 9px; text-transform: uppercase; font-weight: bold; letter-spacing: 1px; color: #888; text-shadow: 0 1px #fff; border-bottom: 1px solid #ccc; border-radius:5px 5px 0 0; } #lys-bar .lys-rollout .lys-rollout-title .lys-rollout-close { box-sizing: content-box !important; font-size: 13px; text-decoration: none; color: #888; background: #fff; width: 12px; height: 12px; line-height: 12px; text-align: center; font-weight: bold; border-radius: 16px; border: 2px solid #ddd; position: absolute; right: 7px; top: 7px; } #lys-bar .lys-rollout .lys-rollout-title .lys-rollout-close:hover { color: #000; border-color: #aaa; } #lys-bar .lys-rollout .lys-rollout-title .lys-rollout-close:before, #lys-bar .lys-rollout .lys-rollout-title .lys-rollout-close:after { box-sizing: content-box !important; } #lys-bar .lys-rollout .lys-rollout-earn { padding: 8px 8px 8px 10px; border-bottom: 1px solid #ddd; } #lys-bar .lys-rollout .lys-rollout-ask { line-height: 28px; font-size: 15px; float:; } #lys-bar .lys-rollout .lys-holder { float: right; width: 70px; } #lys-bar .lys-rollout .lys-coin { float: right; margin-right: 9px; font-weight: bold; } #lys-bar .lys-rollout .lys-coin-img { display: inline; width: 13px !important; } #lys-bar .lys-rollout .lys-coin-pts { display: inline; font-size: 11px; vertical-align: 2px; margin-left: -1px; } #lys-bar .lys-rollout .lys-icon { width: 20px !important; float: left; margin: 3px 6px 0 0; } #lys-bar .lys-rollout .lys-button-more { cursor:pointer; font-weight: bold; font-size: 11px; text-align: center; clear: both; margin:10px auto 15px; color:#999; padding: 8px 12px; text-transform: uppercase; letter-spacing: 2px; } #lys-bar .lys-rollout .lys-button-more:hover { color:#77266a; } #lys-bar .lys-rollout .lys-button { cursor:pointer; font-weight: bold; font-size: 13px; text-align: center; background: #b73ba5; clear: both; margin:-1px 0 0; border-radius: 3px; color: #fff !important; text-shadow:0 -1px rgba(0,0,0,0.2); padding: 0; box-shadow: inset 0 -2px rgba(0,0,0,0.15); } #lys-bar .lys-rollout .lys-button:hover { background:#77266a; } @-webkit-keyframes move{0% {background-position:0 0;} 100% {background-position:50px 50px;} } @-moz-keyframes move{0% {background-position:0 0;} 100% {background-position:50px 50px;} } @-ms-keyframes move{0% {background-position:0 0;} 100% {background-position:50px 50px;} } @keyframes move{0% {background-position:0 0;} 100% {background-position:50px 50px;} } /* OVERLAY STYLING */ #lys-overlay {z-index:10000 !important;position:fixed !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;background:rgba(0,0,0,0.75) !important;display:none;} #lys-overlay #lys-box * { cursor:default; margin:0;padding:0;line-height:100%;font-size:12px;color:#555;display:block;font-family:Arial, Helvetica, sans-serif;text-decoration:none;border:0;outline:0; -webkit-box-sizing:border-box !important;-moz-box-sizing:border-box !important;-ms-box-sizing:border-box !important;box-sizing:border-box !important; } #lys-overlay #lys-box a, #lys-overlay #lys-box a * { cursor:pointer; } #lys-overlay #lys-box {z-index:10001 !important;position:fixed !important;left:50% !important;top:50% !important;width:820px !important;height:505px !important;margin-left:-410px !important;margin-top:-275px !important;background:#fff !important;border-radius:0 !important;box-shadow:4px 4px 0 rgba(0,0,0,0.4) !important;} #lys-overlay .lys-close {display:block !important;position:absolute !important;width:25px !important;height:25px !important;right:-11px !important;top:-11px !important;background:url(../img/close.png) no-repeat !important;cursor:pointer !important; z-index:200;} /* OVERLAY > RIGHT SIDEBAR STYLING */ #lys-overlay #lys-box #lys-account { width: 270px; height: 100%; position: absolute; right: 0; top: 0; } #lys-overlay #lys-box #lys-account #lys-account-title { width:100% !important;height:60px !important; background:#636363 !important; box-shadow:inset 0 -4px 15px rgba(0,0,0,0.15) !important; padding-left:10px; position:relative !important; z-index: 100; } #lys-overlay #lys-box #lys-account #lys-account-title span { line-height:60px !important; font-size:15px !important; font-weight:bold !important; color:#fff !important; text-shadow:0 1px rgba(0,0,0,0.40) !important; } #lys-overlay #lys-box #lys-account #lys-account-title img { float:left !important; margin:4px 5px 0 -2px !important; width: 50px !important;} #lys-overlay #lys-box .lys-coins { position: absolute; right: 0; top: 0; width: 90px; padding: 7px 0 0 11px; background: rgba(0,0,0,0.1); height: 100%; box-shadow: inset 1px 0 0 rgba(0,0,0,0.1), -1px 0 0 rgba(255,255,255,0.05); } #lys-overlay #lys-box .lys-coins .lys-coin { line-height:20px; font-size:12px; color:#fff; margin:0 0 5px; text-shadow:0 1px rgba(0,0,0,0.2); } #lys-overlay #lys-box #lys-account #lys-account-title img.lys-coin-img { display:inline !important; vertical-align:top !important; float:none !important; margin:0 2px 0 0 !important; padding:0 !important; width: 20px !important; } #lys-overlay #lys-box #lys-account .lys-coins .lys-coin { display:block; } #lys-overlay #lys-box #lys-account .lys-coins div { display:inline; color:#fff; } #lys-overlay #lys-box #lys-account #lys-account-activity {background:#feffe6 !important; border-left:1px solid #ddd !important; height: 100% !important; margin-top: -60px !important; padding-top: 60px !important; box-shadow:inset 4px 0 10px rgba(0,0,0,0.08) !important;} #lys-overlay #lys-box #lys-account #lys-account-activity .lys-button {background:#fff !important; color:#888 !important; text-transform:uppercase !important; font-size:10px !important; letter-spacing:2px !important; text-align:center !important; line-height:28px !important; border-right:1px solid #ccc !important; border-bottom:1px solid #ccc !important; font-weight:bold !important; width:50% !important; cursor:pointer !important; float:left !important; z-index: 100; position: relative; } #lys-overlay #lys-box #lys-account #lys-account-activity .lys-button:hover {color:#111 !important;} #lys-overlay #lys-box #lys-account #lys-account-activity .lys-button-active {background:#eee !important; color:#111 !important; text-shadow:0 1px #fff; cursor:default !important;box-shadow: inset 0 2px 5px rgba(0,0,0,0.2) !important;} #lys-overlay #lys-box #lys-account #lys-account-activity .lys-activity-ul { clear:both !important; overflow:hidden; height: 416px !important; } #lys-overlay #lys-box #lys-account #lys-account-activity .lys-activity-item {position: relative !important; line-height: 15px !important; font-size: 11px !important; clear: both; padding: 11px 10px 10px 8px !important; border-bottom: 1px solid rgba(0,0,0,0.07) !important; } #lys-overlay #lys-box #lys-account #lys-account-activity .lys-activity-item * {display:inline !important;line-height: 15px !important; font-size: 11px !important; } #lys-overlay #lys-box #lys-account #lys-account-activity .lys-activity-item img {margin-right:4px !important; float: left !important; margin-top: -1px !important; width:30px !important; height:30px; } #lys-overlay #lys-box #lys-account #lys-account-activity .lys-activity-item img.lys-coin-img {vertical-align: top; margin:1px 0px 0 2px !important; float: none !important; width:12px !important; height:12px; } #lys-overlay #lys-box #lys-account #lys-account-activity .lys-activity-item .lys-blue {color: #2a5ea9 !important; font-size:10px !important; font-weight:bold !important; } #lys-overlay #lys-box #lys-account #lys-account-activity .lys-activity-item .lys-gold {color: #dd8c00 !important; font-size:10px !important; font-weight:bold !important; } /* OVERLAY > TOP NAVIGATION */ #lys-overlay #lys-box #lys-head {overflow: hidden; width:100% !important;height:60px !important; background:#b73ba5 !important; box-shadow:inset 0 -4px 15px rgba(0,0,0,0.15) !important;position:relative;} #lys-overlay #lys-box #lys-head a {display:block !important;width:25% !important; text-align:center !important; height:60px !important;float:left !important; } #lys-overlay #lys-box #lys-head a.first {border-left:1px solid rgba(255,255,255,0.2) !important;} #lys-overlay #lys-box #lys-head a.last {border-right:1px solid rgba(255,255,255,0.2) !important;} #lys-overlay #lys-box #lys-head a span {display:block!important; text-align:center !important; margin-top:13px !important; line-height:31px !important; font-size:15px !important; font-weight:bold !important; color:#fff !important; text-shadow:0 1px rgba(0,0,0,0.35) !important; position: relative; z-index: 9999;} /*#lys-overlay #lys-box #lys-head a.on span {margin-left:10px !important; margin-right:10px !important; cursor:default !important; background:rgba(0,0,0,0.2) !important; border-radius:31px !important; box-shadow:inset 0 1px rgba(0,0,0,0.1), 0 1px rgba(255,255,255,0.1) !important;}*/ #lys-overlay #lys-box #lys-head #lys-bar { z-index: 100; width: 474px; margin-left: -237px; box-shadow: rgba(0, 0, 0, 0.14902) 0px -4px 15px inset, rgba(0, 0, 0, 0.498039) 0px 2px 3px 1px, rgba(0, 0, 0, 0.298039) 0px 0px 0px 1px inset; border-bottom-width: 0px;position: absolute;left: 0;top: 0;margin: 0;width: 100%;border-radius: 0;border: 0;box-shadow: none;height: 100%; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab1 { text-align: center; width: 28%; border-left: 1px solid rgba(0,0,0,0.3); border-radius: 0;height: 60px; padding: 11px 0; float:left; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab1 strong { font-weight: bold; color: #fff; font-size: 15px; text-shadow: 0 -1px rgba(0,0,0,0.2);line-height: 18px; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab2 { padding-top: 8px; box-shadow: inset 1px 0 0 rgba(0,0,0,0.3), -1px 0 0 rgba(255,255,255,0.2);height: 60px; padding: 11px 0;color: #fff;font-size: 15px;width: 28%; float:left; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab2 strong { font-weight: bold; color: #fff; font-size: 15px; text-shadow: 0 -1px rgba(0,0,0,0.2);line-height: 18px;text-align: center; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 { text-align: center; border-right: 1px solid rgba(255,255,255,0.2); width: 34%;height: 60px;padding: 11px 20px; float:left; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 strong { font-weight: bold; color: #fff; font-size: 15px; text-shadow: 0 -1px rgba(0,0,0,0.2); display: block; margin-bottom: 2px;line-height: 18px; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 .lys-coins { height: auto; box-shadow: none; margin: 0 0 0;position: relative;background: none;width: auto;padding: 0;text-align: center; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 .lys-coins .lys-coin { display: inline; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 .lys-coins .lys-coin img.lys-coin-img { display: inline; vertical-align:-1px; margin: 0 1px 0 0; width: 12px !important; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 .lys-coins .lys-chips-blue img.lys-coin-img { margin-left: 8px; width: 12px !important; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 .lys-coins .lys-coin div { font-size: 12px; font-weight: normal;display: inline; color: #fff;letter-spacing: 0; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab4 { color: #fff; box-shadow: inset 1px 0 0 rgba(0,0,0,0.3), -1px 0 0 rgba(255,255,255,0.2); width:10%; height: 60px; padding: 13px;font-size: 31px;border-radius: 0; float:left; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab1:hover, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab1.on, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab2:hover, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab2.on, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3:hover, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3.on { background:rgba(255,255,255,0.25); cursor:pointer; border: 0; box-shadow: -1px 0 0 rgba(0,0,0,0.3), inset 1px 0 0 rgba(255,255,255,0.3); } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab4:hover, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab4.on { background:rgba(0,0,0,0.2); cursor:pointer; border-right:0; box-shadow:0;} #lys-overlay #lys-box #lys-head #lys-bar #lys-tab1 *:hover, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab2 *:hover, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 *:hover, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab4 *:hover { cursor:pointer;} /* OVERLAY > CONTENT AREA */ #lys-overlay #lys-box #lys-maincol { width: 550px; } #lys-overlay #lys-box #lys-maincol .lys-maincol-title { display:block; clear:both; font-size:24px; color:#999; font-weight:bold; letter-spacing:-1px; line-height:130%; text-align:center; padding: 24px 0 25px; background: #fff url(../img/box-bg.png) repeat-x left 0 !important; border-bottom: 1px solid #ddd !important; text-shadow: 1px 1px #fff !important; } #lys-overlay #lys-box #lys-maincol .lys-maincol-subtitle { display:block; clear:both; font-size:18px; color:#888; font-weight:normal; line-height:130%; text-align:center; margin-bottom:35px; } #lys-overlay #lys-box #lys-maincol .lys-maincol-subtitle a { display:inline; font-size:18px; color:#b73ba5; font-weight:normal; line-height:130%; border-bottom:1px solid #b73ba5; } /* OVERLAY > CONTENT AREA > GIFT CARDS */ #lys-overlay #lys-box #lys-maincol .lys-gifts-wrapper { position:absolute; left:0; top:113px; height:332px; width:100%; overflow:hidden; float: none; margin: 0; width: 100%; opacity: 1; position: relative; box-shadow: 0 1px 3px 1px rgba(0,0,0,0.3); } #lys-overlay #lys-box #lys-maincol .lys-gift-wrapper { background: #000; padding:6px 3px 0; } #lys-overlay #lys-box #lys-maincol .lys-gift { width:100%; height:284px; background:#b73ba5; border-radius:0; position:relative; padding:1px 0 0; box-shadow: inset 0px 1px 3px rgba(255,255,255,0.3), inset 0px 0px 2px rgba(255,255,255,0.2); background: #b73ba5; /* Old browsers */ background: -moz-linear-gradient(top, #b73ba5 0%, #77266a 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b73ba5), color-stop(100%,#77266a)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #b73ba5 0%,#77266a 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #b73ba5 0%,#77266a 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #b73ba5 0%,#77266a 100%); /* IE10+ */ background: linear-gradient(to bottom, #b73ba5 0%,#77266a 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b73ba5', endColorstr='#77266a',GradientType=0 ); /* IE6-9 */ /**/ position: relative; height: 128px; overflow: hidden; } #lys-overlay #lys-box #lys-maincol .lys-gift-locked { background: #777; /* Old browsers */ background: -moz-linear-gradient(top, #777 0%, #aaa 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#777), color-stop(100%,#aaa)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #777 0%,#aaa 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #777 0%,#aaa 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #777 0%,#aaa 100%); /* IE10+ */ background: linear-gradient(to bottom, #777 0%,#aaa 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#777', endColorstr='#aaa',GradientType=0 ); /* IE6-9 */ box-shadow: inset 0 3px rgba(0,0,0,0.08), inset 0 0 50px rgba(0,0,0,0.3), 1px 0 0 rgba(255,255,255,0.3); /**/} #lys-overlay #lys-box #lys-maincol .lys-gift-locked .lys-coins { height:38px!important; } #lys-overlay #lys-box #lys-maincol .lys-gift-locked .lys-coin-buy { display:none !important; } #lys-overlay #lys-box #lys-maincol .lys-gift-locked .lys-gift-or { bottom:34px !important; } #lys-overlay #lys-box #lys-maincol .lys-gift-locked .lys-gift-instruction { display:none; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-gift-locked-div { display:none; } #lys-overlay #lys-box #lys-maincol .lys-gift-locked .lys-gift-locked-div { display:block; position: absolute; left: 0; width: 75%; text-align: center; top: 20px; } #lys-overlay #lys-box #lys-maincol .lys-gift-locked .lys-gift-locked-div strong { position: absolute; right: 0; width: 100%; text-align: center; top: 0; text-shadow: 0 1px rgba(0,0,0,0.2); color: #fff; font-size: 19px; } #lys-overlay #lys-box #lys-maincol .lys-gift-locked .lys-gift-locked-div .lys-gift-instruction { display:block; width: 100%; margin: 7px 0 0; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-gift-amount { float:right; margin-top:40px; padding: 10px 85px 10px 0; background: url(../img/gift.png) no-repeat 125px 15px; text-align:center; display:block; font-size:52px; font-weight:bold; color:#fff; letter-spacing:-1px; text-shadow:0 2px rgba(0,0,0,0.15); margin-bottom:5px; /**/ margin: 0; padding: 19px 15px 27px 0; width: 25%; background:none; box-shadow:none; border-left: 1px dashed #000; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-gift-amount sup { display: inline; color: #fff; font-size: 28px; vertical-align: 10%; font-weight:normal; letter-spacing:0; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-gift-amount span { color: rgba(255,255,255,0.3); letter-spacing: 2px; margin-left: 10px; font-size: 15px; font-weight: bold; text-transform: uppercase; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-gift-instruction { color: #fff; text-shadow: 0 1px rgba(0,0,0,0.2); line-height: 130%; font-size: 12px; text-align: center; padding: 0 19px; padding: 15px 20px 9px; border-top: 2px dashed rgba(255,255,255,0.3); position: absolute; width: 100%; top:125px; left: 0; /**/ position: absolute; margin: 0; background: none; top: 6px; border: 0; padding: 8px 0 9px; left: 0; width: 75%; left: auto; font-size: 14px; font-weight: normal; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coins { top: inherit; bottom: 10px; left: 5%; width: 38%; height: 84px; border-radius: 6px; box-shadow: inset 0 3px rgba(0,0,0,0.05), 0 1px rgba(255,255,255,0.1); padding:9px 0 0; /**/ left:auto; right: 28%; width: 23%; padding: 9px 2px 0; height: 70px; box-shadow: inset 0 3px rgba(0,0,0,0.05), 0 0 0 1px rgba(255,255,255,0.1); background: rgba(0,0,0,0.15);bottom: 15px; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coins .lys-coin { float:left; width:50%; text-align:center; /**/ font-size: 18px; font-weight: bold; margin-bottom: 7px; width: 100%; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coins .lys-coin img { display:block; margin:0 auto; width: 18px !important; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coins .lys-plus { text-align: center; line-height: 20px; height: 20px; width: 20px; position: absolute; left: 50%; top:9px; margin: 0 0 0 -10px; color: rgba(255,255,255,0.4); text-shadow: 0 2px rgba(0,0,0,0.15); font-size: 14px; font-weight: bold; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coins-2 { } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-gift-or { text-align: center; line-height: 20px; height: 20px; width: 30px; position: absolute; left: 50%; bottom:45px; margin: -18px 0 0 -15px; color: rgba(255,255,255,0.5); text-shadow: 0 2px rgba(0,0,0,0.15); font-size: 11px; font-weight: bold; /**/ left: 31%; font-size: 14px; line-height: 36px; color: #fff; bottom: 35px; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coin-buy { font-weight: bold; font-size: 13px; text-align: center; background: #fff; clear: both; margin: 0 9px; border-radius: 3px; color: #2a5ea9; padding: 4px 0; box-shadow:0 3px rgba(0,0,0,0.15), inset 0 -2px rgba(0,0,0,0.15); /**/ font-size: 12px; line-height: 18px; color: #000;} #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coin-buy:hover { color:#333; background:#f9f9f9; cursor:pointer; box-shadow:0 3px rgba(0,0,0,0.15); } /* If it is locked due to insufficient chips: */ #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coin-buy-locked, #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coin-buy-locked:hover { background: rgba(0,0,0,0.22); color: rgba(255,255,255,0.4); font-weight: bold; text-shadow: 0 -1px rgba(0,0,0,0.3); box-shadow: inset 0 2px 3px rgba(0,0,0,0.25), 0 1px 0px 0px rgba(255,255,255,0.1); cursor:default; } /* OVERLAY > CONTENT AREA > EARN POINTS */ #lys-overlay #lys-box #lys-maincol .lys-earn { clear:both; margin: 0; padding: 14px 15px 14px 20px; border-bottom: 1px solid #ddd !important; background: #fff url(//../img/box-bg.png) repeat-x left 10px !important; border-top: 1px solid #fff !important; text-shadow: 1px 1px #fff !important; } #lys-overlay #lys-box #lys-maincol .lys-earn:hover {background:#fff url(//../img/box-bg.png) repeat-x left -12px !important;} #lys-overlay #lys-box #lys-maincol .lys-earn .lys-holder { float:right; margin-top:-3px; width:24%; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-ask { font-size: 16px; line-height: 140%; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-ask .lys-ask-no { float: left; width: 25px; height: 25px; text-align: center; line-height: 25px; margin: 0 10px 5px 0; background: #b73ba5; border-radius: 20px; color: #fff; font-weight: bold; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-ask-subtitle { font-size: 14px; margin-top: 7px; color: #999; margin-left: 37px; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-button { cursor:pointer; font-weight: bold; font-size: 13px; text-align: center; background: #b73ba5; clear: both; margin:-1px 0 0; border-radius: 3px; color: #fff !important; text-shadow:0 -1px rgba(0,0,0,0.2); padding: 8px 12px; box-shadow: inset 0 -2px rgba(0,0,0,0.15); max-width: 150px; width: 100%; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-button:hover { background:#77266a; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-coin { display: inline; float: right; width: 23%; padding-top:2px; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-coin-img { display: inline; margin: 0 1px 0 10px; vertical-align: -4px; width: 16px !important; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-coin-pts { display: inline; vertical-align: -1px; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-ask .lys-icon { float:left; border: 0 !important; border-radius: 0; background: transparent; width: 28px !important; margin: -3px 15px 0 -4px; } #lys-overlay #lys-box #lys-content {position:relative !important;height:445px;padding:0; padding-right:0 !important; background-size:contain; overflow-y: scroll; } #lys-overlay #lys-box #lys-content .lys-tab { padding:24px 28px; padding-right:0 !important; } #lys-overlay #lys-box #lys-content .lys-tab .lys-gift-success { z-index:100; display:block; padding:30px; position:absolute; left:0; top:0; width:100%; height:100%; background:#fff url(../img/elements/overlay-gifts.jpg) no-repeat center top; background-size:contain; } #lys-overlay #lys-box #lys-content .lys-tab .lys-gift-success .lys-gift-code { cursor:text; width:80%; margin:30px auto; height:125px; font-size:48px; font-weight:bold; text-align:center; padding:32px 0; border:4px solid #3a88b7; color:#3a88b7 !important; border-radius:6px; } #lys-overlay #lys-box #lys-content .lys-tab .lys-gift-success .lys-gift-link { position: absolute; bottom: 45px; text-align: center; width: 100%; left: 0; color: #3a88b7 !important; font-size: 18px; text-decoration: underline; } #lys-overlay #lys-box #lys-content .lys-tab .lys-gift-success .lys-maincol-subtitle { display:block; clear:both; font-size:18px; color:#888; font-weight:normal; line-height:130%; text-align:center; margin-bottom:35px; } #lys-overlay #lys-box #lys-content .lys-tab .lys-gift-success .lys-maincol-subtitle strong { display:block; clear:both; font-size:18px; color:#888; font-weight:bold; line-height:130%; text-align:center; } #lys-overlay #lys-box #lys-content .lys-tab3 { padding:0; } #lys-overlay #lys-box .lys-content-scoreboared {height:419px !important;border-radius:0 0 5px 5px !important;overflow-y:scroll !important;padding:0 !important;} #lys-overlay #lys-box #lys-content .lys-main {font-size:20px !important;padding-bottom:10px !important;margin-bottom:20px !important;border-bottom:1px solid #c4c4c4 !important;} #lys-overlay #lys-box #lys-content .lys-main-nomargin {margin-bottom:0 !important;} #lys-overlay #lys-box #lys-content .lys-main .lys-dots {float:right !important;padding-top:5px !important;} #lys-overlay #lys-box #lys-content .lys-main .lys-dots .lys-dot {float:right !important;margin-left:5px !important;width:10px !important;height:10px !important;background:#c4c4c4 !important;border-radius:10px !important;} #lys-overlay #lys-box #lys-content .lys-main .lys-dots .on {background:#e74c3c !important;} #lys-overlay #lys-box #lys-content .lys-main .lys-dots .off:hover {background:#ddd !important;} #lys-overlay #lys-box #lys-content .lys-activity {position:absolute !important;right:0 !important;top:0 !important;height:100% !important;width:192px !important;padding:0 20px !important;background:#fff8db !important;box-shadow:inset 2px 1px 3px rgba(0,0,0,0.1) !important;border-radius:0 0 5px 0 !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-title {display:block !important;margin:24px 0 15px !important;font-size:16px !important;font-weight:normal !important;text-transform:capitalize !important;letter-spacing:1px !important;color:#555 !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-line {padding:3px 0 0 !important;height:21px !important;line-height:20px !important;border-top:1px dotted rgba(0,0,0,0.15) !important;margin-top:2px !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-line .lys-pts {float:right !important;position:relative !important;background:#b73ba5 !important;color:#fff !important;text-shadow:-1px -1px rgba(0,0,0,0.25) !important;font-weight:bold !important;font-size:12px !important;padding:4px 7px !important;border-radius:3px !important;box-shadow:inset 0 -1px 3px rgba(0,0,0,0.25) !important;font-family:Arial, Helvetica, sans-serif !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-line .lys-pts .lys-arr {display:block !important;position:absolute !important;left:-4px !important;top:50% !important;margin-top:-6px !important;width:0 !important;height:0 !important;border-top:6px solid transparent !important;border-bottom:6px solid transparent !important;border-right:6px solid #b73ba5 !important;border-left:0 !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-line .lys-pts-red {background:#d34848 !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-line .lys-pts-red .lys-arr {border-right-color:#d34848 !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-box {margin:22px 0 !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-box img {float:left !important;margin-right:10px !important;border-radius:4px !important;box-shadow:0 1px 1px rgba(255,255,255,0.66) !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-box strong {font-weight:bold !important;font-size:14px !important;margin-bottom:4px !important;line-height:14px !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-box span {font-size:11px !important;line-height:13px !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-box a {font-size:11px !important;line-height:13px !important;color:#77266a !important;} #lys-overlay #lys-box #lys-content .lys-activity .lys-box .ico-gold {width:44px !important;height:44px !important;border-radius:4px !important;box-shadow:inset 0 -1px 3px rgba(0,0,0,0.25) !important;background:#777 url(../img/medal-gold.png) no-repeat center center !important;float:left !important;margin-right:10px !important;box-shadow:0 1px 1px rgba(255,255,255,0.66) !important;} #lys-overlay #lys-box #lys-content #lys-earn li {position:relative !important;float:left !important;width:195px !important;margin-right:12px !important;margin-bottom:15px !important;} #lys-overlay #lys-box #lys-content #lys-earn li.last {margin-right:0 !important;} #lys-overlay #lys-box #lys-content #lys-earn li img:hover {cursor:pointer !important;opacity:0.8 !important;} #lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder {position:relative !important;border:1px solid #ccc !important;padding:5px !important;border-radius:4px !important;height:118px !important;} #lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder:hover {border-color:#aaa !important;} #lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder em {position:absolute !important;right:0 !important;top:0 !important;background:#f7f7f7 !important;padding:4px !important;border-radius:0 4px 0 4px !important;font-style:normal !important;border-left:1px solid #ccc !important;border-bottom:1px solid #ccc !important;font-size:11px !important;cursor:default;} #lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder em strong {font-size:11px !important;display:inline !important;} #lys-overlay #lys-box #lys-content #lys-earn li .lys-ask {font-size:13px !important;margin:6px 0px 7px !important;line-height:14px !important;} #lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder div {padding:30px 0 0 !important;text-align:center !important;} #lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder div.fb-like {padding:0 !important;margin:0 auto !important;width:60px !important;} #lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder div#loyalis-twfollow-content {padding:40px 0 0 45px !important;text-align:center !important;} #lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder div a {display:inline !important;} #lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder div select,#lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder div input[type="text"] {display:inline !important;text-align:center !important;font-size:14px !important;border:1px solid #bbb !important;border-radius:3px !important;padding:3px !important;margin:2px !important;} #lys-overlay #lys-box #lys-content #lys-earn li div.lys-holder div select {font-size:11px !important;} #lys-overlay #lys-box #lys-content #lys-earn li div#loyalis-birthday div input[type=text] {width:80% !important;display:inline !important;text-align:center !important;font-size:14px !important;border:1px solid #bbb !important;border-radius:3px !important;padding:3px !important;margin:2px !important;} #lys-overlay #lys-box #lys-content #lys-earn li .lys-submit {display:block !important;margin:8px auto !important;position:relative !important;background:#b73ba5 !important;color:#fff !important;text-shadow:-1px -1px rgba(0,0,0,0.25) !important;font-weight:bold !important;font-size:13px !important;padding:6px 9px !important;border-radius:3px !important;box-shadow:inset 0 -1px 3px rgba(0,0,0,0.25) !important;font-family:Arial, Helvetica, sans-serif !important;cursor:pointer !important;} #lys-overlay #lys-box #lys-content #lys-earn li .lys-center {display:block !important;padding-top:46px !important;font-size:18px !important;text-align:center !important;} #lys-overlay #lys-box #lys-content #lys-earn li .loyalis-survey span {cursor:pointer;font-weight:normal;letter-spacing:1px;font-size:9px;color:#888;margin-top:-15px;text-transform:uppercase;} #lys-overlay #lys-box #lys-content #lys-earn li .loyalis-survey span.lys-survey-center {font-size:14px;text-align:center;display:block;margin:5px 10px 0;line-height:17px;text-transform:none;font-weight:bold;} #lys-overlay #lys-box #lys-content #lys-earn li .lys-submit:hover {background:#555 !important;} #lys-overlay #lys-box #lys-content #lys-earn li #loyalis-fblogin-content a {position:absolute !important;left:20px !important;top:40px !important;width:142px !important;height:25px !important;line-height:25px !important;padding:5px !important;background-color:#2b4170 !important;background:-moz-linear-gradient(top, #3b5998, #2b4170) !important;background:-ms-linear-gradient(top, #3b5998, #2b4170) !important;background:-webkit-linear-gradient(top, #3b5998, #2b4170) !important;border:1px solid #2b4170 !important;text-shadow:0 -1px -1px #1f2f52 !important;color:#fff !important;font-size:16px !important;border-radius:4px !important;} #lys-overlay #lys-box #lys-content .lys-person {overflow:auto !important;padding:9px 0 !important;border-bottom:1px solid #ddd !important;background:#fff url(//../img/box-bg.png) repeat-x left 10px !important;border-top:1px solid #fff !important;text-shadow:1px 1px #fff !important;} #lys-overlay #lys-box #lys-content .lys-person:hover {background:#fff url(//../img/box-bg.png) repeat-x left -12px !important;} #lys-overlay #lys-box #lys-content .lys-rank-me { z-index: 9999999; border-radius: 6px; border: 1px solid #77266a !important; border-left: 4px solid #77266a !important; margin: 3px 2px; box-shadow: 0 1px 3px rgba(0,0,0,0.3); } #lys-overlay #lys-box #lys-content .lys-person-title {padding-top:2px !important;background:#fff url(//../img/box-bg.png) repeat-x left -35px !important;letter-spacing:1px !important;text-transform:uppercase !important;border-bottom:1px solid #ddd !important;text-shadow:1px 1px #fff !important;} #lys-overlay #lys-box #lys-content .lys-person-title .lys-rank {float:left !important;width:10% !important;line-height:26px !important;font-size:9px !important;text-align:center !important;color:#999 !important;} #lys-overlay #lys-box #lys-content .lys-person-title .lys-avatar {float:left !important;width:9% !important;line-height:26px !important;font-size:9px !important;text-align:center !important;color:#999 !important;} #lys-overlay #lys-box #lys-content .lys-person-title .lys-name {float:left !important;width:31% !important;line-height:26px !important;font-size:9px !important;text-align:left !important;color:#999 !important;} #lys-overlay #lys-box #lys-content .lys-person-title .lys-points {float:left !important;width:25% !important;line-height:26px !important;font-size:9px !important;text-align:left !important;padding-left:0 !important;color:#999 !important;} #lys-overlay #lys-box #lys-content .lys-person .lys-rank {float:left !important;width:10% !important;line-height:30px !important;font-size:15px !important;font-weight:bold !important;text-align:center !important;color:#bbb !important;} #lys-overlay #lys-box #lys-content .lys-person .lys-rank sup { display: inline !important; font-weight: normal !important; vertical-align: 5px !important; font-size: 11px !important; color: #aaa !important; } #lys-overlay #lys-box #lys-content .lys-person .lys-avatar {float:left !important;width:9% !important;height:30px !important;text-align:center !important;} #lys-overlay #lys-box #lys-content .lys-person .lys-avatar img {height: 40px !important; width: 40px !important; margin-top: -6px;} #lys-overlay #lys-box #lys-content .lys-person .lys-name {float:left !important;width:31% !important;height:30px !important;font-size:18px !important;font-weight:normal !important;text-align:left !important; line-height:30px;} #lys-overlay #lys-box #lys-content .lys-person .lys-name span {font-weight:normal !important;font-size:9px !important;margin-top:6px !important;letter-spacing:1px !important;text-transform:uppercase !important;color:#999 !important;} #lys-overlay #lys-box #lys-content .lys-person .lys-name .lys-medal {float:left !important;margin:-4px auto 0 !important;} #lys-overlay #lys-box #lys-content .lys-person .lys-points {float:left !important;width:25% !important;font-weight:bold !important;font-size:16px !important;line-height:19px !important;text-align:left !important;margin-top:-3px !important;} #lys-overlay #lys-box #lys-content .lys-person .lys-points span {font-weight:normal !important;text-transform:capitalize !important;font-size:12px !important;line-height:100% !important;margin-top:2px !important;} #lys-overlay #lys-box #lys-content .lys-person .lys-points-gold { background: url(../img/coin1.png) no-repeat left center !important; background-size: 30px !important; padding-left: 40px !important; } #lys-overlay #lys-box #lys-content .lys-person .lys-points-blue { background: url(../img/coin2.png) no-repeat left center !important; background-size: 30px !important; padding-left: 40px !important; font-weight: normal !important; opacity: 0.5 !important; } #lys-overlay #lys-box #lys-content .lys-person .lys-points .lys-gold-chips, #lys-overlay #lys-box #lys-content .lys-person .lys-points .lys-blue-chips { font-weight: bold !important; font-size: 16px !important; line-height: 19px !important; } #lys-overlay #lys-box #lys-content .lys-rank-me .lys-name, #lys-overlay #lys-box #lys-content .lys-rank-me .lys-rank { color: #77266a !important; } #lys-overlay #lys-box #lys-content .lys-achievements {width:410px !important;margin:-4px 0 0 -17px !important;} #lys-overlay #lys-box #lys-content .lys-achievements div {position:relative !important;width:25% !important;float:left !important;margin:0 0 22px !important;text-align:center !important;} #lys-overlay #lys-box #lys-content .lys-achievements div.lys-row {width:100% !important;float:none !important;margin:0 !important;} #lys-overlay #lys-box #lys-content .lys-achievements div.lys-off {opacity:0.33 !important;} #lys-overlay #lys-box #lys-content .lys-achievements div img {margin:0 auto !important;} #lys-overlay #lys-box #lys-content .lys-achievements div span.lys-no {position:absolute !important;width:66px !important;display:block !important;text-align:center !important;top:25px !important;left:50% !important;margin-left:-33px !important;font-weight:bold !important;font-size:18px !important;color:#fff !important;text-shadow:0 -1px rgba(0,0,0,0.33) !important;} #lys-overlay #lys-box #lys-content .lys-achievements div strong {display:block !important;line-height:150% !important;font-size:12px !important;font-weight:bold !important;color:#333 !important;} #lys-overlay #lys-box #lys-content .lys-achievements div p {font-size:10px !important;margin:0 !important;padding:5px 0 0 0 !important;line-height:120% !important;color:#999 !important;} #lys-overlay #lys-box #lys-content .lys-achievements div.lys-clear {clear:both !important;width:100% !important;margin:0 !important;} #lys-overlay #lys-box #lys-content .lys-help-question { clear:both; margin: 0; padding: 14px 15px 14px 20px; border-bottom: 1px solid #ddd !important; background: #fff url(//../img/box-bg.png) repeat-x left bottom !important; border-top: 1px solid #fff !important; text-shadow: 1px 1px #fff !important; font-weight:bold; font-size:16px; line-height:140%; color: #77266a; } #lys-overlay #lys-box #lys-content .lys-help-question:hover { color:#000; cursor:pointer; } #lys-overlay #lys-box #lys-content .lys-help-answer { display:none; margin:3px 0 1px; font-weight:normal; } #lys-overlay #lys-box #lys-content .lys-help-question * { font-size:14px; line-height:150%; } #lys-overlay #lys-box #lys-content .lys-help-answer strong { display:inline !important; } #lys-overlay #lys-box #lys-content .lys-help-answer img { display:inline !important; vertical-align: -3px; width: 16px !important; } #lys-overlay #lys-box #lys-content .lys-help-answer a { display:inline; text-decoration:underline; } #lys-overlay .poweredbyloyalis { display:block; width:85px; height:30px; text-indent:-999999px; position:fixed; left:20px; bottom:15px; background:url(../website/loyalis/frontend/img/logo-white-2x.png) no-repeat left bottom; background-size:contain; opacity:0.5; } #lys-overlay .poweredbyloyalis:hover { opacity:1; } /* SURVEY STYLING */ .lys-clear {clear:both !important;} .lys-hidden {display:none;} #lys-stripe #lys-wrapper #lys-btnfacebook .lys-hidden {display:none;} #footer_wrapper {margin:-100px 0 100px !important;position:relative !important;} .AddThisButtonBox {min-width:75%;} #lys-survey {overflow:hidden;z-index:10001 !important;position:fixed !important;right:50px !important;bottom:-1000px;display:none;color:#444;min-width:240px;box-shadow:0 1px 5px 1px rgba(0,0,0,0.2);border-radius:5px;min-height:inherit !important;background:#f4f4f4 !important;font-family:arial, sans-serif !important;text-shadow:none !important;text-decoration:none !important; max-width: 320px;} #lys-survey h4 {padding:20px 15px 15px;font-size:15px;font-weight:normal;color:#000;text-shadow:none;margin:0;background:#fff;border-bottom:1px solid #e5e5e5;} #lys-survey .lys-answer {display:block;width:100%;box-sizing:border-box !important;padding:10px 15px;border-bottom:1px solid #e5e5e5;margin:0;color:#666;background:#fff;font-family:arial, sans-serif;font-size:11px;cursor:default;} #lys-survey .lys-answer:hover {background:#ffffdd;cursor:pointer;} #lys-survey .lys-answer input {margin:0;padding:0;float:right;} #lys-survey .lys-answer input:hover {opacity:0.8;} #lys-survey .lys-submit {float:right;margin:16px 15px;line-height:25px !important;padding:4px 18px !important;text-align:center !important;background-color:#77266a !important;background:-moz-linear-gradient(top, #b73ba5, #77266a) !important;background:-ms-linear-gradient(top, #b73ba5, #77266a) !important;background:-webkit-linear-gradient(top, #b73ba5, #77266a) !important;text-shadow:0 -1px -1px #1f2f52 !important;color:#fff !important;font-size:12px !important;border:0;border-radius:4px !important;font-family:arial, sans-serif;text-transform:none !important;letter-spacing:0 !important;font-weight:normal !important;display:block;box-shadow:inset 0 -3px 0 rgba(0,0,0,0.25);height:33px !important;cursor:pointer;} #lys-survey .lys-submit:hover {opacity:0.8;} #lys-survey .lys-cancel {float:left;margin:16px 15px;line-height:25px !important;padding:4px 18px !important;text-align:center !important;background-color:#ccc !important;background:-moz-linear-gradient(top, #ddd, #ccc) !important;background:-ms-linear-gradient(top, #ddd, #ccc) !important;background:-webkit-linear-gradient(top, #ddd, #ccc) !important;color:#222 !important;font-size:12px !important;border:0;border-radius:4px !important;font-family:arial, sans-serif;text-transform:none !important;letter-spacing:0 !important;font-weight:normal !important;display:block;box-shadow:inset 0 -3px 0 rgba(0,0,0,0.1);height:25px !important;cursor:pointer;} #lys-survey .lys-cancel:hover {opacity:0.8;} #lys-survey .lys-header {position:relative;background-color:#eee !important;background:-moz-linear-gradient(top, #fcfcfc, #eee) !important;background:-ms-linear-gradient(top, #fcfcfc, #eee) !important;background:-webkit-linear-gradient(top, #fcfcfc, #eee) !important;padding:8px 15px 6px;font-size:9px;text-transform:uppercase;font-weight:bold;letter-spacing:1px;color:#888;text-shadow:0 1px #fff;border-bottom:1px solid #e2e2e2;} #lys-survey .lys-header .lys-survey-close {font-size:13px;text-decoration:none;color:#888;background:#fff;width:12px;height:12px;line-height:12px;text-align:center;font-weight:bold;border-radius:16px;border:2px solid #ddd;position:absolute;right:7px;top:5px;} #lys-survey .lys-header .lys-survey-close:hover {color:#000;border-color:#aaa;} .lys-rank img.lys-medal {margin:-4px auto 0 !important;} .backLava { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.2) !important; border-radius: 31px !important; box-shadow: 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px rgba(255, 255, 255, 0.1) !important; cursor: default !important; height:31px !important; max-height: 31px !important; max-width: 117px !important; margin-left:10px !important; } .slimScrollDiv {overflow:visible !important; clear:both !important;} #lys-all-activity-tab {overflow: hidden; display:none;position:relative;} .lys-error {color:red !important;text-shadow: 0 0 4px #fff !important;} #scrollbox3 { overflow: auto; width: 400px; height: 360px; padding: 0 5px; border: 1px solid #b7b7b7; } .track3 { width: 10px; background: rgba(0, 0, 0, 0); margin-right: 2px; border-radius: 10px; -webkit-transition: background 250ms linear; transition: background 250ms linear; } .track3:hover, .track3.dragging { background: #d9d9d9; /* Browsers without rgba support */ background: rgba(0, 0, 0, 0.15); } .handle3 { width: 7px; right: 0; background: #999; background: rgba(0, 0, 0, 0.4); border-radius: 7px; -webkit-transition: width 250ms; transition: width 250ms; } .track3:hover .handle3, .track3.dragging .handle3 { width: 10px; } .lys-survey-completed { text-decoration: line-through !important; } /* added by Boban */ #joyRideTipContent { display: none; } .joyRideTipContent { display: none; } /* Default styles for the container */ .joyride-tip-guide { position: fixed; background: #000; background: rgba(0,0,0,0.8); display: none; color: #fff; width: 300px; z-index: 103; bottom: 70px; left: 0; font-family: "HelveticaNeue", "Helvetica Neue", "Helvetica", Helvetica, Arial, Lucida, sans-serif; font-weight: normal; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } .joyride-content-wrapper { padding: 10px 10px 15px 15px; color: #fff; } /* Mobile */ @media only screen and (max-width: 767px) { .joyride-tip-guide { width: 95% !important; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; left: 2.5% !important; } .joyride-tip-guide-wrapper { width: 100%; } } /* Add a little css triangle pip, older browser just miss out on the fanciness of it */ .joyride-tip-guide span.joyride-nub { display: block; position: absolute; left: 22px; width: 0; height: 0; border: solid 14px; border: solid 14px; } .joyride-tip-guide span.joyride-nub.top { /* IE7/IE8 Don't support rgba so we set the fallback border color here. However, IE7/IE8 are also buggy in that the fallback color doesn't work for border-bottom-color so here we set the border-color and override the top,left,right colors below. */ border-color: #000; border-color: rgba(0,0,0,0.8); border-top-color: transparent !important; border-left-color: transparent !important; border-right-color: transparent !important; border-top-width: 0; top: -14px; bottom: none; } .joyride-tip-guide span.joyride-nub.bottom { /* IE7/IE8 Don't support rgba so we set the fallback border color here. However, IE7/IE8 are also buggy in that the fallback color doesn't work for border-top-color so here we set the border-color and override the bottom,left,right colors below. */ border-color: #000; border-color: rgba(0,0,0,0.8) !important; border-bottom-color: transparent !important; border-left-color: transparent !important; border-right-color: transparent !important; border-bottom-width: 0; bottom: -14px; bottom: none; } .joyride-tip-guide span.joyride-nub.right { border-color: #000; border-color: rgba(0,0,0,0.8) !important; border-top-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; border-right-width: 0; top: 22px; bottom: none; left: auto; right: -14px; } .joyride-tip-guide span.joyride-nub.left { border-color: #000; border-color: rgba(0,0,0,0.8) !important; border-top-color: transparent !important; border-left-color: transparent !important; border-bottom-color: transparent !important; border-left-width: 0; top: 22px; left: -14px; right: auto; bottom: none; } .joyride-tip-guide span.joyride-nub.top-right { border-color: #000; border-color: rgba(0,0,0,0.8); border-top-color: transparent !important; border-left-color: transparent !important; border-right-color: transparent !important; border-top-width: 0; top: -14px; bottom: none; left: auto; right: 28px; } /* Typography */ .joyride-tip-guide h1,.joyride-tip-guide h2,.joyride-tip-guide h3,.joyride-tip-guide h4,.joyride-tip-guide h5,.joyride-tip-guide h6 { line-height: 1.25 !important; margin: 0 !important; font-weight: bold !important; color: #fff !important; } .joyride-tip-guide h1 { font-size: 30px; } .joyride-tip-guide h2 { font-size: 26px; } .joyride-tip-guide h3 { font-size: 22px; } .joyride-tip-guide h4 { font-size: 18px !important; margin: 0 0 -7px !important; } .joyride-tip-guide h5 { font-size: 16px; } .joyride-tip-guide h6 { font-size: 14px; } .joyride-tip-guide p { margin: 0 0 16px 0 !important; font-size: 16px !important; line-height: 22px !important; color: #fff !important; } .joyride-tip-guide a { color: rgb(255,255,255); text-decoration: none; border-bottom: dotted 1px rgba(255,255,255,0.6); } .joyride-tip-guide a:hover { color: rgba(255,255,255,0.8); border-bottom: none; } /* Button Style */ .joyride-tip-guide .joyride-next-tip { float:right; display:block !important;margin:-8px auto 9px !important;position:relative !important;background:#b73ba5 !important;color:#fff !important;text-shadow:-1px -1px rgba(0,0,0,0.25) !important;font-weight:bold !important;font-size:13px !important;padding:6px 9px !important;border-radius:3px !important;box-shadow:inset 0 -1px 3px rgba(0,0,0,0.25) !important;font-family:Arial, Helvetica, sans-serif !important;cursor:pointer !important; border:0; } /*.joyride-next-tip:hover { color: rgb(255,255,255) !important; border: solid 1px rgb(0,60,180) !important; background: rgb(43,128,255); background: -moz-linear-gradient(top, rgb(43,128,255) 0%, rgb(29,102,211) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(43,128,255)), color-stop(100%,rgb(29,102,211))); background: -webkit-linear-gradient(top, rgb(43,128,255) 0%,rgb(29,102,211) 100%); background: -o-linear-gradient(top, rgb(43,128,255) 0%,rgb(29,102,211) 100%); background: -ms-linear-gradient(top, rgb(43,128,255) 0%,rgb(29,102,211) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b80ff', endColorstr='#1d66d3',GradientType=0 ); background: linear-gradient(top, rgb(43,128,255) 0%,rgb(29,102,211) 100%); }*/ .joyride-timer-indicator-wrap { width: 50px; height: 3px; border: solid 1px rgba(255,255,255,0.1); position: absolute; right: 17px; bottom: 16px; } .joyride-timer-indicator { display: block; width: 0; height: inherit; background: rgba(255,255,255,0.25); } .joyride-close-tip { position: absolute; right: 10px; top: 10px; color: rgba(255,255,255,0.4) !important; text-decoration: none; font-family: Verdana, sans-serif; font-size: 10px; font-weight: bold; border-bottom: none !important; } .joyride-close-tip:hover { color: rgba(255,255,255,0.9) !important; } .joyride-modal-bg { position: fixed; height: 100%; width: 100%; background: rgb(0,0,0); background: transparent; background: rgba(0,0,0, 0.5); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); opacity: 0.5; z-index: 100; display: none; top: 0; left: 0; cursor: pointer; display: none !important; } .joyride-expose-wrapper { background-color: transparent; position: fixed !important; z-index: 102; /*-moz-box-shadow: 0px 0px 30px #ffffff; -webkit-box-shadow: 0px 0px 30px #ffffff; box-shadow: 0px 0px 30px #ffffff;*/ border: 2px solid red; } .joyride-expose-cover { background: transparent; position: absolute; z-index: 10000; top: 0px; left: 0px; } #joyRideTipContentStripe {display:none;} .on span {background: none repeat scroll 0 0 rgba(0, 0, 0, 0.2) !important; border-radius: 31px !important; box-shadow: 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px rgba(255, 255, 255, 0.1) !important; cursor: default !important;} @media screen and (min-width:1px) and (max-width:639px) { #lys-bar { left:0 !important; margin-left:0 !important; width:100% !important; border-radius:0 !important; } #lys-bar .lys-bar-box { width: 40% !important; height:55px !important; box-sizing: border-box !important; border-radius:0 !important; } #lys-bar .lys-bar-ranking { width: 34% !important; } #lys-bar .lys-bar-info { width: 50% !important; height:55px !important; box-sizing: border-box !important; border-radius:0 !important; width: 32% !important; line-height: 13px; padding-left: 2px; padding-right: 2px; } #lys-bar .lys-bar-rewards { width: 24% !important; } #lys-bar .lys-bar-help { width: 10% !important; height:55px !important; box-sizing: border-box !important; border-radius:0 !important; } #lys-bar .lys-rollout { width: 100% !important; box-sizing: border-box !important; margin: 0 !important; border: 0 !important; box-shadow: none !important; border-top: 1px solid #ccc !important; border-radius: 0 !important; } #lys-bar .lys-bar-box .lys-bar-avatar { display:none !important; } #lys-bar .lys-coins .lys-coin img { width: 10px; height: 10px; } #lys-bar .lys-coins .lys-coin div { font-size: 10px; } #lys-overlay #lys-box #lys-head #lys-bar { position:fixed !important; height:60px !important; } #lys-overlay { position:absolute !important; height:auto !important; background:none !important; box-shadow:inset 0 0 100px 100px rgba(0,0,0,0.75) !important; } #lys-overlay #lys-box { position:absolute !important; left: 0 !important; top: 0 !important; width: 100% !important; height: auto !important; margin:0 !important; box-shadow: 0 0 1px 1000px #000 !important; } #lys-overlay #lys-box #lys-account { display:none !important; } #lys-overlay #lys-box #lys-head { position: fixed; left: 0; top: 0; z-index: 99; } #lys-overlay #lys-box #lys-head a span { font-size:11px !important; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab1, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab2, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 { padding-left:5px; padding-right:5px; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab1 strong, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab2 strong, #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 strong { font-size:12px !important; line-height:18px !important; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 .lys-coins .lys-coin img { width: 10px; height: 10px; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab3 .lys-coins .lys-coin div { font-size: 10px; } #lys-overlay #lys-box #lys-head #lys-bar #lys-tab4 { height: 60px !important; padding:33px 0 0 !important; font-size:24px !important; background-color: rgba(0,0,0,0.4) !important; } #lys-overlay #lys-box #lys-head a.backLava { display:none !important; } #lys-overlay #lys-box #lys-head a span.selectedLava { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.2) !important; border-radius: 31px !important; box-shadow: 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px rgba(255, 255, 255, 0.1) !important; cursor: default !important; } #lys-overlay #lys-box #lys-maincol { float:left; position:relative !important; padding-top:60px !important; width:100% !important; height:auto !important; box-sizing:border-box !important; } #lys-overlay #lys-box #lys-maincol .lys-maincol-title { font-size:18px !important; } #lys-overlay #lys-box #lys-maincol .lys-maincol-subtitle { font-size:14px !important; } #lys-overlay #lys-box #lys-maincol .lys-maincol-subtitle a { font-size:14px !important; } #lys-overlay #lys-box #lys-content { float:left; position: relative !important; height:auto !important; width:100% !important; z-index:98; } #lys-overlay #lys-box #lys-content .lys-tab3 .lys-person .lys-name { font-size:12px !important; font-weight:bold !important; } #lys-overlay #lys-box #lys-content .lys-tab3 .lys-person .lys-avatar img { width: 24px !important; height: 24px !important; margin-top: 2px; } #lys-overlay #lys-box #lys-content .lys-tab2 .lys-person-title .lys-points { display:none !important; } #lys-overlay #lys-box #lys-content .lys-tab2 .lys-person-title .lys-avatar { width:64% !important; } #lys-overlay #lys-box #lys-content .lys-person .lys-points .lys-gold-chips, #lys-overlay #lys-box #lys-content .lys-person .lys-points .lys-blue-chips, #lys-overlay #lys-box #lys-content .lys-person .lys-points-blue, #lys-overlay #lys-box #lys-content .lys-person .lys-points-gold { font-size:14px !important; background:none !important; padding-left:0 !important; } #lys-overlay #lys-box #lys-content .lys-person .lys-avatar img { height: 30px !important; width: 30px !important; margin-top: -1px; } #lys-overlay #lys-box #lys-content .lys-help-answer { display:block !important; } #lys-overlay #lys-box #lys-maincol .lys-gifts { left:0 !important; width:100% !important; } #lys-overlay #lys-box #lys-maincol .lys-gift-wrapper { opacity: 1 !important; left: auto; float: none; position: relative; margin: 0 auto 0; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-gift-or { display:none; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coins-1 { bottom: 4px !important; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-coins-2 { width: 137px !important; bottom: 4px !important; right: 27% !important; } #lys-overlay #lys-box #lys-maincol .lys-gift .lys-gift-instruction { padding-top:3px; } #lys-overlay #lys-box #lys-maincol .lys-earn { overflow:auto; padding:10px 10px 10px 10px !important; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-ask .lys-icon { width:26px !important; margin: 1px 5px 0 0; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-ask { font-size:12px; font-weight:bold; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-coin { display: block; margin-top:-3px; float: left; width: 50%; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-coin-pts { font-size:11px; font-weight:normal; vertical-align: -2px; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-coin-img { vertical-align: -3px; width: 12px; height: 12px; margin:0; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-ask-subtitle { font-size: 12px; margin-top: 20px; clear:both; color: #999; margin-left: 32px; font-weight: normal; font-style: normal; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-holder { margin-top:0 !important; width:35% !important; } #lys-overlay #lys-box #lys-maincol .lys-earn .lys-button { font-size:12px !important; } #lys-overlay #lys-box #lys-content .lys-tab .lys-gift-success .lys-gift-code { width:100%; margin:10px auto; font-size:28px; font-weight:bold; text-align:center; padding:32px 0; border:4px solid #3a88b7; color:#3a88b7 !important; border-radius:6px; } #lys-stripe { } #lys-overlay .lys-close { position:fixed !important; top: 0 !important; background-size: 20px !important; background-position: center center !important; width: 10% !important; right: 0 !important; background-color: #000 !important; height: 30px !important; } #lys-stripe #lys-wrapper { width:100% !important; padding-top:4px !important; } #lys-stripe #lys-wrapper span { line-height: 15px !important; font-size: 13px !important; font-weight: normal !important; } #lys-onboard { position:fixed; display: block; width: 100%; left: 0; margin: 0; top: 0; border-radius: 0; height: 100%; } #lys-onboard .lys-onboard-tagline { margin:0 0 20px; font-size:14px; font-weight:bold; } #lys-onboard .lys-onboard-title { font-size:18px; } #lys-onboard .lys-onboard-content { padding:25px 0 5px; } #lys-onboard .lys-onboard-avatar img.lys-avatar { width:100%; } } @media screen and (min-width:640px) and (max-width:959px) {} @media screen and (min-width:960px) and (max-width:1279px) {} @media screen and (min-width:1280px) and (max-width:1599px) {} @media screen and (min-width:1600px) {} @media screen and (min-width:1920px) {} @media print {} .fb_iframe_widget iframe.fb_iframe_widget_lift { position: fixed !important; bottom: 25px !important; } /* ---------------------------- * * Animation - http://daneden.me/animate * * --------------------------- */ .animation { visibility: hidden; } .animation.delay { -webkit-animation-delay: 1.5s; -moz-animation-delay: 1.5s; -o-animation-delay: 1.5s; animation-delay: 1.5s; } .animation.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animation.animating { visibility: visible; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animation.animated { visibility: visible; } .animation.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes pulse { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes rubberBand { 0% { -webkit-transform: scale(1); transform: scale(1); } 30% { -webkit-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% { -webkit-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% { -webkit-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes rubberBand { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 30% { -webkit-transform: scaleX(1.25) scaleY(0.75); -ms-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% { -webkit-transform: scaleX(0.75) scaleY(1.25); -ms-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% { -webkit-transform: scaleX(1.15) scaleY(0.85); -ms-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; } @-webkit-keyframes 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 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); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing { 20% { -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(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: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); transform: translateX(0%); } } @keyframes wobble { 0% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); -ms-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); -ms-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); -ms-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); -ms-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); -ms-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(0.3); transform: scale(0.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(0.9); transform: scale(0.9); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(0.3); -ms-transform: scale(0.3); transform: scale(0.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); } 100% { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(0.95); transform: scale(0.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(0.3); transform: scale(0.3); } } @keyframes bounceOut { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(0.95); -ms-transform: scale(0.95); transform: scale(0.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(0.3); -ms-transform: scale(0.3); transform: scale(0.3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig { 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); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes 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); } } .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; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -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) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } .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) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } } @keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); -ms-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); -ms-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } } .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) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } @keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } @keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(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-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); 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% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) 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 center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); 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: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); 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: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); 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: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); 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: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes slideOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes slideOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } @-webkit-keyframes slideInUp { 0% { -webkit-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 0; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInUp { 0% { -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; } @-webkit-keyframes slideOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes slideOutDown { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); transform: rotate(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: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); -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: translateY(700px); transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(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: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(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% { -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(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; } 80% { -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(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; opacity: 1; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes 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(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } @keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { 0% { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 100% { opacity: 0; } } @keyframes zoomOut { 0% { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 100% { opacity: 0; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } @-webkit-keyframes slideInDown { 0% { -webkit-transform: translateY(-100%); transform: translateY(-100%); visibility: visible; } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } #lys-stripe-mini { position: fixed; background-color: #b73ba5; width: 40px; height: 40px; top: -200px; right: 70px; z-index: 1001; cursor: pointer; border: 1px solid #77266a !important; border-radius: 0 0 7px 7px; box-shadow: 0 2px 1px rgba(0, 0, 0, 0.07) inset, 0 6px 10px rgba(0, 0, 0, 0.15) inset, 0 -1px 0 rgba(255, 255, 255, 0.15) inset, 0 2px 0 rgba(0, 0, 0, 0.15) !important; height: 30px; width: auto; padding: 0 15px 2px; } #lys-stripe-mini-bottom { position: fixed; background-color: #b73ba5; width: 40px; height: 40px; bottom: -200px; right: 50%; margin-right:-20px; z-index: 1001; cursor: pointer; border: 1px solid #77266a !important; border-radius: 7px 7px 0 0; box-shadow: 0 2px 1px rgba(0, 0, 0, 0.07) inset, 0 6px 10px rgba(0, 0, 0, 0.15) inset, 0 -1px 0 rgba(255, 255, 255, 0.15) inset, 0 2px 0 rgba(0, 0, 0, 0.15) !important; width: auto; height: 30px; padding: 0px 20px; } @media screen and (min-width:1px) and (max-width:1340px) { #lys-stripe-mini { top: auto !important; bottom: 0 !important; border-radius: 6px 6px 0 0 !important; } } .lys-logo-figure { background-image: none; background-position:center center; background-repeat: no-repeat; background-size: 26px; width: 40px; height: 40px; display:block; margin:0 !important; padding:0 !important; cursor: pointer; z-index: 1002; background-image: none; color: #fff; line-height: 32px; width: auto; font-size: 14px; font-weight: bold; letter-spacing: 1px; text-transform: uppercase; text-shadow: 0 1px 1px rgba(0,0,0,0.25); } .lys-hideMe { background-color: #fff; border: 1px solid #fff; color: #77266a; font-weight: bold; position: absolute; right: 15px; text-align: center; top: 13px; cursor: pointer; border-radius: 35px; border-bottom: 1px solid #fff !important; border-left: 1px solid #fff !important; border-right: 1px solid #fff !important; border-top: 1px solid #fff !important; box-shadow: 0 2px 1px rgba(255, 255, 255, 0.07) inset, 0 6px 10px rgba(255, 255, 255, 0.15) inset, 0 -1px 0 rgba(0, 0, 0, 0.15) inset, 0 2px 0 rgba(255, 255, 255, 0.15) !important; width: 15px; height: 15px; line-height: 15px; } /* added by boban */ .lys-bar-help #lys-bar-close { font-size: 8px; height: 15px; line-height: 35px; position: absolute; bottom: 10px; right: 3px; } .lys-bar-hide { cursor: pointer; font-weight: bold; height: 16px; line-height: 16px; position: absolute; right: -10px; text-align: center; top: -38px; width: 16px; font-size: 10px; } /* CUSTOM */ div#fancy_outer { z-index:99999999 !important; } .lys-1681db38-2f0f5c05-page #QuickSearch { top:103px !important; } .lys-top-bar-1681db38-2f0f5c05 #QuickSearch { top:143px !important; }