.strips{text-align:center;color:#fff;min-height:100vh;overflow:hidden}.strips__strip{will-change:width,left,z-index,height;cursor:pointer;width:20%;min-height:100vh;transition:all .6s cubic-bezier(.23,1,.32,1);position:absolute;overflow:hidden}.strips__strip:first-child{left:0}.strips__strip:nth-child(2){left:20vw}.strips__strip:nth-child(3){left:40vw}.strips__strip:nth-child(4){left:60vw}.strips__strip:nth-child(5){left:80vw}.strips__strip:first-child .strip__content{background:#a6b32a;-webkit-animation-name:strip1;animation-name:strip1;-webkit-animation-delay:.1s;animation-delay:.1s;-webkit-transform:translate(-100%);transform:translate(-100%)}.strips__strip:nth-child(2) .strip__content{background:#529b24;-webkit-animation-name:strip2;animation-name:strip2;-webkit-animation-delay:.2s;animation-delay:.2s;-webkit-transform:translateY(100%);transform:translateY(100%)}.strips__strip:nth-child(3) .strip__content{background:#009688;-webkit-animation-name:strip3;animation-name:strip3;-webkit-animation-delay:.3s;animation-delay:.3s;-webkit-transform:translateY(-100%);transform:translateY(-100%)}.strips__strip:nth-child(4) .strip__content{background:#9c27b0;-webkit-animation-name:strip4;animation-name:strip4;-webkit-animation-delay:.4s;animation-delay:.4s;-webkit-transform:translateY(100%);transform:translateY(100%)}.strips__strip:nth-child(5) .strip__content{background:#e91e63;-webkit-animation-name:strip5;animation-name:strip5;-webkit-animation-delay:.5s;animation-delay:.5s;-webkit-transform:translate(100%);transform:translate(100%)}@media screen and (width<=760px){.strips__strip{min-height:20vh}.strips__strip:first-child{width:100%;top:0;left:0}.strips__strip:nth-child(2){width:100%;top:20vh;left:0}.strips__strip:nth-child(3){width:100%;top:40vh;left:0}.strips__strip:nth-child(4){width:100%;top:60vh;left:0}.strips__strip:nth-child(5){width:100%;top:80vh;left:0}}.strips .strip__content{justify-content:center;align-items:center;width:100%;height:100%;text-decoration:none;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:cubic-bezier(.23,1,.32,1);animation-timing-function:cubic-bezier(.23,1,.32,1);-webkit-animation-fill-mode:both;animation-fill-mode:both;display:flex;position:absolute;top:0;left:0}.strips .strip__content:hover:before{opacity:.1;-webkit-transform:skew(-30deg)scale(3)translate(0);transform:skew(-30deg)scale(3)translate(0)}.strips .strip__content:before{content:"";z-index:1;opacity:.05;-webkit-transform-origin:50%;transform-origin:50%;background:#fff;width:100%;height:100%;transition:all .6s cubic-bezier(.23,1,.32,1);position:absolute;top:0;left:0;-webkit-transform:skew(-30deg)scaleY(1)translate(0);transform:skew(-30deg)scaleY(1)translate(0)}.strips .strip__inner-text{will-change:transform,opacity;z-index:5;opacity:0;width:70%;transition:all .6s cubic-bezier(.23,1,.32,1);position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%)scale(.5);transform:translate(-50%,-50%)scale(.5)}.strips__strip--expanded{z-index:3;cursor:default;width:100%;top:0!important;left:0!important}@media screen and (width<=760px){.strips__strip--expanded{min-height:100vh}}.strips__strip--expanded .strip__content:hover:before{opacity:.05;-webkit-transform:skew(-30deg)scale(1)translate(0);transform:skew(-30deg)scale(1)translate(0)}.strips__strip--expanded .strip__title{opacity:0}.strips__strip--expanded .strip__inner-text{opacity:1;-webkit-transform:translate(-50%,-50%)scale(1);transform:translate(-50%,-50%)scale(1)}.strip__title{z-index:2;color:#fff;width:100%;margin:0;font-size:2vw;transition:all .6s cubic-bezier(.23,1,.32,1);display:block;position:relative}@media screen and (width<=760px){.strip__title{font-size:28px}}.strip__close{opacity:0;z-index:10;cursor:pointer;color:#fff;font-size:30px;transition:all .6s cubic-bezier(.23,1,.32,1) .5s;position:absolute;top:3vw;right:3vw}.strip__close--show{opacity:1}@-webkit-keyframes strip1{0%{-webkit-transform:translate(-100%);transform:translate(-100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes strip1{0%{-webkit-transform:translate(-100%);transform:translate(-100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}@-webkit-keyframes strip2{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes strip2{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}@-webkit-keyframes strip3{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes strip3{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}@-webkit-keyframes strip4{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes strip4{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}@-webkit-keyframes strip5{0%{-webkit-transform:translate(100%);transform:translate(100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}@keyframes strip5{0%{-webkit-transform:translate(100%);transform:translate(100%)}to{-webkit-transform:translate(0,0);transform:translate(0,0)}}