.wrap{margin:0 auto;width:100%;height:0;padding-top:58%;overflow:hidden;position:relative}.mockup{position:absolute;top:0;-webkit-transform-origin:0 0;transform-origin:0 0}.mockup::after{content:'';position:absolute;background:rgba(51,71,89,.5);top:0;left:0;width:100%;height:100%;pointer-events:none}.mockup__img{display:block;width:1900px}.mobile,.screen{position:absolute;overflow:hidden;z-index:100;background:#333;outline:transparent solid 1px;-webkit-transform-origin:0 0 0;transform-origin:0 0 0}.screen{width:1280px;height:800px;top:10px;left:600px;-webkit-transform:matrix3d(.452711184975633,.139863853789781,0,-.000095269465775677,-.00319943882448498,.673512589529646,0,.000049453592261685,0,0,1,0,382,8,0,1);transform:matrix3d(.452711184975633,.139863853789781,0,-.000095269465775677,-.00319943882448498,.673512589529646,0,.000049453592261685,0,0,1,0,382,8,0,1)}.mobile{width:320px;height:480px;top:850px;left:525px;-webkit-transform:matrix3d(.442778970432011,.112834189093484,0,-.000053669440509915,-.344035499291785,.346595156594271,0,-.000094674614416115,0,0,1,0,105,15,0,1);transform:matrix3d(.442778970432011,.112834189093484,0,-.000053669440509915,-.344035499291785,.346595156594271,0,-.000094674614416115,0,0,1,0,105,15,0,1)}.slideshow,.slideshow img{width:100%}.slideshow{padding:0;margin:0;height:100%;list-style-type:none}.slideshow__item{width:100%;height:100%;position:absolute;overflow:hidden;pointer-events:none;z-index:1;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.slideshow__item.current{pointer-events:auto;z-index:100;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slideshow__item.in--next{-webkit-animation:inNext .5s forwards ease-in-out;animation:inNext .5s forwards ease-in-out}.slideshow__item.out--next{-webkit-animation:outNext .5s forwards ease-in-out;animation:outNext .5s forwards ease-in-out}.slideshow__item.in--prev{-webkit-animation:inPrev .5s forwards ease-in-out;animation:inPrev .5s forwards ease-in-out}.slideshow__item.out--prev{-webkit-animation:outPrev .5s forwards ease-in-out;animation:outPrev .5s forwards ease-in-out}@-webkit-keyframes inPrev{0%{-webkit-transform:translate3d(-30%,0,0);transform:translate3d(-30%,0,0)}100%{-webkit-transform:none;transform:none}}@keyframes inPrev{0%{-webkit-transform:translate3d(-30%,0,0);transform:translate3d(-30%,0,0)}100%{-webkit-transform:none;transform:none}}@-webkit-keyframes inNext{0%{-webkit-transform:translate3d(30%,0,0);transform:translate3d(30%,0,0)}100%{-webkit-transform:none;transform:none}}@keyframes inNext{0%{-webkit-transform:translate3d(30%,0,0);transform:translate3d(30%,0,0)}100%{-webkit-transform:none;transform:none}}@-webkit-keyframes outPrev{100%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes outPrev{100%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@-webkit-keyframes outNext{100%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes outNext{100%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}