.wpcsn-notification .wpcsn-notification-item{background:#fff;position:fixed;z-index:9999;display:none;align-items:center;width:calc(100% - 60px);max-width:450px;padding:0;font-size:15px;border-radius:0;overflow:hidden;border:1px solid #eeeeee;box-shadow:0 4px 4px rgba(0,0,0,.03)}

.wpcsn-notification .wpcsn-notification-item a{cursor:pointer;text-decoration:none;color:inherit;display:block;outline:none}

.wpcsn-notification .wpcsn-notification-time{font-size:12px;color:#999999}

.wpcsn-notification .wpcsn-notification-thumbnail{display:inline-block;width:80px;flex:0 0 80px;margin:0;text-align:center}

.wpcsn-notification .wpcsn-notification-thumbnail img{border-radius:0;display:block;margin:0;padding:0;max-width:100%;height:auto}

.wpcsn-notification .wpcsn-notification-content-wrap{padding:10px 30px 10px 10px;flex-grow:1}

.wpcsn-notification .wpcsn-notification-content-wrap .wpcsn-notification-title a{display:inline-block;font-weight:700}

.wpcsn-notification .wpcsn-notification-item.wpcsn-notification-item-new-order .wpcsn-notification-content a,.wpcsn-notification .wpcsn-notification-item.wpcsn-notification-item-virtual-order .wpcsn-notification-content a{display:inline-block;font-weight:700}

.wpcsn-notification .wpcsn-notification-item.wpcsn-notification-item-html a{display:inline-block;text-decoration:underline}

.wpcsn-notification .wpcsn-notification-item.wpcsn-notification-item-cart .wpcsn-cart-subtotal{font-weight:700}

.wpcsn-notification .wpcsn-notification-close{position:absolute;top:0;right:0;width:30px;height:30px;padding:10px;cursor:pointer;background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXIteCI+PGxpbmUgeDE9IjE4IiB5MT0iNiIgeDI9IjYiIHkyPSIxOCI+PC9saW5lPjxsaW5lIHgxPSI2IiB5MT0iNiIgeDI9IjE4IiB5Mj0iMTgiPjwvbGluZT48L3N2Zz4=") center no-repeat;opacity:.5}

.wpcsn-notification .wpcsn-notification-item:after{content:"";clear:both;display:table}

.wpcsn-notification.top-left .wpcsn-notification-item{top:30px;left:30px}

.wpcsn-notification.bottom-left .wpcsn-notification-item{bottom:30px;left:30px}

.wpcsn-notification.top-right .wpcsn-notification-item{top:30px;right:30px}

.wpcsn-notification.bottom-right .wpcsn-notification-item{bottom:30px;right:30px}

.wpcsn-notification-item.bounceIn{animation-duration:1s;animation-name:wpcsnBounceIn}

.wpcsn-notification-item.bounceInUp{animation-duration:1.5s;animation-name:wpcsnBounceInUp}

.wpcsn-notification-item.bounceInDown{animation-duration:1s;animation-name:wpcsnBounceInDown}

.wpcsn-notification-item.bounceInLeft{animation-duration:1s;animation-name:wpcsnBounceInLeft}

.wpcsn-notification-item.bounceInRight{animation-duration:1s;animation-name:wpcsnBounceInRight}

.wpcsn-notification-item.bounceOut{animation-duration:1.5s;animation-name:wpcsnBounceOut;opacity:0}

.wpcsn-notification-item.bounceOutUp{animation-duration:1.5s;animation-name:wpcsnBounceOutUp;opacity:0}

.wpcsn-notification-item.bounceOutDown{animation-duration:1.5s;animation-name:wpcsnBounceOutDown;opacity:0}

.wpcsn-notification-item.bounceOutLeft{animation-duration:1.5s;animation-name:wpcsnBounceOutLeft;opacity:0}

.wpcsn-notification-item.bounceOutRight{animation-duration:1.5s;animation-name:wpcsnBounceOutRight;opacity:0}

@media only screen and (max-width:480px){.wpcsn-notification .wpcsn-notification-item{width:calc(100% - 30px);left:15px;right:15px}

.wpcsn-notification.bottom-left .wpcsn-notification-item,.wpcsn-notification.bottom-right .wpcsn-notification-item{bottom:15px}

.wpcsn-notification.top-left .wpcsn-notification-item,.wpcsn-notification.top-right .wpcsn-notification-item{bottom:15px}
}

@keyframes wpcsnBounceIn{from,20%,40%,60%,80%,to{animation-timing-function:cubic-bezier(0.215,0.61,0.355,1)}
0%{opacity:0;transform:scale3d(0.3,0.3,0.3)}
20%{transform:scale3d(1.1,1.1,1.1)}
40%{transform:scale3d(0.9,0.9,0.9)}
60%{opacity:1;transform:scale3d(1.03,1.03,1.03)}
80%{transform:scale3d(0.97,0.97,0.97)}
to{opacity:1;transform:scale3d(1,1,1)}
}
@keyframes wpcsnBounceInUp{40%,60%,75%,90%,100%{animation-timing-function:cubic-bezier(0.215,0.61,0.355,1)}
0%,40%{opacity:0;transform:translate3d(0,100px,0)}
60%{opacity:1;transform:translate3d(0,-20px,0)}
75%{transform:translate3d(0,10px,0)}
90%{transform:translate3d(0,-5px,0)}
100%{transform:translate3d(0,0,0)}
}
@keyframes wpcsnBounceInDown{40%,60%,75%,90%,100%{animation-timing-function:cubic-bezier(0.215,0.61,0.355,1)}
0%,40%{opacity:0;transform:translate3d(0,-100px,0)}
60%{opacity:1;transform:translate3d(0,25px,0)}
75%{transform:translate3d(0,-10px,0)}
90%{transform:translate3d(0,5px,0)}
100%{transform:none}
}
@keyframes wpcsnBounceInLeft{40%,60%,75%,90%,100%{animation-timing-function:cubic-bezier(0.215,0.61,0.355,1)}
0%,40%{opacity:0;transform:translate3d(-100px,0,0)}
60%{opacity:1;transform:translate3d(25px,0,0)}
75%{transform:translate3d(-10px,0,0)}
90%{transform:translate3d(5px,0,0)}
100%{transform:none}
}
@keyframes wpcsnBounceInRight{40%,60%,75%,90%,100%{animation-timing-function:cubic-bezier(0.215,0.61,0.355,1)}
0%,40%{opacity:0;transform:translate3d(100px,0,0)}
60%{opacity:1;transform:translate3d(-25px,0,0)}
75%{transform:translate3d(10px,0,0)}
90%{transform:translate3d(-5px,0,0)}
100%{transform:none}
}
@keyframes wpcsnBounceOut{0%{opacity:1}
20%{transform:scale3d(0.9,0.9,0.9)}
50%,55%{opacity:1;transform:scale3d(1.1,1.1,1.1)}
100%{opacity:0;transform:scale3d(0.3,0.3,0.3)}
}
@keyframes wpcsnBounceOutUp{0%{opacity:1}
20%{opacity:1;transform:translate3d(0,-10px,0)}
40%,45%{opacity:0.5;transform:translate3d(0,20px,0)}
80%,100%{opacity:0;transform:translate3d(0,-50px,0)}
}

@keyframes wpcsnBounceOutDown{0%{opacity:1}
20%{opacity:1;transform:translate3d(0,10px,0)}
40%,45%{opacity:0.5;transform:translate3d(0,-20px,0)}
80%,100%{opacity:0;transform:translate3d(0,50px,0)}
}
@keyframes wpcsnBounceOutLeft{0%{opacity:1}
20%{opacity:1;transform:translate3d(20px,0,0)}
40%,100%{opacity:0;transform:translate3d(-100px,0,0)}
}
@keyframes wpcsnBounceOutRight{0%{opacity:1}
20%{opacity:1;transform:translate3d(-20px,0,0)}
40%,100%{opacity:0;transform:translate3d(100px,0,0)}
}
