Monday, 4 August 2014
SHOPPING CART BLOGGER TEMPLATE PART 1
READ MORE:
------------------------------------------------------------------------------------------------------------
http://fbgadgets.blogspot.co.uk/2014/08/shopping-cart-blogger-template.html
http://www.ecwid.com/features
http://fbgadgets.blogspot.co.uk/2014/08/shopping-cart-template-with-view-cart.html
http://fbgadgets.blogspot.co.uk/2014/08/shopping-cart-blogger-template-with.html
--------------------------------------------------------------------------------------------------------
COPY AND PASTE BELOW CODE
----------------------------------------------------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8" ?>
<html>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: SIMPLE SHOPPING CART BLOGGER TEMPLATE
Design by : FBGadgets
URL : http://fbgadgets.blogspot.co.uk/
----------------------------------------------- */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
margin:0;
padding:0;
border:0;
outline:0;
font-family:inherit;
vertical-align:baseline;
}
/* remember to define focus styles! */:focus {
outline:0;
}
body,.body-fauxcolumn-outer {
line-height:1;
color:black;
background:white;
}
ol,ul {
list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse:separate;
border-spacing:0;
}
caption,th,td {
text-align:left;
font-weight:normal;
}
blockquote:before,blockquote:after,q:before,q:after {
content:"";
}
blockquote,q {
quotes:"" "";
}
img {
width:auto\9;
height:auto;
max-width:100%;
vertical-align:middle;
border:0;
-ms-interpolation-mode:bicubic;
}
#map_canvas img,.google-maps img {
max-width:none;
}
body {
margin:0;
padding:0;
color:#333333;
background:#F8F8F8 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR0cucQR9aZaKl0l_iwEX18avDgg1AgKG3snxBtqx4DZLt9XJUbjZ1EmwdkWWI6ZEI4vcqjaNc4Pr3vGvG-2XKuYS2CZWyxcEzgT3zEDAeiPfcyCAtwiQWSsLYIt_p2aQh7KrRpcYTxjc/s1600/body-Bg.png);
font:normal normal 13px Tahoma,Geneva,sans-serif;
line-height:1.6em;
}
a,a:visited {
color:#1cc3cd;
}
a:hover {
color:#191919;
text-decoration:none;
}
a,h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {
text-decoration:none;
}
hr {
border:0 solid #fff;
border-bottom-width:1px;
clear:both;
height:1px;
background:#ccc;
}
.container {
margin-left:auto;
margin-right:auto;
width:960px;
}
.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12 {
display:inline;
float:left;
margin-left:10px;
margin-right:10px;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
*zoom:1;
}
.grid_1 {
width:60px;
}
.grid_2 {
width:140px;
}
.grid_3 {
width:216px;
}
.grid_4 {
width:300px;
}
.grid_5 {
width:380px;
}
.grid_6 {
width:460px;
}
.grid_7 {
width:540px;
}
.grid_8 {
width:620px;
}
.grid_9 {
width:700px;
}
.grid_10 {
width:780px;
}
.grid_11 {
width:860px;
}
.grid_12 {
width: 940px;
}
/* http://sonspring.com/journal/clearing-floats */
.clear {
clear:both;
display:block;
overflow:hidden;
visibility:hidden;
width:0;
height:0;
}
.date-header {
display:none;
}
.header-wrapper {
position:relative;
padding-bottom:25px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNHKahtwIXE5cDDkiTQcPSQA3CN5HXUgLsNtbSm5NhhnhXsxT7s0cEK__ZKhHmfm-qn54xRbfujIVrGMFrpQEVYyGdk0opN6-NbD4cIRhCXqLcTCy0mH1SpyXvHh7kmGjX3BN9qP2cpbs/s1600/box-shadow.png) no-repeat bottom center;
z-index:20;
}
.header-container {
margin:0px auto;
width:960px;
min-height:70px;
background:#1cc3cd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiA4BWHbepHkLlDkIVdn_G-mWVvTo0musY9NHuUSy5JHL0veFUXwE5dSpNPYuLz4t6ysiTPN79nSG8GYe-FHKsd5De4jC6bzUwgbWQxYp2sIIE3Ip_IKLOP6dAjsGmWIjP8e5tBb-cXVdg/s1600/header-bg.png);
}
.header {
display:inline;
float:left;
width:300px;
margin:10px;
}
.header h1,.header h1 a {
color:#fff;
font-family:'Dancing Script',cursive;
fontsize:28px;
font-weight:400;
text-shadow:0px 1px 2px #333;
}
.menu {
display:inline;
float:left;
margin-right:10px;
margin-left:10px;
width:620px;
}
.menu ul {
margin-top:20px;
}
.menu ul li {
list-style:none;
display:inline;
float:left;
}
.menu ul li a {
displa:block;
padding:0.75em 1.25em;
color:#fff;
font-family:'Noto Sans',sans-serif;
font-size:14px;
text-shadow:0px 1px 1px #333;
}
.subMenu {
display:none;
margin:0;
list-style:none;
min-width:200px;
max-width:220px;
background:#fff;
position:absolute;
z-index:999;
border-top:5px solid #fff;
border-bottom:5px solid #fff;
border-radius:3px 3px 3px 3px;
-moz-box-shadow:1px 2px 5px #595959;
-webkit-box-shadow:1px 2px 5px #595959;
box-shadow:1px 2px 5px #595959;
}
.subMenu:before {
content:"";
display:block;
width:1px;
height:1px;
background:transparent;
border-top:8px solid transparent;
border-right:8px solid transparent;
border-bottom:8px solid #fff;
border-left:8px solid transparent;
position:absolute;
margin-top:-22px;
margin-left:20px;
}
.subMenu li {
display:inline-block;
float:none !important;
width:100%;
}
.subMenu li a {
display:block;
padding:5px !important;
color:#333 !important;
font-size:13px !important;
text-shadow:none !important;
}
.subMenu li a:hover {
background:#1cc3cd;
color:#fff !important;
}
.content-wrapper {
margin:0px auto;
width:960px;
background:#fff;
border:1px solid #ececec;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing: border-box;
}
.cross-content {
padding:10px 0px;
background: #f0f0f0 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8mYv6o-XpkapZs5EukqK7AXPuIsx44PG3DamW5Npu9pbMnFs__s7m-R0SGTVj_n7auZn-SSBMYnd9VZHD-nuxMvrTzk5ut9L2vFjW38dnP5CSNVhljzYLoGewS5FMNa-dWDZT1sjYp5s/s1600/info-box-bg.jpg);
border-top:1px solid #fff;
}
.search {
display:inline;
float:left;
margin:0px 10px;
width:780px;
}
.search input {
margin:0px;
padding:10px 10px 10px 25px;
width:95%;
border:0;
background: #ffffff;
-moz-border-radius:3px 3px 3px 3px;
-webkit-border-radius:3px 3px 3px 3px;
border-radius:3px 3px 3px 3px;
-moz-box-shadow:inset 0px 0px 3px #ccc;
-webkit-box-shadow:inset 0px 0px 3px #ccc;
box-shadow:inset 0px 0px 3px #ccc;
}
.cartwrp {
display:inline;
float:right;
margin-right:10px;
width:140px;
}
.cartInfo {
display:inline;
float:right;
margin:0px;
padding:7px 10px 7px 35px;
color:#fff;
background:#c2bfcd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdDbBgLNCXYVzOTk_nFxWCWscoTp4EGEzBTeSl6eem8iAnTBbS50euMHl684qEUT8bA9K5X61eKIfrAp7Ks-tCpvLUtVKXm74Lct2lID0BTnEfGbYV3pzyBM5dqZvIFDkuzkdwtnEASNs/s1600/cart.png) no-repeat left center;
-moz-border-radius:3px 3px 3px 3px;
-webkit-border-radius:3px 3px 3px 3px;
border-radius:3px 3px 3px 3px;
cursor:pointer;
}
.cartOn {
background:#1cc3cd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdDbBgLNCXYVzOTk_nFxWCWscoTp4EGEzBTeSl6eem8iAnTBbS50euMHl684qEUT8bA9K5X61eKIfrAp7Ks-tCpvLUtVKXm74Lct2lID0BTnEfGbYV3pzyBM5dqZvIFDkuzkdwtnEASNs/s1600/cart.png) no-repeat left center;
}
.cartBox {
display:none;
position:absolute;
z-index:9999;
width:200px;
min-height:30px;
background:#f0f0f0;
padding:10px;
margin-top:50px;
margin-left:-80px;
border-top: 3px solid #1cc3cd;
border-bottom: 3px solid #1cc3cd;
-moz-border-radius:3px 3px 3px 3px;
-webkit-border-radius:3px 3px 3px 3px;
border-radius:3px 3px 3px 3px;
-moz-box-shadow: 1px 2px 5px #000000;
-webkit-box-shadow: 1px 2px 5px #000000;
box-shadow: 1px 2px 5px #000000;
}
.cartBox:before {
content:"";
position:absolute;
display:block;
margin-top:-33px;
margin-left:120px;
width:1px;
height:1px;
background:transparent;
border-top: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #1cc3cd;
border-left: 10px solid transparent;
z-index:100;
}
a.simpleCart_empty {
display:block;
float:right;
margin:-5px -5px 0px 0px;
width:25px;
height:25px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiog0gzx3F49rF6k2kEmM9FkKw0p8kTthptRmEBNf_teWyBiPLRhv_SH3zKPRCfZCt49ySFwS_3OtMKoWL53P9Ak9c8m3CQ5YmIEW4Rp5XXbC16XSldcfEI9SCogu7rNWVmNemNamIskeI/s1600/cart-icon.png) no-repeat -1px -51px;
text-indent:-99999px;
}
.simpleCart_items table{
width:100%;
background:#fafafa;
border:1px solid #fff;
box-shadow:0px 0px 1px #dedede;
}
.simpleCart_items table tr.headerRow{
background: #f5f5f5;
}
.simpleCart_items table tr.headerRow th{
padding:10px;
font-size:16px;
font-weight:bold;
}
.simpleCart_items table tr.itemRow {
border-bottom: 1px solid #ddd;
margin-bottom:3px;
}
.simpleCart_items table tr.itemRow td{
padding:10px;
}
.total {
display:block;
text-align:right;
font-size:16px;
font-weight:bold;
}
.feed-links {display:none;}
.main-wrapper {
margin:0px 10px;
width:940px;
padding-top:25px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNHKahtwIXE5cDDkiTQcPSQA3CN5HXUgLsNtbSm5NhhnhXsxT7s0cEK__ZKhHmfm-qn54xRbfujIVrGMFrpQEVYyGdk0opN6-NbD4cIRhCXqLcTCy0mH1SpyXvHh7kmGjX3BN9qP2cpbs/s1600/box-shadow.png) no-repeat top center;
}
.post h3 {
font-family: 'Noto Sans', sans-serif;
font-size:20px;
font-weight:normal;
margin:10px 0px 20px 0px;
padding:5px 0px;
}
.post-data-meta {
display:inline;
float:left;
margin-right:20px;
width:220px;
}
.post-body {
display:inline;
float:left;
width:700px;
}
.post-footer {
clear:both;
}
.item_image {
padding:10px;
background:#fafafa;
border:1px solid #fff;
box-shadow:0px 0px 1px #dedede;
position:relative;
z-index:20;
}
img.item_thumb {
width: auto\9;
height: auto;
max-width: 100%;
vertical-align: middle;
border: 0;
-ms-interpolation-mode: bicubic;
}
.item_price {
margin-top:-40px;
padding:10px 20px;
font-size:18px;
color: #1cc3cd;
display:block;
position:absolute;
background:#fafafa;
z-index:99;
border-top:1px solid #fff;
border-radius:0px 3px 0px 0px;
}
.item_Description {
margin:-10px 10px 0px 10px;
padding:20px 10px 10px 10px;
background:#fafafa;
border:1px solid #fff;
box-shadow:0px 0px 1px #dedede;
}
.item-bottom {
padding:20px 10px 10px 10px;
margin-bottom:50px;
background:#fafafa;
border:1px solid #fff;
box-shadow:0px 0px 1px #dedede;
-moz-border-radius: 0px 0px 3px 3px;
-webkit-border-radius: 0px 0px 3px 3px;
border-radius: 0px 0px 3px 3px;
}
.item_Quantity {
padding:5px;
}
a.item_add {
position:relative;
margin:0px;
padding:10px 15px 10px 26px;
background:#1cc3cd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_D5blrQXhtgwrqx3V6N4mE7oSOfC1kDJboEPj07KY-TwSRf3KcYlWRwY9OkjxDCoWPcmuWSL0TCkgQRb3UFI-TZqkUoHyEF13eCLyLIIgGIm3XOhlSsSKvEpreucz9HX-SN8_w_Zsgx4/s1600/add-to-cart.png) no-repeat left center;
color:#ffffff;
min-width:90px;
text-align:center;
border-top:1px solid rgba(255, 255, 255, 0.4);
border-bottom:1px solid rgba(0, 0, 0, 0.4);
text-decoration:none;
border-radius:3px 3px 3px 3px;
transition:All 1s ease;
-webkit-transition:All .3s ease;
-moz-transition:All 3 ease;
-o-transition:All 3 ease;
}
a.item_add:hover {
background:#FF8821 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_D5blrQXhtgwrqx3V6N4mE7oSOfC1kDJboEPj07KY-TwSRf3KcYlWRwY9OkjxDCoWPcmuWSL0TCkgQRb3UFI-TZqkUoHyEF13eCLyLIIgGIm3XOhlSsSKvEpreucz9HX-SN8_w_Zsgx4/s1600/add-to-cart.png) no-repeat left center;
}
a.item_add:active {
border-bottom:1px solid rgba(255, 255, 255, 0.4);
border-top:1px solid rgba(0, 0, 0, 0.4);
}
.divider {
clear:both;
height:0px;
margin:15px 0px;
}
a.view-cart, a.view-cart:visited, a.simpleCart_checkout, a.simpleCart_checkout:visited {
padding:5px 15px 5px 25px;
background:#1cc3cd;
color:#fff;
-moz-border-radius:3px 3px 3px 3px;
-webkit-border-radius:3px 3px 3px 3px;
border-radius:3px 3px 3px 3px;
}
a.view-cart {
margin-right:5px;
}
.showpageArea {
margin:20px 0px 10px 0px;
}
.showpagePoint, .showpageNum {
margin:0px 3px;
padding:3px 8px;
background:#f8f8f8;
}
.showpagePoint {
background:#1cc3cd;
color:#fff;
}
.showpage {
margin:0px 3px;
}
.sidebar-wrapper {
margin:0px;
padding-top:10px;
padding-bottom:20px;
background:#ececec url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8mYv6o-XpkapZs5EukqK7AXPuIsx44PG3DamW5Npu9pbMnFs__s7m-R0SGTVj_n7auZn-SSBMYnd9VZHD-nuxMvrTzk5ut9L2vFjW38dnP5CSNVhljzYLoGewS5FMNa-dWDZT1sjYp5s/s1600/info-box-bg.jpg);
border-top: 1px solid #ececec;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.sidebar {
display:inline;
float:left;
width: 460px;
margin-left:10px;
}
.sidebar h2 {
margin-bottom:10px;
font-weight:bold;
font-size:12px;
text-shadow:0px 1px 1px #fff;
}
.sidebar .widget {
margin-top:10px;
margin-bottom:10px;
}
.slider-wrapper {
margin-top:-100px;
margin-right:auto;
margin-left:auto;
width:100%;
max-width:1600px;
min-height:300px;
background:#fff;
}
.footer-wrapper {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNHKahtwIXE5cDDkiTQcPSQA3CN5HXUgLsNtbSm5NhhnhXsxT7s0cEK__ZKhHmfm-qn54xRbfujIVrGMFrpQEVYyGdk0opN6-NbD4cIRhCXqLcTCy0mH1SpyXvHh7kmGjX3BN9qP2cpbs/s1600/box-shadow.png) no-repeat top center;
}
.footer {
padding:20px 0px;
}
]]></b:skin>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<style>
.blog-pager{clear:both}.post{display:inline;float:left;width:220px!important;margin:6px}.post .item_image img{width:100%;min-width:200px;height:130px}.post .item_price{margin-top:20px;padding:10px 10px;font-size:18px;display:block;position:absolute;border-top:none!important;background:#f8f8f8;z-index:99;border-radius:0 3px 0 0}.post a.post-judul{display:none;position:absolute;z-index:20;padding:5px;width:189px;height:120px;margin-top:-182px;text-align:left!important;text-decoration:none;text-transform:uppercase;color:#fafafa;background:rgba(0,0,0,0.8)}.post:hover a.post-judul{display:block;-webkit-animation-name:bounceIn;-moz-animation-name:bounceIn;-o-animation-name:bounceIn;animation-name:bounceIn}.post .item-bottom{padding:20px 10px 15px 10px;margin-bottom:0!important;background:#f8f8f8;text-align:right;border:1px solid #fff;box-shadow:0 0 1px #dedede;-moz-border-radius:0 0 3px 3px;-webkit-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px}.post .item_Description,.post h3,.post-header,.post-footer{display:none;margin:0}.post-body{width:auto!important}
</style>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == "static_page"'>
<style>
.post-body{width:100%;}
</style>
</b:if>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'/>
<style>
@charset "UTF-8";body{-webkit-backface-visibility:hidden}.animated{-webkit-animation-duration:1s;-moz-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both}.animated.hinge{-webkit-animation-duration:2s;-moz-animation-duration:2s;-o-animation-duration:2s;animation-duration:2s}@-webkit-keyframes flash{0%,50%,100%{opacity:1}25%,75%{opacity:0}}@-moz-keyframes flash{0%,50%,100%{opacity:1}25%,75%{opacity:0}}@-o-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;-moz-animation-name:flash;-o-animation-name:flash;animation-name:flash}@-webkit-keyframes shake{0%,100%{-webkit-transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px)}}@-moz-keyframes shake{0%,100%{-moz-transform:translateX(0)}10%,30%,50%,70%,90%{-moz-transform:translateX(-10px)}20%,40%,60%,80%{-moz-transform:translateX(10px)}}@-o-keyframes shake{0%,100%{-o-transform:translateX(0)}10%,30%,50%,70%,90%{-o-transform:translateX(-10px)}20%,40%,60%,80%{-o-transform:translateX(10px)}}@keyframes shake{0%,100%{transform:translateX(0)}10%,30%,50%,70%,90%{transform:translateX(-10px)}20%,40%,60%,80%{transform:translateX(10px)}}.shake{-webkit-animation-name:shake;-moz-animation-name:shake;-o-animation-name:shake;animation-name:shake}@-webkit-keyframes bounce{0%,20%,50%,80%,100%{-webkit-transform:translateY(0)}40%{-webkit-transform:translateY(-30px)}60%{-webkit-transform:translateY(-15px)}}@-moz-keyframes bounce{0%,20%,50%,80%,100%{-moz-transform:translateY(0)}40%{-moz-transform:translateY(-30px)}60%{-moz-transform:translateY(-15px)}}@-o-keyframes bounce{0%,20%,50%,80%,100%{-o-transform:translateY(0)}40%{-o-transform:translateY(-30px)}60%{-o-transform:translateY(-15px)}}@keyframes bounce{0%,20%,50%,80%,100%{transform:translateY(0)}40%{transform:translateY(-30px)}60%{transform:translateY(-15px)}}.bounce{-webkit-animation-name:bounce;-moz-animation-name:bounce;-o-animation-name:bounce;animation-name:bounce}@-webkit-keyframes tada{0%{-webkit-transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0)}}@-moz-keyframes tada{0%{-moz-transform:scale(1)}10%,20%{-moz-transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-moz-transform:scale(1.1) rotate(3deg)}40%,60%,80%{-moz-transform:scale(1.1) rotate(-3deg)}100%{-moz-transform:scale(1) rotate(0)}}@-o-keyframes tada{0%{-o-transform:scale(1)}10%,20%{-o-transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-o-transform:scale(1.1) rotate(3deg)}40%,60%,80%{-o-transform:scale(1.1) rotate(-3deg)}100%{-o-transform:scale(1) rotate(0)}}@keyframes tada{0%{transform:scale(1)}10%,20%{transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{transform:scale(1.1) rotate(3deg)}40%,60%,80%{transform:scale(1.1) rotate(-3deg)}100%{transform:scale(1) rotate(0)}}.tada{-webkit-animation-name:tada;-moz-animation-name:tada;-o-animation-name:tada;animation-name:tada}@-webkit-keyframes swing{20%,40%,60%,80%,100%{-webkit-transform-origin:top center}20%{-webkit-transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg)}}@-moz-keyframes swing{20%{-moz-transform:rotate(15deg)}40%{-moz-transform:rotate(-10deg)}60%{-moz-transform:rotate(5deg)}80%{-moz-transform:rotate(-5deg)}100%{-moz-transform:rotate(0deg)}}@-o-keyframes swing{20%{-o-transform:rotate(15deg)}40%{-o-transform:rotate(-10deg)}60%{-o-transform:rotate(5deg)}80%{-o-transform:rotate(-5deg)}100%{-o-transform:rotate(0deg)}}@keyframes swing{20%{transform:rotate(15deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-5deg)}100%{transform:rotate(0deg)}}.swing{-webkit-transform-origin:top center;-moz-transform-origin:top center;-o-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;-moz-animation-name:swing;-o-animation-name:swing;animation-name:swing}@-webkit-keyframes wobble{0%{-webkit-transform:translateX(0%)}15%{-webkit-transform:translateX(-25%) rotate(-5deg)}30%{-webkit-transform:translateX(20%) rotate(3deg)}45%{-webkit-transform:translateX(-15%) rotate(-3deg)}60%{-webkit-transform:translateX(10%) rotate(2deg)}75%{-webkit-transform:translateX(-5%) rotate(-1deg)}100%{-webkit-transform:translateX(0%)}}@-moz-keyframes wobble{0%{-moz-transform:translateX(0%)}15%{-moz-transform:translateX(-25%) rotate(-5deg)}30%{-moz-transform:translateX(20%) rotate(3deg)}45%{-moz-transform:translateX(-15%) rotate(-3deg)}60%{-moz-transform:translateX(10%) rotate(2deg)}75%{-moz-transform:translateX(-5%) rotate(-1deg)}100%{-moz-transform:translateX(0%)}}@-o-keyframes wobble{0%{-o-transform:translateX(0%)}15%{-o-transform:translateX(-25%) rotate(-5deg)}30%{-o-transform:translateX(20%) rotate(3deg)}45%{-o-transform:translateX(-15%) rotate(-3deg)}60%{-o-transform:translateX(10%) rotate(2deg)}75%{-o-transform:translateX(-5%) rotate(-1deg)}100%{-o-transform:translateX(0%)}}@keyframes wobble{0%{transform:translateX(0%)}15%{transform:translateX(-25%) rotate(-5deg)}30%{transform:translateX(20%) rotate(3deg)}45%{transform:translateX(-15%) rotate(-3deg)}60%{transform:translateX(10%) rotate(2deg)}75%{transform:translateX(-5%) rotate(-1deg)}100%{transform:translateX(0%)}}.wobble{-webkit-animation-name:wobble;-moz-animation-name:wobble;-o-animation-name:wobble;animation-name:wobble}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1)}50%{-webkit-transform:scale(1.1)}100%{-webkit-transform:scale(1)}}@-moz-keyframes pulse{0%{-moz-transform:scale(1)}50%{-moz-transform:scale(1.1)}100%{-moz-transform:scale(1)}}@-o-keyframes pulse{0%{-o-transform:scale(1)}50%{-o-transform:scale(1.1)}100%{-o-transform:scale(1)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}100%{transform:scale(1)}}.pulse{-webkit-animation-name:pulse;-moz-animation-name:pulse;-o-animation-name:pulse;animation-name:pulse}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) rotateY(0);-webkit-animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg);-webkit-animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-webkit-animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) rotateY(360deg) scale(.95);-webkit-animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px) scale(1);-webkit-animation-timing-function:ease-in}}@-moz-keyframes flip{0%{-moz-transform:perspective(400px) rotateY(0);-moz-animation-timing-function:ease-out}40%{-moz-transform:perspective(400px) translateZ(150px) rotateY(170deg);-moz-animation-timing-function:ease-out}50%{-moz-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-moz-animation-timing-function:ease-in}80%{-moz-transform:perspective(400px) rotateY(360deg) scale(.95);-moz-animation-timing-function:ease-in}100%{-moz-transform:perspective(400px) scale(1);-moz-animation-timing-function:ease-in}}@-o-keyframes flip{0%{-o-transform:perspective(400px) rotateY(0);-o-animation-timing-function:ease-out}40%{-o-transform:perspective(400px) translateZ(150px) rotateY(170deg);-o-animation-timing-function:ease-out}50%{-o-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-o-animation-timing-function:ease-in}80%{-o-transform:perspective(400px) rotateY(360deg) scale(.95);-o-animation-timing-function:ease-in}100%{-o-transform:perspective(400px) scale(1);-o-animation-timing-function:ease-in}}@keyframes flip{0%{transform:perspective(400px) rotateY(0);animation-timing-function:ease-out}40%{transform:perspective(400px) translateZ(150px) rotateY(170deg);animation-timing-function:ease-out}50%{transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);animation-timing-function:ease-in}80%{transform:perspective(400px) rotateY(360deg) scale(.95);animation-timing-function:ease-in}100%{transform:perspective(400px) scale(1);animation-timing-function:ease-in}}.flip{-webkit-backface-visibility:visible!important;-webkit-animation-name:flip;-moz-backface-visibility:visible!important;-moz-animation-name:flip;-o-backface-visibility:visible!important;-o-animation-name:flip;backface-visibility:visible!important;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);opacity:1}}@-moz-keyframes flipInX{0%{-moz-transform:perspective(400px) rotateX(90deg);opacity:0}40%{-moz-transform:perspective(400px) rotateX(-10deg)}70%{-moz-transform:perspective(400px) rotateX(10deg)}100%{-moz-transform:perspective(400px) rotateX(0deg);opacity:1}}@-o-keyframes flipInX{0%{-o-transform:perspective(400px) rotateX(90deg);opacity:0}40%{-o-transform:perspective(400px) rotateX(-10deg)}70%{-o-transform:perspective(400px) rotateX(10deg)}100%{-o-transform:perspective(400px) rotateX(0deg);opacity:1}}@keyframes flipInX{0%{transform:perspective(400px) rotateX(90deg);opacity:0}40%{transform:perspective(400px) rotateX(-10deg)}70%{transform:perspective(400px) rotateX(10deg)}100%{transform:perspective(400px) rotateX(0deg);opacity:1}}.flipInX{-webkit-backface-visibility:visible!important;-webkit-animation-name:flipInX;-moz-backface-visibility:visible!important;-moz-animation-name:flipInX;-o-backface-visibility:visible!important;-o-animation-name:flipInX;backface-visibility:visible!important;animation-name:flipInX}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px) rotateX(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateX(90deg);opacity:0}}@-moz-keyframes flipOutX{0%{-moz-transform:perspective(400px) rotateX(0deg);opacity:1}100%{-moz-transform:perspective(400px) rotateX(90deg);opacity:0}}@-o-keyframes flipOutX{0%{-o-transform:perspective(400px) rotateX(0deg);opacity:1}100%{-o-transform:perspective(400px) rotateX(90deg);opacity:0}}@keyframes flipOutX{0%{transform:perspective(400px) rotateX(0deg);opacity:1}100%{transform:perspective(400px) rotateX(90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;-webkit-backface-visibility:visible!important;-moz-animation-name:flipOutX;-moz-backface-visibility:visible!important;-o-animation-name:flipOutX;-o-backface-visibility:visible!important;animation-name:flipOutX;backface-visibility:visible!important}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-10deg)}70%{-webkit-transform:perspective(400px) rotateY(10deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);opacity:1}}@-moz-keyframes flipInY{0%{-moz-transform:perspective(400px) rotateY(90deg);opacity:0}40%{-moz-transform:perspective(400px) rotateY(-10deg)}70%{-moz-transform:perspective(400px) rotateY(10deg)}100%{-moz-transform:perspective(400px) rotateY(0deg);opacity:1}}@-o-keyframes flipInY{0%{-o-transform:perspective(400px) rotateY(90deg);opacity:0}40%{-o-transform:perspective(400px) rotateY(-10deg)}70%{-o-transform:perspective(400px) rotateY(10deg)}100%{-o-transform:perspective(400px) rotateY(0deg);opacity:1}}@keyframes flipInY{0%{transform:perspective(400px) rotateY(90deg);opacity:0}40%{transform:perspective(400px) rotateY(-10deg)}70%{transform:perspective(400px) rotateY(10deg)}100%{transform:perspective(400px) rotateY(0deg);opacity:1}}.flipInY{-webkit-backface-visibility:visible!important;-webkit-animation-name:flipInY;-moz-backface-visibility:visible!important;-moz-animation-name:flipInY;-o-backface-visibility:visible!important;-o-animation-name:flipInY;backface-visibility:visible!important;animation-name:flipInY}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px) rotateY(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateY(90deg);opacity:0}}@-moz-keyframes flipOutY{0%{-moz-transform:perspective(400px) rotateY(0deg);opacity:1}100%{-moz-transform:perspective(400px) rotateY(90deg);opacity:0}}@-o-keyframes flipOutY{0%{-o-transform:perspective(400px) rotateY(0deg);opacity:1}100%{-o-transform:perspective(400px) rotateY(90deg);opacity:0}}@keyframes flipOutY{0%{transform:perspective(400px) rotateY(0deg);opacity:1}100%{transform:perspective(400px) rotateY(90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;-webkit-animation-name:flipOutY;-moz-backface-visibility:visible!important;-moz-animation-name:flipOutY;-o-backface-visibility:visible!important;-o-animation-name:flipOutY;backface-visibility:visible!important;animation-name:flipOutY}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-moz-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-o-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;-moz-animation-name:fadeIn;-o-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes fadeInUp{0%{opacity:0;-moz-transform:translateY(20px)}100%{opacity:1;-moz-transform:translateY(0)}}@-o-keyframes fadeInUp{0%{opacity:0;-o-transform:translateY(20px)}100%{opacity:1;-o-transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:translateY(0)}}.fadeInUp{-webkit-animation-name:fadeInUp;-moz-animation-name:fadeInUp;-o-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes fadeInDown{0%{opacity:0;-moz-transform:translateY(-20px)}100%{opacity:1;-moz-transform:translateY(0)}}@-o-keyframes fadeInDown{0%{opacity:0;-o-transform:translateY(-20px)}100%{opacity:1;-o-transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}100%{opacity:1;transform:translateY(0)}}.fadeInDown{-webkit-animation-name:fadeInDown;-moz-animation-name:fadeInDown;-o-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0)}}@-moz-keyframes fadeInLeft{0%{opacity:0;-moz-transform:translateX(-20px)}100%{opacity:1;-moz-transform:translateX(0)}}@-o-keyframes fadeInLeft{0%{opacity:0;-o-transform:translateX(-20px)}100%{opacity:1;-o-transform:translateX(0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translateX(-20px)}100%{opacity:1;transform:translateX(0)}}.fadeInLeft{-webkit-animation-name:fadeInLeft;-moz-animation-name:fadeInLeft;-o-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0)}}@-moz-keyframes fadeInRight{0%{opacity:0;-moz-transform:translateX(20px)}100%{opacity:1;-moz-transform:translateX(0)}}@-o-keyframes fadeInRight{0%{opacity:0;-o-transform:translateX(20px)}100%{opacity:1;-o-transform:translateX(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translateX(20px)}100%{opacity:1;transform:translateX(0)}}.fadeInRight{-webkit-animation-name:fadeInRight;-moz-animation-name:fadeInRight;-o-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes fadeInUpBig{0%{opacity:0;-moz-transform:translateY(2000px)}100%{opacity:1;-moz-transform:translateY(0)}}@-o-keyframes fadeInUpBig{0%{opacity:0;-o-transform:translateY(2000px)}100%{opacity:1;-o-transform:translateY(0)}}@keyframes fadeInUpBig{0%{opacity:0;transform:translateY(2000px)}100%{opacity:1;transform:translateY(0)}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;-moz-animation-name:fadeInUpBig;-o-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translateY(-2000px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes fadeInDownBig{0%{opacity:0;-moz-transform:translateY(-2000px)}100%{opacity:1;-moz-transform:translateY(0)}}@-o-keyframes fadeInDownBig{0%{opacity:0;-o-transform:translateY(-2000px)}100%{opacity:1;-o-transform:translateY(0)}}@keyframes fadeInDownBig{0%{opacity:0;transform:translateY(-2000px)}100%{opacity:1;transform:translateY(0)}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;-moz-animation-name:fadeInDownBig;-o-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-2000px)}100%{opacity:1;-webkit-transform:translateX(0)}}@-moz-keyframes fadeInLeftBig{0%{opacity:0;-moz-transform:translateX(-2000px)}100%{opacity:1;-moz-transform:translateX(0)}}@-o-keyframes fadeInLeftBig{0%{opacity:0;-o-transform:translateX(-2000px)}100%{opacity:1;-o-transform:translateX(0)}}@keyframes fadeInLeftBig{0%{opacity:0;transform:translateX(-2000px)}100%{opacity:1;transform:translateX(0)}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;-moz-animation-name:fadeInLeftBig;-o-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(2000px)}100%{opacity:1;-webkit-transform:translateX(0)}}@-moz-keyframes fadeInRightBig{0%{opacity:0;-moz-transform:translateX(2000px)}100%{opacity:1;-moz-transform:translateX(0)}}@-o-keyframes fadeInRightBig{0%{opacity:0;-o-transform:translateX(2000px)}100%{opacity:1;-o-transform:translateX(0)}}@keyframes fadeInRightBig{0%{opacity:0;transform:translateX(2000px)}100%{opacity:1;transform:translateX(0)}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;-moz-animation-name:fadeInRightBig;-o-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@-moz-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@-o-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;-moz-animation-name:fadeOut;-o-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutUp{0%{opacity:1;-webkit-transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-20px)}}@-moz-keyframes fadeOutUp{0%{opacity:1;-moz-transform:translateY(0)}100%{opacity:0;-moz-transform:translateY(-20px)}}@-o-keyframes fadeOutUp{0%{opacity:1;-o-transform:translateY(0)}100%{opacity:0;-o-transform:translateY(-20px)}}@keyframes fadeOutUp{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-20px)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;-moz-animation-name:fadeOutUp;-o-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutDown{0%{opacity:1;-webkit-transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(20px)}}@-moz-keyframes fadeOutDown{0%{opacity:1;-moz-transform:translateY(0)}100%{opacity:0;-moz-transform:translateY(20px)}}@-o-keyframes fadeOutDown{0%{opacity:1;-o-transform:translateY(0)}100%{opacity:0;-o-transform:translateY(20px)}}@keyframes fadeOutDown{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(20px)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;-moz-animation-name:fadeOutDown;-o-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutLeft{0%{opacity:1;-webkit-transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-20px)}}@-moz-keyframes fadeOutLeft{0%{opacity:1;-moz-transform:translateX(0)}100%{opacity:0;-moz-transform:translateX(-20px)}}@-o-keyframes fadeOutLeft{0%{opacity:1;-o-transform:translateX(0)}100%{opacity:0;-o-transform:translateX(-20px)}}@keyframes fadeOutLeft{0%{opacity:1;transform:translateX(0)}100%{opacity:0;transform:translateX(-20px)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;-moz-animation-name:fadeOutLeft;-o-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutRight{0%{opacity:1;-webkit-transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(20px)}}@-moz-keyframes fadeOutRight{0%{opacity:1;-moz-transform:translateX(0)}100%{opacity:0;-moz-transform:translateX(20px)}}@-o-keyframes fadeOutRight{0%{opacity:1;-o-transform:translateX(0)}100%{opacity:0;-o-transform:translateX(20px)}}@keyframes fadeOutRight{0%{opacity:1;transform:translateX(0)}100%{opacity:0;transform:translateX(20px)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;-moz-animation-name:fadeOutRight;-o-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutUpBig{0%{opacity:1;-webkit-transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px)}}@-moz-keyframes fadeOutUpBig{0%{opacity:1;-moz-transform:translateY(0)}100%{opacity:0;-moz-transform:translateY(-2000px)}}@-o-keyframes fadeOutUpBig{0%{opacity:1;-o-transform:translateY(0)}100%{opacity:0;-o-transform:translateY(-2000px)}}@keyframes fadeOutUpBig{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-2000px)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;-moz-animation-name:fadeOutUpBig;-o-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes fadeOutDownBig{0%{opacity:1;-webkit-transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px)}}@-moz-keyframes fadeOutDownBig{0%{opacity:1;-moz-transform:translateY(0)}100%{opacity:0;-moz-transform:translateY(2000px)}}@-o-keyframes fadeOutDownBig{0%{opacity:1;-o-transform:translateY(0)}100%{opacity:0;-o-transform:translateY(2000px)}}@keyframes fadeOutDownBig{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(2000px)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;-moz-animation-name:fadeOutDownBig;-o-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1;-webkit-transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px)}}@-moz-keyframes fadeOutLeftBig{0%{opacity:1;-moz-transform:translateX(0)}100%{opacity:0;-moz-transform:translateX(-2000px)}}@-o-keyframes fadeOutLeftBig{0%{opacity:1;-o-transform:translateX(0)}100%{opacity:0;-o-transform:translateX(-2000px)}}@keyframes fadeOutLeftBig{0%{opacity:1;transform:translateX(0)}100%{opacity:0;transform:translateX(-2000px)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;-moz-animation-name:fadeOutLeftBig;-o-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRightBig{0%{opacity:1;-webkit-transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px)}}@-moz-keyframes fadeOutRightBig{0%{opacity:1;-moz-transform:translateX(0)}100%{opacity:0;-moz-transform:translateX(2000px)}}@-o-keyframes fadeOutRightBig{0%{opacity:1;-o-transform:translateX(0)}100%{opacity:0;-o-transform:translateX(2000px)}}@keyframes fadeOutRightBig{0%{opacity:1;transform:translateX(0)}100%{opacity:0;transform:translateX(2000px)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;-moz-animation-name:fadeOutRightBig;-o-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.3)}50%{opacity:1;-webkit-transform:scale(1.05)}70%{-webkit-transform:scale(.9)}100%{-webkit-transform:scale(1)}}@-moz-keyframes bounceIn{0%{opacity:0;-moz-transform:scale(.3)}50%{opacity:1;-moz-transform:scale(1.05)}70%{-moz-transform:scale(.9)}100%{-moz-transform:scale(1)}}@-o-keyframes bounceIn{0%{opacity:0;-o-transform:scale(.3)}50%{opacity:1;-o-transform:scale(1.05)}70%{-o-transform:scale(.9)}100%{-o-transform:scale(1)}}@keyframes bounceIn{0%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1.05)}70%{transform:scale(.9)}100%{transform:scale(1)}}.bounceIn{-webkit-animation-name:bounceIn;-moz-animation-name:bounceIn;-o-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInUp{0%{opacity:0;-webkit-transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px)}80%{-webkit-transform:translateY(10px)}100%{-webkit-transform:translateY(0)}}@-moz-keyframes bounceInUp{0%{opacity:0;-moz-transform:translateY(2000px)}60%{opacity:1;-moz-transform:translateY(-30px)}80%{-moz-transform:translateY(10px)}100%{-moz-transform:translateY(0)}}@-o-keyframes bounceInUp{0%{opacity:0;-o-transform:translateY(2000px)}60%{opacity:1;-o-transform:translateY(-30px)}80%{-o-transform:translateY(10px)}100%{-o-transform:translateY(0)}}@keyframes bounceInUp{0%{opacity:0;transform:translateY(2000px)}60%{opacity:1;transform:translateY(-30px)}80%{transform:translateY(10px)}100%{transform:translateY(0)}}.bounceInUp{-webkit-animation-name:bounceInUp;-moz-animation-name:bounceInUp;-o-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px)}80%{-webkit-transform:translateY(-10px)}100%{-webkit-transform:translateY(0)}}@-moz-keyframes bounceInDown{0%{opacity:0;-moz-transform:translateY(-2000px)}60%{opacity:1;-moz-transform:translateY(30px)}80%{-moz-transform:translateY(-10px)}100%{-moz-transform:translateY(0)}}@-o-keyframes bounceInDown{0%{opacity:0;-o-transform:translateY(-2000px)}60%{opacity:1;-o-transform:translateY(30px)}80%{-o-transform:translateY(-10px)}100%{-o-transform:translateY(0)}}@keyframes bounceInDown{0%{opacity:0;transform:translateY(-2000px)}60%{opacity:1;transform:translateY(30px)}80%{transform:translateY(-10px)}100%{transform:translateY(0)}}.bounceInDown{-webkit-animation-name:bounceInDown;-moz-animation-name:bounceInDown;-o-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px)}60%{opacity:1;-webkit-transform:translateX(30px)}80%{-webkit-transform:translateX(-10px)}100%{-webkit-transform:translateX(0)}}@-moz-keyframes bounceInLeft{0%{opacity:0;-moz-transform:translateX(-2000px)}60%{opacity:1;-moz-transform:translateX(30px)}80%{-moz-transform:translateX(-10px)}100%{-moz-transform:translateX(0)}}@-o-keyframes bounceInLeft{0%{opacity:0;-o-transform:translateX(-2000px)}60%{opacity:1;-o-transform:translateX(30px)}80%{-o-transform:translateX(-10px)}100%{-o-transform:translateX(0)}}@keyframes bounceInLeft{0%{opacity:0;transform:translateX(-2000px)}60%{opacity:1;transform:translateX(30px)}80%{transform:translateX(-10px)}100%{transform:translateX(0)}}.bounceInLeft{-webkit-animation-name:bounceInLeft;-moz-animation-name:bounceInLeft;-o-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px)}60%{opacity:1;-webkit-transform:translateX(-30px)}80%{-webkit-transform:translateX(10px)}100%{-webkit-transform:translateX(0)}}@-moz-keyframes bounceInRight{0%{opacity:0;-moz-transform:translateX(2000px)}60%{opacity:1;-moz-transform:translateX(-30px)}80%{-moz-transform:translateX(10px)}100%{-moz-transform:translateX(0)}}@-o-keyframes bounceInRight{0%{opacity:0;-o-transform:translateX(2000px)}60%{opacity:1;-o-transform:translateX(-30px)}80%{-o-transform:translateX(10px)}100%{-o-transform:translateX(0)}}@keyframes bounceInRight{0%{opacity:0;transform:translateX(2000px)}60%{opacity:1;transform:translateX(-30px)}80%{transform:translateX(10px)}100%{transform:translateX(0)}}.bounceInRight{-webkit-animation-name:bounceInRight;-moz-animation-name:bounceInRight;-o-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceOut{0%{-webkit-transform:scale(1)}25%{-webkit-transform:scale(.95)}50%{opacity:1;-webkit-transform:scale(1.1)}100%{opacity:0;-webkit-transform:scale(.3)}}@-moz-keyframes bounceOut{0%{-moz-transform:scale(1)}25%{-moz-transform:scale(.95)}50%{opacity:1;-moz-transform:scale(1.1)}100%{opacity:0;-moz-transform:scale(.3)}}@-o-keyframes bounceOut{0%{-o-transform:scale(1)}25%{-o-transform:scale(.95)}50%{opacity:1;-o-transform:scale(1.1)}100%{opacity:0;-o-transform:scale(.3)}}@keyframes bounceOut{0%{transform:scale(1)}25%{transform:scale(.95)}50%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:scale(.3)}}.bounceOut{-webkit-animation-name:bounceOut;-moz-animation-name:bounceOut;-o-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutUp{0%{-webkit-transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(20px)}100%{opacity:0;-webkit-transform:translateY(-2000px)}}@-moz-keyframes bounceOutUp{0%{-moz-transform:translateY(0)}20%{opacity:1;-moz-transform:translateY(20px)}100%{opacity:0;-moz-transform:translateY(-2000px)}}@-o-keyframes bounceOutUp{0%{-o-transform:translateY(0)}20%{opacity:1;-o-transform:translateY(20px)}100%{opacity:0;-o-transform:translateY(-2000px)}}@keyframes bounceOutUp{0%{transform:translateY(0)}20%{opacity:1;transform:translateY(20px)}100%{opacity:0;transform:translateY(-2000px)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;-moz-animation-name:bounceOutUp;-o-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes bounceOutDown{0%{-webkit-transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(-20px)}100%{opacity:0;-webkit-transform:translateY(2000px)}}@-moz-keyframes bounceOutDown{0%{-moz-transform:translateY(0)}20%{opacity:1;-moz-transform:translateY(-20px)}100%{opacity:0;-moz-transform:translateY(2000px)}}@-o-keyframes bounceOutDown{0%{-o-transform:translateY(0)}20%{opacity:1;-o-transform:translateY(-20px)}100%{opacity:0;-o-transform:translateY(2000px)}}@keyframes bounceOutDown{0%{transform:translateY(0)}20%{opacity:1;transform:translateY(-20px)}100%{opacity:0;transform:translateY(2000px)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;-moz-animation-name:bounceOutDown;-o-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{0%{-webkit-transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(20px)}100%{opacity:0;-webkit-transform:translateX(-2000px)}}@-moz-keyframes bounceOutLeft{0%{-moz-transform:translateX(0)}20%{opacity:1;-moz-transform:translateX(20px)}100%{opacity:0;-moz-transform:translateX(-2000px)}}@-o-keyframes bounceOutLeft{0%{-o-transform:translateX(0)}20%{opacity:1;-o-transform:translateX(20px)}100%{opacity:0;-o-transform:translateX(-2000px)}}@keyframes bounceOutLeft{0%{transform:translateX(0)}20%{opacity:1;transform:translateX(20px)}100%{opacity:0;transform:translateX(-2000px)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;-moz-animation-name:bounceOutLeft;-o-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{0%{-webkit-transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(-20px)}100%{opacity:0;-webkit-transform:translateX(2000px)}}@-moz-keyframes bounceOutRight{0%{-moz-transform:translateX(0)}20%{opacity:1;-moz-transform:translateX(-20px)}100%{opacity:0;-moz-transform:translateX(2000px)}}@-o-keyframes bounceOutRight{0%{-o-transform:translateX(0)}20%{opacity:1;-o-transform:translateX(-20px)}100%{opacity:0;-o-transform:translateX(2000px)}}@keyframes bounceOutRight{0%{transform:translateX(0)}20%{opacity:1;transform:translateX(-20px)}100%{opacity:0;transform:translateX(2000px)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;-moz-animation-name:bounceOutRight;-o-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center center;-webkit-transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;-webkit-transform:rotate(0);opacity:1}}@-moz-keyframes rotateIn{0%{-moz-transform-origin:center center;-moz-transform:rotate(-200deg);opacity:0}100%{-moz-transform-origin:center center;-moz-transform:rotate(0);opacity:1}}@-o-keyframes rotateIn{0%{-o-transform-origin:center center;-o-transform:rotate(-200deg);opacity:0}100%{-o-transform-origin:center center;-o-transform:rotate(0);opacity:1}}@keyframes rotateIn{0%{transform-origin:center center;transform:rotate(-200deg);opacity:0}100%{transform-origin:center center;transform:rotate(0);opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;-moz-animation-name:rotateIn;-o-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(0);opacity:1}}@-moz-keyframes rotateInUpLeft{0%{-moz-transform-origin:left bottom;-moz-transform:rotate(90deg);opacity:0}100%{-moz-transform-origin:left bottom;-moz-transform:rotate(0);opacity:1}}@-o-keyframes rotateInUpLeft{0%{-o-transform-origin:left bottom;-o-transform:rotate(90deg);opacity:0}100%{-o-transform-origin:left bottom;-o-transform:rotate(0);opacity:1}}@keyframes rotateInUpLeft{0%{transform-origin:left bottom;transform:rotate(90deg);opacity:0}100%{transform-origin:left bottom;transform:rotate(0);opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;-moz-animation-name:rotateInUpLeft;-o-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(0);opacity:1}}@-moz-keyframes rotateInDownLeft{0%{-moz-transform-origin:left bottom;-moz-transform:rotate(-90deg);opacity:0}100%{-moz-transform-origin:left bottom;-moz-transform:rotate(0);opacity:1}}@-o-keyframes rotateInDownLeft{0%{-o-transform-origin:left bottom;-o-transform:rotate(-90deg);opacity:0}100%{-o-transform-origin:left bottom;-o-transform:rotate(0);opacity:1}}@keyframes rotateInDownLeft{0%{transform-origin:left bottom;transform:rotate(-90deg);opacity:0}100%{transform-origin:left bottom;transform:rotate(0);opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;-moz-animation-name:rotateInDownLeft;-o-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(0);opacity:1}}@-moz-keyframes rotateInUpRight{0%{-moz-transform-origin:right bottom;-moz-transform:rotate(-90deg);opacity:0}100%{-moz-transform-origin:right bottom;-moz-transform:rotate(0);opacity:1}}@-o-keyframes rotateInUpRight{0%{-o-transform-origin:right bottom;-o-transform:rotate(-90deg);opacity:0}100%{-o-transform-origin:right bottom;-o-transform:rotate(0);opacity:1}}@keyframes rotateInUpRight{0%{transform-origin:right bottom;transform:rotate(-90deg);opacity:0}100%{transform-origin:right bottom;transform:rotate(0);opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;-moz-animation-name:rotateInUpRight;-o-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(0);opacity:1}}@-moz-keyframes rotateInDownRight{0%{-moz-transform-origin:right bottom;-moz-transform:rotate(90deg);opacity:0}100%{-moz-transform-origin:right bottom;-moz-transform:rotate(0);opacity:1}}@-o-keyframes rotateInDownRight{0%{-o-transform-origin:right bottom;-o-transform:rotate(90deg);opacity:0}100%{-o-transform-origin:right bottom;-o-transform:rotate(0);opacity:1}}@keyframes rotateInDownRight{0%{transform-origin:right bottom;transform:rotate(90deg);opacity:0}100%{transform-origin:right bottom;transform:rotate(0);opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;-moz-animation-name:rotateInDownRight;-o-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateOut{0%{-webkit-transform-origin:center center;-webkit-transform:rotate(0);opacity:1}100%{-webkit-transform-origin:center center;-webkit-transform:rotate(200deg);opacity:0}}@-moz-keyframes rotateOut{0%{-moz-transform-origin:center center;-moz-transform:rotate(0);opacity:1}100%{-moz-transform-origin:center center;-moz-transform:rotate(200deg);opacity:0}}@-o-keyframes rotateOut{0%{-o-transform-origin:center center;-o-transform:rotate(0);opacity:1}100%{-o-transform-origin:center center;-o-transform:rotate(200deg);opacity:0}}@keyframes rotateOut{0%{transform-origin:center center;transform:rotate(0);opacity:1}100%{transform-origin:center center;transform:rotate(200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;-moz-animation-name:rotateOut;-o-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(-90deg);opacity:0}}@-moz-keyframes rotateOutUpLeft{0%{-moz-transform-origin:left bottom;-moz-transform:rotate(0);opacity:1}100%{-moz-transform-origin:left bottom;-moz-transform:rotate(-90deg);opacity:0}}@-o-keyframes rotateOutUpLeft{0%{-o-transform-origin:left bottom;-o-transform:rotate(0);opacity:1}100%{-o-transform-origin:left bottom;-o-transform:rotate(-90deg);opacity:0}}@keyframes rotateOutUpLeft{0%{transform-origin:left bottom;transform:rotate(0);opacity:1}100%{transform-origin:left bottom;transform:rotate(-90deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;-moz-animation-name:rotateOutUpLeft;-o-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;-webkit-transform:rotate(90deg);opacity:0}}@-moz-keyframes rotateOutDownLeft{0%{-moz-transform-origin:left bottom;-moz-transform:rotate(0);opacity:1}100%{-moz-transform-origin:left bottom;-moz-transform:rotate(90deg);opacity:0}}@-o-keyframes rotateOutDownLeft{0%{-o-transform-origin:left bottom;-o-transform:rotate(0);opacity:1}100%{-o-transform-origin:left bottom;-o-transform:rotate(90deg);opacity:0}}@keyframes rotateOutDownLeft{0%{transform-origin:left bottom;transform:rotate(0);opacity:1}100%{transform-origin:left bottom;transform:rotate(90deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;-moz-animation-name:rotateOutDownLeft;-o-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(90deg);opacity:0}}@-moz-keyframes rotateOutUpRight{0%{-moz-transform-origin:right bottom;-moz-transform:rotate(0);opacity:1}100%{-moz-transform-origin:right bottom;-moz-transform:rotate(90deg);opacity:0}}@-o-keyframes rotateOutUpRight{0%{-o-transform-origin:right bottom;-o-transform:rotate(0);opacity:1}100%{-o-transform-origin:right bottom;-o-transform:rotate(90deg);opacity:0}}@keyframes rotateOutUpRight{0%{transform-origin:right bottom;transform:rotate(0);opacity:1}100%{transform-origin:right bottom;transform:rotate(90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;-moz-animation-name:rotateOutUpRight;-o-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;-webkit-transform:rotate(-90deg);opacity:0}}@-moz-keyframes rotateOutDownRight{0%{-moz-transform-origin:right bottom;-moz-transform:rotate(0);opacity:1}100%{-moz-transform-origin:right bottom;-moz-transform:rotate(-90deg);opacity:0}}@-o-keyframes rotateOutDownRight{0%{-o-transform-origin:right bottom;-o-transform:rotate(0);opacity:1}100%{-o-transform-origin:right bottom;-o-transform:rotate(-90deg);opacity:0}}@keyframes rotateOutDownRight{0%{transform-origin:right bottom;transform:rotate(0);opacity:1}100%{transform-origin:right bottom;transform:rotate(-90deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;-moz-animation-name:rotateOutDownRight;-o-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes hinge{0%{-webkit-transform:rotate(0);-webkit-transform-origin:top left;-webkit-animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);-webkit-transform-origin:top left;-webkit-animation-timing-function:ease-in-out}40%{-webkit-transform:rotate(60deg);-webkit-transform-origin:top left;-webkit-animation-timing-function:ease-in-out}80%{-webkit-transform:rotate(60deg) translateY(0);opacity:1;-webkit-transform-origin:top left;-webkit-animation-timing-function:ease-in-out}100%{-webkit-transform:translateY(700px);opacity:0}}@-moz-keyframes hinge{0%{-moz-transform:rotate(0);-moz-transform-origin:top left;-moz-animation-timing-function:ease-in-out}20%,60%{-moz-transform:rotate(80deg);-moz-transform-origin:top left;-moz-animation-timing-function:ease-in-out}40%{-moz-transform:rotate(60deg);-moz-transform-origin:top left;-moz-animation-timing-function:ease-in-out}80%{-moz-transform:rotate(60deg) translateY(0);opacity:1;-moz-transform-origin:top left;-moz-animation-timing-function:ease-in-out}100%{-moz-transform:translateY(700px);opacity:0}}@-o-keyframes hinge{0%{-o-transform:rotate(0);-o-transform-origin:top left;-o-animation-timing-function:ease-in-out}20%,60%{-o-transform:rotate(80deg);-o-transform-origin:top left;-o-animation-timing-function:ease-in-out}40%{-o-transform:rotate(60deg);-o-transform-origin:top left;-o-animation-timing-function:ease-in-out}80%{-o-transform:rotate(60deg) translateY(0);opacity:1;-o-transform-origin:top left;-o-animation-timing-function:ease-in-out}100%{-o-transform:translateY(700px);opacity:0}}@keyframes hinge{0%{transform:rotate(0);transform-origin:top left;animation-timing-function:ease-in-out}20%,60%{transform:rotate(80deg);transform-origin:top left;animation-timing-function:ease-in-out}40%{transform:rotate(60deg);transform-origin:top left;animation-timing-function:ease-in-out}80%{transform:rotate(60deg) translateY(0);opacity:1;transform-origin:top left;animation-timing-function:ease-in-out}100%{transform:translateY(700px);opacity:0}}.hinge{-webkit-animation-name:hinge;-moz-animation-name:hinge;-o-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg)}}@-moz-keyframes rollIn{0%{opacity:0;-moz-transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-moz-transform:translateX(0px) rotate(0deg)}}@-o-keyframes rollIn{0%{opacity:0;-o-transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-o-transform:translateX(0px) rotate(0deg)}}@keyframes rollIn{0%{opacity:0;transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;transform:translateX(0px) rotate(0deg)}}.rollIn{-webkit-animation-name:rollIn;-moz-animation-name:rollIn;-o-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg)}100%{opacity:0;-webkit-transform:translateX(100%) rotate(120deg)}}@-moz-keyframes rollOut{0%{opacity:1;-moz-transform:translateX(0px) rotate(0deg)}100%{opacity:0;-moz-transform:translateX(100%) rotate(120deg)}}@-o-keyframes rollOut{0%{opacity:1;-o-transform:translateX(0px) rotate(0deg)}100%{opacity:0;-o-transform:translateX(100%) rotate(120deg)}}@keyframes rollOut{0%{opacity:1;transform:translateX(0px) rotate(0deg)}100%{opacity:0;transform:translateX(100%) rotate(120deg)}}.rollOut{-webkit-animation-name:rollOut;-moz-animation-name:rollOut;-o-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);opacity:1}}@-moz-keyframes lightSpeedIn{0%{-moz-transform:translateX(100%) skewX(-30deg);opacity:0}60%{-moz-transform:translateX(-20%) skewX(30deg);opacity:1}80%{-moz-transform:translateX(0%) skewX(-15deg);opacity:1}100%{-moz-transform:translateX(0%) skewX(0deg);opacity:1}}@-o-keyframes lightSpeedIn{0%{-o-transform:translateX(100%) skewX(-30deg);opacity:0}60%{-o-transform:translateX(-20%) skewX(30deg);opacity:1}80%{-o-transform:translateX(0%) skewX(-15deg);opacity:1}100%{-o-transform:translateX(0%) skewX(0deg);opacity:1}}@keyframes lightSpeedIn{0%{transform:translateX(100%) skewX(-30deg);opacity:0}60%{transform:translateX(-20%) skewX(30deg);opacity:1}80%{transform:translateX(0%) skewX(-15deg);opacity:1}100%{transform:translateX(0%) skewX(0deg);opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;-moz-animation-name:lightSpeedIn;-o-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;-moz-animation-timing-function:ease-out;-o-animation-timing-function:ease-out;animation-timing-function:ease-out}.animated.lightSpeedIn{-webkit-animation-duration:.5s;-moz-animation-duration:.5s;-o-animation-duration:.5s;animation-duration:.5s}@-webkit-keyframes lightSpeedOut{0%{-webkit-transform:translateX(0%) skewX(0deg);opacity:1}100%{-webkit-transform:translateX(100%) skewX(-30deg);opacity:0}}@-moz-keyframes lightSpeedOut{0%{-moz-transform:translateX(0%) skewX(0deg);opacity:1}100%{-moz-transform:translateX(100%) skewX(-30deg);opacity:0}}@-o-keyframes lightSpeedOut{0%{-o-transform:translateX(0%) skewX(0deg);opacity:1}100%{-o-transform:translateX(100%) skewX(-30deg);opacity:0}}@keyframes lightSpeedOut{0%{transform:translateX(0%) skewX(0deg);opacity:1}100%{transform:translateX(100%) skewX(-30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;-moz-animation-name:lightSpeedOut;-o-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;-moz-animation-timing-function:ease-in;-o-animation-timing-function:ease-in;animation-timing-function:ease-in}.animated.lightSpeedOut{-webkit-animation-duration:.25s;-moz-animation-duration:.25s;-o-animation-duration:.25s;animation-duration:.25s}@-webkit-keyframes wiggle{0%{-webkit-transform:skewX(9deg)}10%{-webkit-transform:skewX(-8deg)}20%{-webkit-transform:skewX(7deg)}30%{-webkit-transform:skewX(-6deg)}40%{-webkit-transform:skewX(5deg)}50%{-webkit-transform:skewX(-4deg)}60%{-webkit-transform:skewX(3deg)}70%{-webkit-transform:skewX(-2deg)}80%{-webkit-transform:skewX(1deg)}90%{-webkit-transform:skewX(0deg)}100%{-webkit-transform:skewX(0deg)}}@-moz-keyframes wiggle{0%{-moz-transform:skewX(9deg)}10%{-moz-transform:skewX(-8deg)}20%{-moz-transform:skewX(7deg)}30%{-moz-transform:skewX(-6deg)}40%{-moz-transform:skewX(5deg)}50%{-moz-transform:skewX(-4deg)}60%{-moz-transform:skewX(3deg)}70%{-moz-transform:skewX(-2deg)}80%{-moz-transform:skewX(1deg)}90%{-moz-transform:skewX(0deg)}100%{-moz-transform:skewX(0deg)}}@-o-keyframes wiggle{0%{-o-transform:skewX(9deg)}10%{-o-transform:skewX(-8deg)}20%{-o-transform:skewX(7deg)}30%{-o-transform:skewX(-6deg)}40%{-o-transform:skewX(5deg)}50%{-o-transform:skewX(-4deg)}60%{-o-transform:skewX(3deg)}70%{-o-transform:skewX(-2deg)}80%{-o-transform:skewX(1deg)}90%{-o-transform:skewX(0deg)}100%{-o-transform:skewX(0deg)}}@keyframes wiggle{0%{transform:skewX(9deg)}10%{transform:skewX(-8deg)}20%{transform:skewX(7deg)}30%{transform:skewX(-6deg)}40%{transform:skewX(5deg)}50%{transform:skewX(-4deg)}60%{transform:skewX(3deg)}70%{transform:skewX(-2deg)}80%{transform:skewX(1deg)}90%{transform:skewX(0deg)}100%{transform:skewX(0deg)}}.wiggle{-webkit-animation-name:wiggle;-moz-animation-name:wiggle;-o-animation-name:wiggle;animation-name:wiggle;-webkit-animation-timing-function:ease-in;-moz-animation-timing-function:ease-in;-o-animation-timing-function:ease-in;animation-timing-function:ease-in}.animated.wiggle{-webkit-animation-duration:.75s;-moz-animation-duration:.75s;-o-animation-duration:.75s;animation-duration:.75s}
</style>
<script>
jQuery(document).ready(function($){
$(".cartInfo").click(function(){
$(".cartBox").slideToggle("fast");
$(this).toggleClass("cartOn"); return false;
});
});
</script>
<script type='text/javascript'>
//<![CDATA[
/*----------------------------
SIMPLE CART SETTING
-----------------------------*/
simpleCart({
checkout: {
type: "PayPal",
email: "yours-store@yours.com"
}
});
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
/*~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~
Copyright (c) 2012 Brett Wejrowski
wojodesign.com
simplecartjs.org
http://github.com/wojodesign/simplecart-js
VERSION 3.0.5
Dual licensed under the MIT or GPL licenses.
~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~-~*/
/*jslint browser: true, unparam: true, white: true, nomen: true, regexp: true, maxerr: 50, indent: 4 */
(function (window, document) {
/*global HTMLElement */
var typeof_string = typeof "",
typeof_undefined = typeof undefined,
typeof_function = typeof function () {},
typeof_object = typeof {},
isTypeOf = function (item, type) { return typeof item === type; },
isString = function (item) { return isTypeOf(item, typeof_string); },
isUndefined = function (item) { return isTypeOf(item, typeof_undefined); },
isFunction = function (item) { return isTypeOf(item, typeof_function); },
isObject = function (item) { return isTypeOf(item, typeof_object); },
//Returns true if it is a DOM element
isElement = function (o) {
return typeof HTMLElement === "object" ? o instanceof HTMLElement : typeof o === "object" && o.nodeType === 1 && typeof o.nodeName === "string";
},
generateSimpleCart = function (space) {
// stealing this from selectivizr
var selectorEngines = {
"MooTools" : "$$",
"Prototype" : "$$",
"jQuery" : "*"
},
// local variables for internal use
item_id = 0,
item_id_namespace = "SCI-",
sc_items = {},
namespace = space || "simpleCart",
selectorFunctions = {},
eventFunctions = {},
baseEvents = {},
// local references
localStorage = window.localStorage,
console = window.console || { msgs: [], log: function (msg) { console.msgs.push(msg); } },
// used in views
_VALUE_ = 'value',
_TEXT_ = 'text',
_HTML_ = 'html',
_CLICK_ = 'click',
// Currencies
currencies = {
"USD": { code: "USD", symbol: "$", name: "US Dollar" },
"AUD": { code: "AUD", symbol: "$", name: "Australian Dollar" },
"BRL": { code: "BRL", symbol: "R$", name: "Brazilian Real" },
"CAD": { code: "CAD", symbol: "$", name: "Canadian Dollar" },
"CZK": { code: "CZK", symbol: " Kč", name: "Czech Koruna", after: true },
"DKK": { code: "DKK", symbol: "DKK ", name: "Danish Krone" },
"EUR": { code: "EUR", symbol: "€", name: "Euro" },
"HKD": { code: "HKD", symbol: "$", name: "Hong Kong Dollar" },
"HUF": { code: "HUF", symbol: "Ft", name: "Hungarian Forint" },
"ILS": { code: "ILS", symbol: "₪", name: "Israeli New Sheqel" },
"JPY": { code: "JPY", symbol: "¥", name: "Japanese Yen" },
"MXN": { code: "MXN", symbol: "$", name: "Mexican Peso" },
"NOK": { code: "NOK", symbol: "NOK ", name: "Norwegian Krone" },
"NZD": { code: "NZD", symbol: "$", name: "New Zealand Dollar" },
"PLN": { code: "PLN", symbol: "PLN ", name: "Polish Zloty" },
"GBP": { code: "GBP", symbol: "£", name: "Pound Sterling" },
"SGD": { code: "SGD", symbol: "$", name: "Singapore Dollar" },
"SEK": { code: "SEK", symbol: "SEK ", name: "Swedish Krona" },
"CHF": { code: "CHF", symbol: "CHF ", name: "Swiss Franc" },
"THB": { code: "THB", symbol: "฿", name: "Thai Baht" },
"BTC": { code: "BTC", symbol: " BTC", name: "Bitcoin", accuracy: 4, after: true }
},
// default options
settings = {
checkout : { type: "PayPal", email: "you@yours.com" },
currency : "USD",
language : "english-us",
cartStyle : "table",
cartColumns : [
{ attr: "name", label: "Name" },
{ attr: "price", label: "Price", view: 'currency' },
{ view: "decrement", label: false },
{ attr: "quantity", label: "Qty" },
{ view: "increment", label: false },
{ attr: "total", label: "SubTotal", view: 'currency' },
{ view: "remove", text: "Remove", label: false }
],
excludeFromCheckout : ['thumb'],
shippingFlatRate : 0,
shippingQuantityRate : 0,
shippingTotalRate : 0,
shippingCustom : null,
taxRate : 0,
taxShipping : false,
data : {}
},
// main simpleCart object, function call is used for setting options
simpleCart = function (options) {
// shortcut for simpleCart.ready
if (isFunction(options)) {
return simpleCart.ready(options);
}
// set options
if (isObject(options)) {
return simpleCart.extend(settings, options);
}
},
// selector engine
$engine,
// built in cart views for item cells
cartColumnViews;
// function for extending objects
simpleCart.extend = function (target, opts) {
var next;
if (isUndefined(opts)) {
opts = target;
target = simpleCart;
}
for (next in opts) {
if (Object.prototype.hasOwnProperty.call(opts, next)) {
target[next] = opts[next];
}
}
return target;
};
// create copy function
simpleCart.extend({
copy: function (n) {
var cp = generateSimpleCart(n);
cp.init();
return cp;
}
});
// add in the core functionality
simpleCart.extend({
isReady: false,
// this is where the magic happens, the add function
add: function (values, opt_quiet) {
var info = values || {},
newItem = new simpleCart.Item(info),
addItem = true,
// optionally supress event triggers
quiet = opt_quiet === true ? opt_quiet : false,
oldItem;
// trigger before add event
if (!quiet) {
addItem = simpleCart.trigger('beforeAdd', [newItem]);
if (addItem === false) {
return false;
}
}
// if the new item already exists, increment the value
oldItem = simpleCart.has(newItem);
if (oldItem) {
oldItem.increment(newItem.quantity());
newItem = oldItem;
// otherwise add the item
} else {
sc_items[newItem.id()] = newItem;
}
// update the cart
simpleCart.update();
if (!quiet) {
// trigger after add event
simpleCart.trigger('afterAdd', [newItem, isUndefined(oldItem)]);
}
// return a reference to the added item
return newItem;
},
// iteration function
each: function (array, callback) {
var next,
x = 0,
result,
cb,
items;
if (isFunction(array)) {
cb = array;
items = sc_items;
} else if (isFunction(callback)) {
cb = callback;
items = array;
} else {
return;
}
for (next in items) {
if (Object.prototype.hasOwnProperty.call(items, next)) {
result = cb.call(simpleCart, items[next], x, next);
if (result === false) {
return;
}
x += 1;
}
}
},
find: function (id) {
var items = [];
// return object for id if it exists
if (isObject(sc_items[id])) {
return sc_items[id];
}
// search through items with the given criteria
if (isObject(id)) {
simpleCart.each(function (item) {
var match = true;
simpleCart.each(id, function (val, x, attr) {
if (isString(val)) {
// less than or equal to
if (val.match(/<=.*/)) { val=parseFloat(val.replace('<=', '')); if (!(item.get(attr) && parseFloat(item.get(attr)) <=val)) { match=false; } // less than } else if (val.match(/</)) { val=parseFloat(val.replace('<', '')); if (!(item.get(attr) && parseFloat(item.get(attr)) < val)) { match=false; } // greater than or equal to } else if (val.match(/>=/)) {
val = parseFloat(val.replace('>=', ''));
if (!(item.get(attr) && parseFloat(item.get(attr)) >= val)) {
match = false;
}
// greater than
} else if (val.match(/>/)) {
val = parseFloat(val.replace('>', ''));
if (!(item.get(attr) && parseFloat(item.get(attr)) > val)) {
match = false;
}
// equal to
} else if (!(item.get(attr) && item.get(attr) === val)) {
match = false;
}
// equal to non string
} else if (!(item.get(attr) && item.get(attr) === val)) {
match = false;
}
return match;
});
// add the item if it matches
if (match) {
items.push(item);
}
});
return items;
}
// if no criteria is given we return all items
if (isUndefined(id)) {
// use a new array so we don't give a reference to the
// cart's item array
simpleCart.each(function (item) {
items.push(item);
});
return items;
}
// return empty array as default
return items;
},
// return all items
items: function () {
return this.find();
},
// check to see if item is in the cart already
has: function (item) {
var match = false;
simpleCart.each(function (testItem) {
if (testItem.equals(item)) {
match = testItem;
}
});
return match;
},
// empty the cart
empty: function () {
// remove each item individually so we see the remove events
var newItems = {};
simpleCart.each(function (item) {
// send a param of true to make sure it doesn't
// update after every removal
// keep the item if the function returns false,
// because we know it has been prevented
// from being removed
if (item.remove(true) === false) {
newItems[item.id()] = item
}
});
sc_items = newItems;
simpleCart.update();
},
// functions for accessing cart info
quantity: function () {
var quantity = 0;
simpleCart.each(function (item) {
quantity += item.quantity();
});
return quantity;
},
total: function () {
var total = 0;
simpleCart.each(function (item) {
total += item.total();
});
return total;
},
grandTotal: function () {
return simpleCart.total() + simpleCart.tax() + simpleCart.shipping();
},
// updating functions
update: function () {
simpleCart.save();
simpleCart.trigger("update");
},
init: function () {
simpleCart.load();
simpleCart.update();
simpleCart.ready();
},
// view management
$: function (selector) {
return new simpleCart.ELEMENT(selector);
},
$create: function (tag) {
return simpleCart.$(document.createElement(tag));
},
setupViewTool: function () {
var members, member, context = window, engine;
// Determine the "best fit" selector engine
for (engine in selectorEngines) {
if (Object.prototype.hasOwnProperty.call(selectorEngines, engine) && window[engine]) {
members = selectorEngines[engine].replace("*", engine).split(".");
member = members.shift();
if (member) {
context = context[member];
}
if (typeof context === "function") {
// set the selector engine and extend the prototype of our
// element wrapper class
$engine = context;
simpleCart.extend(simpleCart.ELEMENT._, selectorFunctions[engine]);
return;
}
}
}
},
// return a list of id's in the cart
ids: function () {
var ids = [];
simpleCart.each(function (item) {
ids.push(item.id());
});
return ids;
},
// storage
save: function () {
simpleCart.trigger('beforeSave');
var items = {};
// save all the items
simpleCart.each(function (item) {
items[item.id()] = simpleCart.extend(item.fields(), item.options());
});
localStorage.setItem(namespace + "_items", JSON.stringify(items));
simpleCart.trigger('afterSave');
},
load: function () {
// empty without the update
sc_items = {};
var items = localStorage.getItem(namespace + "_items");
if (!items) {
return;
}
// we wrap this in a try statement so we can catch
// any json parsing errors. no more stick and we
// have a playing card pluckin the spokes now...
// soundin like a harley.
try {
simpleCart.each(JSON.parse(items), function (item) {
simpleCart.add(item, true);
});
} catch (e){
simpleCart.error( "Error Loading data: " + e );
}
simpleCart.trigger('load');
},
// ready function used as a shortcut for bind('ready',fn)
ready: function (fn) {
if (isFunction(fn)) {
// call function if already ready already
if (simpleCart.isReady) {
fn.call(simpleCart);
// bind if not ready
} else {
simpleCart.bind('ready', fn);
}
// trigger ready event
} else if (isUndefined(fn) && !simpleCart.isReady) {
simpleCart.trigger('ready');
simpleCart.isReady = true;
}
},
error: function (message) {
var msg = "";
if (isString(message)) {
msg = message;
} else if (isObject(message) && isString(message.message)) {
msg = message.message;
}
try { console.log("simpleCart(js) Error: " + msg); } catch (e) {}
simpleCart.trigger('error', message);
}
});
/*******************************************************************
* TAX AND SHIPPING
*******************************************************************/
simpleCart.extend({
// TODO: tax and shipping
tax: function () {
var totalToTax = settings.taxShipping ? simpleCart.total() + simpleCart.shipping() : simpleCart.total(),
cost = simpleCart.taxRate() * totalToTax;
simpleCart.each(function (item) {
if (item.get('tax')) {
cost += item.get('tax');
} else if (item.get('taxRate')) {
cost += item.get('taxRate') * item.total();
}
});
return parseFloat(cost);
},
taxRate: function () {
return settings.taxRate || 0;
},
shipping: function (opt_custom_function) {
// shortcut to extend options with custom shipping
if (isFunction(opt_custom_function)) {
simpleCart({
shippingCustom: opt_custom_function
});
return;
}
var cost = settings.shippingQuantityRate * simpleCart.quantity() +
settings.shippingTotalRate * simpleCart.total() +
settings.shippingFlatRate;
if (isFunction(settings.shippingCustom)) {
cost += settings.shippingCustom.call(simpleCart);
}
simpleCart.each(function (item) {
cost += parseFloat(item.get('shipping') || 0);
});
return parseFloat(cost);
}
});
/*******************************************************************
* CART VIEWS
*******************************************************************/
// built in cart views for item cells
cartColumnViews = {
attr: function (item, column) {
return item.get(column.attr) || "";
},
currency: function (item, column) {
return simpleCart.toCurrency(item.get(column.attr) || 0);
},
link: function (item, column) {
return "<a href='" + item.get(column.attr) + "'>" + column.text + "</a>";
},
decrement: function (item, column) {
return "<a href='javascript:' class='" + namespace + "_decrement'>" + (column.text || "-") + "</a>";
},
increment: function (item, column) {
return "<a href='javascript:' class='" + namespace + "_increment'>" + (column.text || "+") + "</a>";
},
image: function (item, column) {
return "<img src='" + item.get(column.attr) + "'/>";
},
input: function (item, column) {
return "<input type='text' value='" + item.get(column.attr) + "' class='" + namespace + "_input'/>";
},
remove: function (item, column) {
return "<a href='javascript:' class='" + namespace + "_remove'>" + (column.text || "X") + "</a>";
}
};
// cart column wrapper class and functions
function cartColumn(opts) {
var options = opts || {};
return simpleCart.extend({
attr : "",
label : "",
view : "attr",
text : "",
className : "",
hide : false
}, options);
}
function cartCellView(item, column) {
var viewFunc = isFunction(column.view) ? column.view : isString(column.view) && isFunction(cartColumnViews[column.view]) ? cartColumnViews[column.view] : cartColumnViews.attr;
return viewFunc.call(simpleCart, item, column);
}
simpleCart.extend({
// write out cart
writeCart: function (selector) {
var TABLE = settings.cartStyle.toLowerCase(),
isTable = TABLE === 'table',
TR = isTable ? "tr" : "div",
TH = isTable ? 'th' : 'div',
TD = isTable ? 'td' : 'div',
cart_container = simpleCart.$create(TABLE),
header_container = simpleCart.$create(TR).addClass('headerRow'),
container = simpleCart.$(selector),
column,
klass,
label,
x,
xlen;
container.html(' ').append(cart_container);
cart_container.append(header_container);
// create header
for (x = 0, xlen = settings.cartColumns.length; x < xlen; x += 1) {
column = cartColumn(settings.cartColumns[x]);
klass = "item-" + (column.attr || column.view || column.label || column.text || "cell") + " " + column.className;
label = column.label || "";
// append the header cell
header_container.append(
simpleCart.$create(TH).addClass(klass).html(label)
);
}
// cycle through the items
simpleCart.each(function (item, y) {
simpleCart.createCartRow(item, y, TR, TD, cart_container);
});
return cart_container;
},
// generate a cart row from an item
createCartRow: function (item, y, TR, TD, container) {
var row = simpleCart.$create(TR)
.addClass('itemRow row-' + y + " " + (y % 2 ? "even" : "odd"))
.attr('id', "cartItem_" + item.id()),
j,
jlen,
column,
klass,
content,
cell;
container.append(row);
// cycle through the columns to create each cell for the item
for (j = 0, jlen = settings.cartColumns.length; j < jlen; j += 1) {
column = cartColumn(settings.cartColumns[j]);
klass = "item-" + (column.attr || (isString(column.view) ? column.view : column.label || column.text || "cell")) + " " + column.className;
content = cartCellView(item, column);
cell = simpleCart.$create(TD).addClass(klass).html(content);
row.append(cell);
}
return row;
}
});
/*******************************************************************
* CART ITEM CLASS MANAGEMENT
*******************************************************************/
simpleCart.Item = function (info) {
// we use the data object to track values for the item
var _data = {},
me = this;
// cycle through given attributes and set them to the data object
if (isObject(info)) {
simpleCart.extend(_data, info);
}
// set the item id
item_id += 1;
_data.id = _data.id || item_id_namespace + item_id;
while (!isUndefined(sc_items[_data.id])) {
item_id += 1;
_data.id = item_id_namespace + item_id;
}
function checkQuantityAndPrice() {
// check to make sure price is valid
if (isString(_data.price)) {
// trying to remove all chars that aren't numbers or '.'
_data.price = parseFloat(_data.price.replace(simpleCart.currency().decimal, ".").replace(/[^0-9\.]+/ig, ""));
}
if (isNaN(_data.price)) {
_data.price = 0;
}
if (_data.price < 0) {
_data.price = 0;
}
// check to make sure quantity is valid
if (isString(_data.quantity)) {
_data.quantity = parseInt(_data.quantity.replace(simpleCart.currency().delimiter, ""), 10);
}
if (isNaN(_data.quantity)) {
_data.quantity = 1;
}
if (_data.quantity <= 0) {
me.remove();
}
}
// getter and setter methods to access private variables
me.get = function (name, skipPrototypes) {
var usePrototypes = !skipPrototypes;
if (isUndefined(name)) {
return name;
}
// return the value in order of the data object and then the prototype
return isFunction(_data[name]) ? _data[name].call(me) :
!isUndefined(_data[name]) ? _data[name] :
isFunction(me[name]) && usePrototypes ? me[name].call(me) :
!isUndefined(me[name]) && usePrototypes ? me[name] :
_data[name];
};
me.set = function (name, value) {
if (!isUndefined(name)) {
_data[name.toLowerCase()] = value;
if (name.toLowerCase() === 'price' || name.toLowerCase() === 'quantity') {
checkQuantityAndPrice();
}
}
return me;
};
me.equals = function (item) {
for( var label in _data ){
if (Object.prototype.hasOwnProperty.call(_data, label)) {
if (label !== 'quantity' && label !== 'id') {
if (item.get(label) !== _data[label]) {
return false;
}
}
}
}
return true;
};
me.options = function () {
var data = {};
simpleCart.each(_data,function (val, x, label) {
var add = true;
simpleCart.each(me.reservedFields(), function (field) {
if (field === label) {
add = false;
}
return add;
});
if (add) {
data[label] = me.get(label);
}
});
return data;
};
checkQuantityAndPrice();
};
simpleCart.Item._ = simpleCart.Item.prototype = {
// editing the item quantity
increment: function (amount) {
var diff = amount || 1;
diff = parseInt(diff, 10);
this.quantity(this.quantity() + diff);
if (this.quantity() < 1) {
this.remove();
return null;
}
return this;
},
decrement: function (amount) {
var diff = amount || 1;
return this.increment(-parseInt(diff, 10));
},
remove: function (skipUpdate) {
var removeItemBool = simpleCart.trigger("beforeRemove", [sc_items[this.id()]]);
if (removeItemBool === false ) {
return false;
}
delete sc_items[this.id()];
if (!skipUpdate) {
simpleCart.update();
}
return null;
},
// special fields for items
reservedFields: function () {
return ['quantity', 'id', 'item_number', 'price', 'name', 'shipping', 'tax', 'taxRate'];
},
// return values for all reserved fields if they exist
fields: function () {
var data = {},
me = this;
simpleCart.each(me.reservedFields(), function (field) {
if (me.get(field)) {
data[field] = me.get(field);
}
});
return data;
},
// shortcuts for getter/setters. can
// be overwritten for customization
// btw, we are hiring at wojo design, and could
// use a great web designer. if thats you, you can
// get more info at http://wojodesign.com/now-hiring/
// or email me directly: brett@wojodesign.com
quantity: function (val) {
return isUndefined(val) ? parseInt(this.get("quantity", true) || 1, 10) : this.set("quantity", val);
},
price: function (val) {
return isUndefined(val) ?
parseFloat((this.get("price",true).toString()).replace(simpleCart.currency().symbol,"").replace(simpleCart.currency().delimiter,"") || 1) :
this.set("price", parseFloat((val).toString().replace(simpleCart.currency().symbol,"").replace(simpleCart.currency().delimiter,"")));
},
id: function () {
return this.get('id',false);
},
total:function () {
return this.quantity()*this.price();
}
};
/*******************************************************************
* CHECKOUT MANAGEMENT
*******************************************************************/
simpleCart.extend({
checkout: function () {
if (settings.checkout.type.toLowerCase() === 'custom' && isFunction(settings.checkout.fn)) {
settings.checkout.fn.call(simpleCart,settings.checkout);
} else if (isFunction(simpleCart.checkout[settings.checkout.type])) {
var checkoutData = simpleCart.checkout[settings.checkout.type].call(simpleCart,settings.checkout);
// if the checkout method returns data, try to send the form
if( checkoutData.data && checkoutData.action && checkoutData.method ){
// if no one has any objections, send the checkout form
if( false !== simpleCart.trigger('beforeCheckout', [checkoutData.data]) ){
simpleCart.generateAndSendForm( checkoutData );
}
}
} else {
simpleCart.error("No Valid Checkout Method Specified");
}
},
extendCheckout: function (methods) {
return simpleCart.extend(simpleCart.checkout, methods);
},
generateAndSendForm: function (opts) {
var form = simpleCart.$create("form");
form.attr('style', 'display:none;');
form.attr('action', opts.action);
form.attr('method', opts.method);
simpleCart.each(opts.data, function (val, x, name) {
form.append(
simpleCart.$create("input").attr("type","hidden").attr("name",name).val(val)
);
});
simpleCart.$("body").append(form);
form.el.submit();
form.remove();
}
});
simpleCart.extendCheckout({
PayPal: function (opts) {
// account email is required
if (!opts.email) {
return simpleCart.error("No email provided for PayPal checkout");
}
// build basic form options
var data = {
cmd : "_cart"
, upload : "1"
, currency_code : simpleCart.currency().code
, business : opts.email
, rm : opts.method === "GET" ? "0" : "2"
, tax_cart : (simpleCart.tax()*1).toFixed(2)
, handling_cart : (simpleCart.shipping()*1).toFixed(2)
, charset : "utf-8"
},
action = opts.sandbox ? "https://www.sandbox.paypal.com/cgi-bin/webscr" : "https://www.paypal.com/cgi-bin/webscr",
method = opts.method === "GET" ? "GET" : "POST";
// check for return and success URLs in the options
if (opts.success) {
data['return'] = opts.success;
}
if (opts.cancel) {
data.cancel_return = opts.cancel;
}
if (opts.notify) {
data.notify_url = opts.notify;
}
// add all the items to the form data
simpleCart.each(function (item,x) {
var counter = x+1,
item_options = item.options(),
optionCount = 0,
send;
// basic item data
data["item_name_" + counter] = item.get("name");
data["quantity_" + counter] = item.quantity();
data["amount_" + counter] = (item.price()*1).toFixed(2);
data["item_number_" + counter] = item.get("item_number") || counter;
// add the options
simpleCart.each(item_options, function (val,k,attr) {
// paypal limits us to 10 options
if (k < 10) {
// check to see if we need to exclude this from checkout
send = true;
simpleCart.each(settings.excludeFromCheckout, function (field_name) {
if (field_name === attr) { send = false; }
});
if (send) {
optionCount += 1;
data["on" + k + "_" + counter] = attr;
data["os" + k + "_" + counter] = val;
}
}
});
// options count
data["option_index_"+ x] = Math.min(10, optionCount);
});
// return the data for the checkout form
return {
action : action
, method : method
, data : data
};
},
GoogleCheckout: function (opts) {
// account id is required
if (!opts.merchantID) {
return simpleCart.error("No merchant id provided for GoogleCheckout");
}
// google only accepts USD and GBP
if (simpleCart.currency().code !== "USD" && simpleCart.currency().code !== "GBP") {
return simpleCart.error("Google Checkout only accepts USD and GBP");
}
// build basic form options
var data = {
// TODO: better shipping support for this google
ship_method_name_1 : "Shipping"
, ship_method_price_1 : simpleCart.shipping()
, ship_method_currency_1: simpleCart.currency().code
, _charset_ : ''
},
action = "https://checkout.google.com/api/checkout/v2/checkoutForm/Merchant/" + opts.merchantID,
method = opts.method === "GET" ? "GET" : "POST";
// add items to data
simpleCart.each(function (item,x) {
var counter = x+1,
options_list = [],
send;
data['item_name_' + counter] = item.get('name');
data['item_quantity_' + counter] = item.quantity();
data['item_price_' + counter] = item.price();
data['item_currency_ ' + counter] = simpleCart.currency().code;
data['item_tax_rate' + counter] = item.get('taxRate') || simpleCart.taxRate();
// create array of extra options
simpleCart.each(item.options(), function (val,x,attr) {
// check to see if we need to exclude this from checkout
send = true;
simpleCart.each(settings.excludeFromCheckout, function (field_name) {
if (field_name === attr) { send = false; }
});
if (send) {
options_list.push(attr + ": " + val);
}
});
// add the options to the description
data['item_description_' + counter] = options_list.join(", ");
});
// return the data for the checkout form
return {
action : action
, method : method
, data : data
};
},
AmazonPayments: function (opts) {
// required options
if (!opts.merchant_signature) {
return simpleCart.error("No merchant signature provided for Amazon Payments");
}
if (!opts.merchant_id) {
return simpleCart.error("No merchant id provided for Amazon Payments");
}
if (!opts.aws_access_key_id) {
return simpleCart.error("No AWS access key id provided for Amazon Payments");
}
// build basic form options
var data = {
aws_access_key_id: opts.aws_access_key_id
, merchant_signature: opts.merchant_signature
, currency_code: simpleCart.currency().code
, tax_rate: simpleCart.taxRate()
, weight_unit: opts.weight_unit || 'lb'
},
action = "https://payments" + (opts.sandbox ? "-sandbox" : "") + ".amazon.com/checkout/" + opts.merchant_id,
method = opts.method === "GET" ? "GET" : "POST";
// add items to data
simpleCart.each(function (item,x) {
var counter = x+1,
options_list = [];
data['item_title_' + counter] = item.get('name');
data['item_quantity_' + counter] = item.quantity();
data['item_price_' + counter] = item.price();
data['item_sku_ ' + counter] = item.get('sku') || item.id();
data['item_merchant_id_' + counter] = opts.merchant_id;
if (item.get('weight')) {
data['item_weight_' + counter] = item.get('weight');
}
if (settings.shippingQuantityRate) {
data['shipping_method_price_per_unit_rate_' + counter] = settings.shippingQuantityRate;
}
// create array of extra options
simpleCart.each(item.options(), function (val,x,attr) {
// check to see if we need to exclude this from checkout
var send = true;
simpleCart.each(settings.excludeFromCheckout, function (field_name) {
if (field_name === attr) { send = false; }
});
if (send && attr !== 'weight' && attr !== 'tax') {
options_list.push(attr + ": " + val);
}
});
// add the options to the description
data['item_description_' + counter] = options_list.join(", ");
});
// return the data for the checkout form
return {
action : action
, method : method
, data : data
};
},
SendForm: function (opts) {
// url required
if (!opts.url) {
return simpleCart.error('URL required for SendForm Checkout');
}
// build basic form options
var data = {
currency : simpleCart.currency().code
, shipping : simpleCart.shipping()
, tax : simpleCart.tax()
, taxRate : simpleCart.taxRate()
, itemCount : simpleCart.find({}).length
},
action = opts.url,
method = opts.method === "GET" ? "GET" : "POST";
// add items to data
simpleCart.each(function (item,x) {
var counter = x+1,
options_list = [],
send;
data['item_name_' + counter] = item.get('name');
data['item_quantity_' + counter] = item.quantity();
data['item_price_' + counter] = item.price();
// create array of extra options
simpleCart.each(item.options(), function (val,x,attr) {
// check to see if we need to exclude this from checkout
send = true;
simpleCart.each(settings.excludeFromCheckout, function (field_name) {
if (field_name === attr) { send = false; }
});
if (send) {
options_list.push(attr + ": " + val);
}
});
// add the options to the description
data['item_options_' + counter] = options_list.join(", ");
});
// check for return and success URLs in the options
if (opts.success) {
data['return'] = opts.success;
}
if (opts.cancel) {
data.cancel_return = opts.cancel;
}
if (opts.extra_data) {
data = simpleCart.extend(data,opts.extra_data);
}
// return the data for the checkout form
return {
action : action
, method : method
, data : data
};
}
});
/*******************************************************************
* EVENT MANAGEMENT
*******************************************************************/
eventFunctions = {
// bind a callback to an event
bind: function (name, callback) {
if (!isFunction(callback)) {
return this;
}
if (!this._events) {
this._events = {};
}
// split by spaces to allow for multiple event bindings at once
var eventNameList = name.split(/ +/);
// iterate through and bind each event
simpleCart.each( eventNameList , function( eventName ){
if (this._events[eventName] === true) {
callback.apply(this);
} else if (!isUndefined(this._events[eventName])) {
this._events[eventName].push(callback);
} else {
this._events[eventName] = [callback];
}
});
return this;
},
// trigger event
trigger: function (name, options) {
var returnval = true,
x,
xlen;
if (!this._events) {
this._events = {};
}
if (!isUndefined(this._events[name]) && isFunction(this._events[name][0])) {
for (x = 0, xlen = this._events[name].length; x < xlen; x += 1) {
returnval = this._events[name][x].apply(this, (options || []));
}
}
if (returnval === false) {
return false;
}
return true;
}
};
// alias for bind
eventFunctions.on = eventFunctions.bind;
simpleCart.extend(eventFunctions);
simpleCart.extend(simpleCart.Item._, eventFunctions);
// base simpleCart events in options
baseEvents = {
beforeAdd : null
, afterAdd : null
, load : null
, beforeSave : null
, afterSave : null
, update : null
, ready : null
, checkoutSuccess : null
, checkoutFail : null
, beforeCheckout : null
, beforeRemove : null
};
// extend with base events
simpleCart(baseEvents);
// bind settings to events
simpleCart.each(baseEvents, function (val, x, name) {
simpleCart.bind(name, function () {
if (isFunction(settings[name])) {
settings[name].apply(this, arguments);
}
});
});
/*******************************************************************
* FORMATTING FUNCTIONS
*******************************************************************/
simpleCart.extend({
toCurrency: function (number,opts) {
var num = parseFloat(number),
opt_input = opts || {},
_opts = simpleCart.extend(simpleCart.extend({
symbol: "$"
, decimal: "."
, delimiter: ","
, accuracy: 2
, after: false
}, simpleCart.currency()), opt_input),
numParts = num.toFixed(_opts.accuracy).split("."),
dec = numParts[1],
ints = numParts[0];
ints = simpleCart.chunk(ints.reverse(), 3).join(_opts.delimiter.reverse()).reverse();
return (!_opts.after ? _opts.symbol : "") +
ints +
(dec ? _opts.decimal + dec : "") +
(_opts.after ? _opts.symbol : "");
},
// break a string in blocks of size n
chunk: function (str, n) {
if (typeof n==='undefined') {
n=2;
}
var result = str.match(new RegExp('.{1,' + n + '}','g'));
return result || [];
}
});
// reverse string function
String.prototype.reverse = function () {
return this.split("").reverse().join("");
};
// currency functions
simpleCart.extend({
currency: function (currency) {
if (isString(currency) && !isUndefined(currencies[currency])) {
settings.currency = currency;
} else if (isObject(currency)) {
currencies[currency.code] = currency;
settings.currency = currency.code;
} else {
return currencies[settings.currency];
}
}
});
/*******************************************************************
* VIEW MANAGEMENT
*******************************************************************/
simpleCart.extend({
// bind outlets to function
bindOutlets: function (outlets) {
simpleCart.each(outlets, function (callback, x, selector) {
simpleCart.bind('update', function () {
simpleCart.setOutlet("." + namespace + "_" + selector, callback);
});
});
},
// set function return to outlet
setOutlet: function (selector, func) {
var val = func.call(simpleCart, selector);
if (isObject(val) && val.el) {
simpleCart.$(selector).html(' ').append(val);
} else if (!isUndefined(val)) {
simpleCart.$(selector).html(val);
}
},
// bind click events on inputs
bindInputs: function (inputs) {
simpleCart.each(inputs, function (info) {
simpleCart.setInput("." + namespace + "_" + info.selector, info.event, info.callback);
});
},
// attach events to inputs
setInput: function (selector, event, func) {
simpleCart.$(selector).live(event, func);
}
});
// class for wrapping DOM selector shit
simpleCart.ELEMENT = function (selector) {
this.create(selector);
this.selector = selector || null; // "#" + this.attr('id'); TODO: test length?
};
simpleCart.extend(selectorFunctions, {
"MooTools" : {
text: function (text) {
return this.attr(_TEXT_, text);
},
html: function (html) {
return this.attr(_HTML_, html);
},
val: function (val) {
return this.attr(_VALUE_, val);
},
attr: function (attr, val) {
if (isUndefined(val)) {
return this.el[0] && this.el[0].get(attr);
}
this.el.set(attr, val);
return this;
},
remove: function () {
this.el.dispose();
return null;
},
addClass: function (klass) {
this.el.addClass(klass);
return this;
},
removeClass: function (klass) {
this.el.removeClass(klass);
return this;
},
append: function (item) {
this.el.adopt(item.el);
return this;
},
each: function (callback) {
if (isFunction(callback)) {
simpleCart.each(this.el, function( e, i, c) {
callback.call( i, i, e, c );
});
}
return this;
},
click: function (callback) {
if (isFunction(callback)) {
this.each(function (e) {
e.addEvent(_CLICK_, function (ev) {
callback.call(e,ev);
});
});
} else if (isUndefined(callback)) {
this.el.fireEvent(_CLICK_);
}
return this;
},
live: function ( event,callback) {
var selector = this.selector;
if (isFunction(callback)) {
simpleCart.$("body").el.addEvent(event + ":relay(" + selector + ")", function (e, el) {
callback.call(el, e);
});
}
},
match: function (selector) {
return this.el.match(selector);
},
parent: function () {
return simpleCart.$(this.el.getParent());
},
find: function (selector) {
return simpleCart.$(this.el.getElements(selector));
},
closest: function (selector) {
return simpleCart.$(this.el.getParent(selector));
},
descendants: function () {
return this.find("*");
},
tag: function () {
return this.el[0].tagName;
},
submit: function (){
this.el[0].submit();
return this;
},
create: function (selector) {
this.el = $engine(selector);
}
},
"Prototype" : {
text: function (text) {
if (isUndefined(text)) {
return this.el[0].innerHTML;
}
this.each(function (i,e) {
$(e).update(text);
});
return this;
},
html: function (html) {
return this.text(html);
},
val: function (val) {
return this.attr(_VALUE_, val);
},
attr: function (attr, val) {
if (isUndefined(val)) {
return this.el[0].readAttribute(attr);
}
this.each(function (i,e) {
$(e).writeAttribute(attr, val);
});
return this;
},
append: function (item) {
this.each(function (i,e) {
if (item.el) {
item.each(function (i2,e2) {
$(e).appendChild(e2);
});
} else if (isElement(item)) {
$(e).appendChild(item);
}
});
return this;
},
remove: function () {
this.each(function (i, e) {
$(e).remove();
});
return this;
},
addClass: function (klass) {
this.each(function (i, e) {
$(e).addClassName(klass);
});
return this;
},
removeClass: function (klass) {
this.each(function (i, e) {
$(e).removeClassName(klass);
});
return this;
},
each: function (callback) {
if (isFunction(callback)) {
simpleCart.each(this.el, function( e, i, c) {
callback.call( i, i, e, c );
});
}
return this;
},
click: function (callback) {
if (isFunction(callback)) {
this.each(function (i, e) {
$(e).observe(_CLICK_, function (ev) {
callback.call(e,ev);
});
});
} else if (isUndefined(callback)) {
this.each(function (i, e) {
$(e).fire(_CLICK_);
});
}
return this;
},
live: function (event,callback) {
if (isFunction(callback)) {
var selector = this.selector;
document.observe(event, function (e, el) {
if (el === $engine(e).findElement(selector)) {
callback.call(el, e);
}
});
}
},
parent: function () {
return simpleCart.$(this.el.up());
},
find: function (selector) {
return simpleCart.$(this.el.getElementsBySelector(selector));
},
closest: function (selector) {
return simpleCart.$(this.el.up(selector));
},
descendants: function () {
return simpleCart.$(this.el.descendants());
},
tag: function () {
return this.el.tagName;
},
submit: function() {
this.el[0].submit();
},
create: function (selector) {
if (isString(selector)) {
this.el = $engine(selector);
} else if (isElement(selector)) {
this.el = [selector];
}
}
},
"jQuery": {
passthrough: function (action, val) {
if (isUndefined(val)) {
return this.el[action]();
}
this.el[action](val);
return this;
},
text: function (text) {
return this.passthrough(_TEXT_, text);
},
html: function (html) {
return this.passthrough(_HTML_, html);
},
val: function (val) {
return this.passthrough("val", val);
},
append: function (item) {
var target = item.el || item;
this.el.append(target);
return this;
},
attr: function (attr, val) {
if (isUndefined(val)) {
return this.el.attr(attr);
}
this.el.attr(attr, val);
return this;
},
remove: function () {
this.el.remove();
return this;
},
addClass: function (klass) {
this.el.addClass(klass);
return this;
},
removeClass: function (klass) {
this.el.removeClass(klass);
return this;
},
each: function (callback) {
return this.passthrough('each', callback);
},
click: function (callback) {
return this.passthrough(_CLICK_, callback);
},
live: function (event, callback) {
$engine(document).delegate(this.selector, event, callback);
return this;
},
parent: function () {
return simpleCart.$(this.el.parent());
},
find: function (selector) {
return simpleCart.$(this.el.find(selector));
},
closest: function (selector) {
return simpleCart.$(this.el.closest(selector));
},
tag: function () {
return this.el[0].tagName;
},
descendants: function () {
return simpleCart.$(this.el.find("*"));
},
submit: function() {
return this.el.submit();
},
create: function (selector) {
this.el = $engine(selector);
}
}
});
simpleCart.ELEMENT._ = simpleCart.ELEMENT.prototype;
// bind the DOM setup to the ready event
simpleCart.ready(simpleCart.setupViewTool);
// bind the input and output events
simpleCart.ready(function () {
simpleCart.bindOutlets({
total: function () {
return simpleCart.toCurrency(simpleCart.total());
}
, quantity: function () {
return simpleCart.quantity();
}
, items: function (selector) {
simpleCart.writeCart(selector);
}
, tax: function () {
return simpleCart.toCurrency(simpleCart.tax());
}
, taxRate: function () {
return simpleCart.taxRate().toFixed();
}
, shipping: function () {
return simpleCart.toCurrency(simpleCart.shipping());
}
, grandTotal: function () {
return simpleCart.toCurrency(simpleCart.grandTotal());
}
});
simpleCart.bindInputs([
{ selector: 'checkout'
, event: 'click'
, callback: function () {
simpleCart.checkout();
}
}
, { selector: 'empty'
, event: 'click'
, callback: function () {
simpleCart.empty();
}
}
, { selector: 'increment'
, event: 'click'
, callback: function () {
simpleCart.find(simpleCart.$(this).closest('.itemRow').attr('id').split("_")[1]).increment();
simpleCart.update();
}
}
, { selector: 'decrement'
, event: 'click'
, callback: function () {
simpleCart.find(simpleCart.$(this).closest('.itemRow').attr('id').split("_")[1]).decrement();
simpleCart.update();
}
}
/* remove from cart */
, { selector: 'remove'
, event: 'click'
, callback: function () {
simpleCart.find(simpleCart.$(this).closest('.itemRow').attr('id').split("_")[1]).remove();
}
}
/* cart inputs */
, { selector: 'input'
, event: 'change'
, callback: function () {
var $input = simpleCart.$(this),
$parent = $input.parent(),
classList = $parent.attr('class').split(" ");
simpleCart.each(classList, function (klass) {
if (klass.match(/item-.+/i)) {
var field = klass.split("-")[1];
simpleCart.find($parent.closest('.itemRow').attr('id').split("_")[1]).set(field,$input.val());
simpleCart.update();
return;
}
});
}
}
/* here is our shelfItem add to cart button listener */
, { selector: 'shelfItem .item_add'
, event: 'click'
, callback: function () {
var $button = simpleCart.$(this),
fields = {};
$button.closest("." + namespace + "_shelfItem").descendants().each(function (x,item) {
var $item = simpleCart.$(item);
// check to see if the class matches the item_[fieldname] pattern
if ($item.attr("class") &&
$item.attr("class").match(/item_.+/) &&
!$item.attr('class').match(/item_add/)) {
// find the class name
simpleCart.each($item.attr('class').split(' '), function (klass) {
var attr,
val,
type;
// get the value or text depending on the tagName
if (klass.match(/item_.+/)) {
attr = klass.split("_")[1];
val = "";
switch($item.tag().toLowerCase()) {
case "input":
case "textarea":
case "select":
type = $item.attr("type");
if (!type || ((type.toLowerCase() === "checkbox" || type.toLowerCase() === "radio") && $item.attr("checked")) || type.toLowerCase() === "text" || type.toLowerCase() === "number") {
val = $item.val();
}
break;
case "img":
val = $item.attr('src');
break;
default:
val = $item.text();
break;
}
if (val !== null && val !== "") {
fields[attr.toLowerCase()] = fields[attr.toLowerCase()] ? fields[attr.toLowerCase()] + ", " + val : val;
}
}
});
}
});
// add the item
simpleCart.add(fields);
}
}
]);
});
/*******************************************************************
* DOM READY
*******************************************************************/
// Cleanup functions for the document ready method
// used from jQuery
/*global DOMContentLoaded */
if (document.addEventListener) {
window.DOMContentLoaded = function () {
document.removeEventListener("DOMContentLoaded", DOMContentLoaded, false);
simpleCart.init();
};
} else if (document.attachEvent) {
window.DOMContentLoaded = function () {
// Make sure body exists, at least, in case IE gets a little overzealous (ticket #5443).
if (document.readyState === "complete") {
document.detachEvent("onreadystatechange", DOMContentLoaded);
simpleCart.init();
}
};
}
// The DOM ready check for Internet Explorer
// used from jQuery
function doScrollCheck() {
if (simpleCart.isReady) {
return;
}
try {
// If IE is used, use the trick by Diego Perini
// http://javascript.nwbox.com/IEContentLoaded/
document.documentElement.doScroll("left");
} catch (e) {
setTimeout(doScrollCheck, 1);
return;
}
// and execute any waiting functions
simpleCart.init();
}
// bind ready event used from jquery
function sc_BindReady () {
// Catch cases where $(document).ready() is called after the
// browser event has already occurred.
if (document.readyState === "complete") {
// Handle it asynchronously to allow scripts the opportunity to delay ready
return setTimeout(simpleCart.init, 1);
}
// Mozilla, Opera and webkit nightlies currently support this event
if (document.addEventListener) {
// Use the handy event callback
document.addEventListener("DOMContentLoaded", DOMContentLoaded, false);
// A fallback to window.onload, that will always work
window.addEventListener("load", simpleCart.init, false);
// If IE event model is used
} else if (document.attachEvent) {
// ensure firing before onload,
// maybe late but safe also for iframes
document.attachEvent("onreadystatechange", DOMContentLoaded);
// A fallback to window.onload, that will always work
window.attachEvent("onload", simpleCart.init);
// If IE and not a frame
// continually check to see if the document is ready
var toplevel = false;
try {
toplevel = window.frameElement === null;
} catch (e) {}
if (document.documentElement.doScroll && toplevel) {
doScrollCheck();
}
}
}
// bind the ready event
sc_BindReady();
return simpleCart;
};
window.simpleCart = generateSimpleCart();
}(window, document));
/************ JSON *************/
var JSON;JSON||(JSON={});
(function () {function k(a) {return a<10?"0"+a:a}function o(a) {p.lastIndex=0;return p.test(a)?'"'+a.replace(p,function (a) {var c=r[a];return typeof c==="string"?c:"\\u"+("0000"+a.charCodeAt(0).toString(16)).slice(-4)})+'"':'"'+a+'"'}function l(a,j) {var c,d,h,m,g=e,f,b=j[a];b&&typeof b==="object"&&typeof b.toJSON==="function"&&(b=b.toJSON(a));typeof i==="function"&&(b=i.call(j,a,b));switch(typeof b) {case "string":return o(b);case "number":return isFinite(b)?String(b):"null";case "boolean":case "null":return String(b);case "object":if (!b)return"null";
e += n;f=[];if (Object.prototype.toString.apply(b)==="[object Array]") {m=b.length;for (c=0;c<m;c += 1)f[c]=l(c,b)||"null";h=f.length===0?"[]":e?"[\n"+e+f.join(",\n"+e)+"\n"+g+"]":"["+f.join(",")+"]";e=g;return h}if (i&&typeof i==="object") {m=i.length;for (c=0;c<m;c += 1)typeof i[c]==="string"&&(d=i[c],(h=l(d,b))&&f.push(o(d)+(e?": ":":")+h))}else for (d in b)Object.prototype.hasOwnProperty.call(b,d)&&(h=l(d,b))&&f.push(o(d)+(e?": ":":")+h);h=f.length===0?"{}":e?"{\n"+e+f.join(",\n"+e)+"\n"+g+"}":"{"+f.join(",")+
"}";e=g;return h}}if (typeof Date.prototype.toJSON!=="function")Date.prototype.toJSON=function () {return isFinite(this.valueOf())?this.getUTCFullYear()+"-"+k(this.getUTCMonth()+1)+"-"+k(this.getUTCDate())+"T"+k(this.getUTCHours())+":"+k(this.getUTCMinutes())+":"+k(this.getUTCSeconds())+"Z":null},String.prototype.toJSON=Number.prototype.toJSON=Boolean.prototype.toJSON=function () {return this.valueOf()};var q=/[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,
p=/[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,e,n,r={"\u0008":"\\b","\t":"\\t","\n":"\\n","\u000c":"\\f","\r":"\\r",'"':'\\"',"\\":"\\\\"},i;if (typeof JSON.stringify!=="function")JSON.stringify=function (a,j,c) {var d;n=e="";if (typeof c==="number")for (d=0;d<c;d += 1)n += " ";else typeof c==="string"&&(n=c);if ((i=j)&&typeof j!=="function"&&(typeof j!=="object"||typeof j.length!=="number"))throw Error("JSON.stringify");return l("",
{"":a})};if (typeof JSON.parse!=="function")JSON.parse=function (a,e) {function c(a,d) {var g,f,b=a[d];if (b&&typeof b==="object")for (g in b)Object.prototype.hasOwnProperty.call(b,g)&&(f=c(b,g),f!==void 0?b[g]=f:delete b[g]);return e.call(a,d,b)}var d,a=String(a);q.lastIndex=0;q.test(a)&&(a=a.replace(q,function (a) {return"\\u"+("0000"+a.charCodeAt(0).toString(16)).slice(-4)}));if (/^[\],:{}\s]*$/.test(a.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g,"@").replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g,
"]").replace(/(?:^|:|,)(?:\s*\[)+/g,"")))return d=eval("("+a+")"),typeof e==="function"?c({"":d},""):d;throw new SyntaxError("JSON.parse");}})();
/************ HTML5 Local Storage Support *************/
(function () {if (!this.localStorage)if (this.globalStorage)try {this.localStorage=this.globalStorage}catch(e) {}else{var a=document.createElement("div");a.style.display="none";document.getElementsByTagName("head")[0].appendChild(a);if (a.addBehavior) {a.addBehavior("#default#userdata");var d=this.localStorage={length:0,setItem:function (b,d) {a.load("localStorage");b=c(b);a.getAttribute(b)||this.length++;a.setAttribute(b,d);a.save("localStorage")},getItem:function (b) {a.load("localStorage");b=c(b);return a.getAttribute(b)},
removeItem:function (b) {a.load("localStorage");b=c(b);a.removeAttribute(b);a.save("localStorage");this.length=0},clear:function () {a.load("localStorage");for (var b=0;attr=a.XMLDocument.documentElement.attributes[b++];)a.removeAttribute(attr.name);a.save("localStorage");this.length=0},key:function (b) {a.load("localStorage");return a.XMLDocument.documentElement.attributes[b]}},c=function (a) {return a.replace(/[^-._0-9A-Za-z\xb7\xc0-\xd6\xd8-\xf6\xf8-\u037d\u37f-\u1fff\u200c-\u200d\u203f\u2040\u2070-\u218f]/g,
"-")};a.load("localStorage");d.length=a.XMLDocument.documentElement.attributes.length}}})();
//]]>
</script>
</head>
<body>
<!--/- Outer-Wrrapper -/-->
<div class='outer-wrapper'>
<!--/- Header -/-->
<div class='header-wrapper'>
<div class='header-container'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='WhereIsMyIpAdress (Header)' type='Header'>
</b:widget>
</b:section>
<div class='menu'>
<ul>
<li><a href='#URL'>Home</a></li>
<li><a href='#URL'>Menu Item</a></li>
<li><a href='#URL'>Menu Item</a>
<ul class='subMenu'>
<li><a href='#URL'>Menu Item</a></li>
<li><a href='#URL'>Menu Item</a></li>
<li><a href='#URL'>Menu Item</a></li>
<li><a href='#URL'>Menu Item</a></li>
<li><a href='#URL'>Menu Item</a></li>
</ul>
</li>
<li><a href='#URL'>Menu Item</a></li>
<li><a href='#URL'>Menu Item</a></li>
<li><a href='#URL'>Menu Item</a></li>
</ul>
</div>
<div class='clear'/>
</div>
</div>
<!--/- End of Header -/-->
<div class='content-wrapper'>
<div class='cross-content'>
<div class='search'>
<form accept-charset='utf-8' action='/search' id='search' method='GET'>
<input class='input' name='q' onblur='if(this.value=='')this.value='type your search and hit enter'' onfocus='if(this.value=='type your search and hit enter')this.value=''' size='24' type='text' value='type your search and hit enter'/>
</form>
</div>
<div class='cartwrp'>
<div class='cartInfo'>
<span class='simpleCart_quantity'/> item(s)
</div>
<div class='cartBox'>
<div class='menu-cart'>
<b>In your cart:</b> <a class='simpleCart_empty' href='javascript:'>Clear Cart</a><br/>
<span class='simpleCart_quantity'/> item(s) -
Total Price : <span class='simpleCart_total'/> <br/>
<div class='divider'/>
<a class='view-cart' href='ADD BLOG VIEW CART PAGE URL' title='View Cart'>View Cart</a>
<a class='simpleCart_checkout' href='javascript:'>Checkout</a>
<div class='clear'/>
</div>
</div>
</div>
<div class='clear'/>
</div>
<div class='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>
<b:includable id='main' var='top'>
<b:if cond='data:mobile == "false"'>
<div class='blog-posts hfeed'>
<b:include data='top' name='status-message'/>
<data:defaultAdStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.isDateStart'>
<b:if cond='data:post.isFirstPost == "false"'>
</div></div>
</b:if>
</b:if>
<b:if cond='data:post.isDateStart'>
<div class="date-outer">
</b:if>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><span><data:post.dateHeader/></span></h2>
</b:if>
<b:if cond='data:post.isDateStart'>
<div class="date-posts">
</b:if>
<div class='post-outer simpleCart_shelfItem'>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "static_page"'>
<b:include data='post' name='comment_picker'/>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comment_picker'/>
</b:if>
</div>
<b:if cond='data:post.includeAd'>
<b:if cond='data:post.isFirstPost'>
<data:defaultAdEnd/>
<b:else/>
<data:adEnd/>
</b:if>
<div class='inline-ad'>
<data:adCode/>
</div>
<data:adStart/>
</b:if>
</b:loop>
<b:if cond='data:numPosts != 0'>
</div></div>
</b:if>
<data:adEnd/>
</div>
<b:include name='nextprev'/>
<b:include name='feedLinks'/>
<b:if cond='data:top.showStars'>
<script src='//www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>/*<![CDATA[*/google.load("annotations","1",{"locale":"<data:top.languageCode/>"});function initialize(){google.annotations.setApplicationId(<data:top.blogspotReviews/>);google.annotations.createAll();google.annotations.fetch();}
google.setOnLoadCallback(initialize);/*]]>*/</script>
</b:if>
<b:else/>
<b:include name='mobile-main'/>
</b:if>
<b:if cond='data:top.showDummy'>
<data:top.dummyBootstrap/>
</b:if>
</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'></b:includable>
<b:includable id='comment-form' var='post'></b:includable>
<b:includable id='commentDeleteIcon' var='comment'></b:includable>
<b:includable id='comment_count_picker' var='post'></b:includable>
<b:includable id='comment_picker' var='post'></b:includable>
<b:includable id='comments' var='post'></b:includable>
<b:includable id='feedLinks'></b:includable>
<b:includable id='feedLinksBody' var='links'></b:includable>
<b:includable id='iframe_comments' var='post'></b:includable>
<b:includable id='mobile-index-post' var='post'></b:includable>
<b:includable id='mobile-main' var='top'></b:includable>
<b:includable id='mobile-nextprev'></b:includable>
<b:includable id='mobile-post' var='post'></b:includable>
<b:includable id='nextprev'></b:includable>
<b:includable id='post' var='post'>
<div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
<b:if cond='data:post.firstImageUrl'>
<meta expr:content='data:post.firstImageUrl' itemprop='image_url'/>
</b:if>
<meta expr:content='data:blog.blogId' itemprop='blogId'/>
<meta expr:content='data:post.id' itemprop='postId'/>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title item_name entry-title' itemprop='name'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<b:if cond='data:blog.url != data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<a expr:href='data:post.url'><data:post.title/></a>
</b:if>
<b:else/>
<a expr:href='data:post.url'><data:post.title/></a>
</b:if>
</b:if>
</h3>
</b:if>
<div class='post-header'>
<b:if cond='data:blog.pageType == "item"'>
<ul class='post-header-line-0 post-data-meta'>
<li>
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<b:if cond='data:post.authorProfileUrl'>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
<span itemprop='name'><data:post.author/></span>
</a>
</span>
<b:else/>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<span itemprop='name'><data:post.author/></span>
</span>
</b:if>
</b:if>
</span>
</li>
<li>
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>
</li>
<li>
<b:include name='nextprev'/>
</li>
<li>
<b:include data='post' name='postQuickEdit'/></li>
</ul>
</b:if>
<div class='post-header-line-1'/>
</div>
<b:if cond='data:blog.metaDescription == ""'>
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id' itemprop='description articleBody'>
<data:post.body/>
<b:if cond='data:blog.pageType != "static_page"'>
<div class='item-bottom'>
<b:if cond='data:blog.pageType == "item"'>
<b>Quantity :</b><input class='item_Quantity' max='10000' min='1' type='number' value='1'/>
</b:if>
<a class='item_add' href='javascript:'>Add to Cart</a>
<b:if cond='data:blog.pageType != "item"'>
<a class='post-judul animated' expr:href='data:post.url'><data:post.title/></a>
</b:if>
</div>
</b:if>
<div style='clear:both'/>
</div>
<b:else/>
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id' itemprop='articleBody'>
<data:post.body/>
<div style='clear:both'/>
<div class='item-bottom'>
<a class='item_add' href='javascript:'>Add to Cart</a>
</div>
</div>
</b:if>
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'><div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div>
<span class='star-ratings'>
<b:if cond='data:top.showStars'>
<div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:height='42' g:type='RatingPanel' g:width='280'/>
</b:if>
</span>
</div>
<div class='post-footer-line post-footer-line-2'/>
<div class='post-footer-line post-footer-line-3'/>
</div>
</div>
</b:includable>
<b:includable id='postQuickEdit' var='post'></b:includable>
<b:includable id='shareButtons' var='post'></b:includable>
<b:includable id='status-message'></b:includable>
<b:includable id='threaded_comments' var='post'></b:includable>
</b:widget>
</b:section>
<div class='clear'/>
</div>
</div> <!-- end content-wrapper -->
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
</div> <!--/- End of Outer-Wrrapper -/-->
</body>
</html>
Subscribe to:
Post Comments (Atom)
0 comments:
Post a Comment