.DemoStory .cards{position:relative;list-style-type:none;padding:0;max-width:967px;height:420px;margin:auto}.DemoStory .card{position:absolute;top:0;left:0;right:0;margin:auto;z-index:2;background:#fff;border-radius:30px;padding:56px;width:100%;height:420px;box-shadow:0 1.45px 21.49px 0 rgba(193,202,184,.3058823529);transform:translateY(75px) rotate(0deg) translateX(44px) scale(.9);transform-origin:0 0;transition:transform .6s cubic-bezier(.8,.2,.1,.8) .1s,background .4s linear;cursor:pointer;user-select:none;perspective:1000px;perspective-origin:50% 50%}@media (min-width:767px)and (max-width:1024px){.DemoStory .card{transform:translateY(40px) rotate(0deg) translateX(20px) scale(.96)}}.DemoStory .card :last-child{margin-bottom:0}.DemoStory .card--next{z-index:5;transform:translateY(42px) rotate(0deg) translateX(25px) scale(.94);box-shadow:0 21.45px 71.49px 0 rgba(193,202,184,.5019607843)}.DemoStory .card--out{animation:card-out 2s cubic-bezier(.8,.2,.1,.8);transform:translateY(90%) rotateX(160deg) scale(.8);z-index:1;background:#fff}@keyframes card-out{0%{z-index:20;transform:translateY(0)}50%{transform:translateY(-10%) rotateX(90deg) scale(1) translateX(0)}80%{z-index:1}to{transform:translateY(90%) rotateX(160deg) scale(1)}}.DemoStory .card--current{cursor:auto;user-select:auto;position:relative;z-index:10;opacity:1;background:#fff;box-shadow:0 21.45px 71.49px 0 rgba(193,202,184,.5019607843);transform:rotate(0deg) translateX(0) scale(1)}@media (max-width:767px){.DemoStory .cards{max-width:100%;height:420px}.DemoStory .card{padding:24px;height:420px;box-shadow:none;border-radius:24px;transform:translateY(0) rotate(0deg) translateX(0) scale(1);transform-origin:0 0;transition:transform .6s cubic-bezier(.8,.2,.1,.8) .1s,background .4s linear}.DemoStory .card--next{z-index:5;box-shadow:none;transform:translateY(0) rotate(0deg) translateX(0) scale(1)}}@media (min-width:767px)and (max-width:1024px){.DemoStory .card--next{transform:translateY(20px) rotate(0deg) translateX(10px) scale(.98)}}