html{font-size:14px}
@media screen and (min-width:320px){
html{font-size:calc(14px + 2 * ((100vw - 320px)/ 880))}
}
@media screen and (min-width:1200px){
html{font-size:16px}
}
.ui-heading{font-size:18px}
@media screen and (min-width:320px){
.ui-heading{font-size:calc(18px + 42 * ((100vw - 320px)/ 880))}
}
@media screen and (min-width:1200px){
.ui-heading{font-size:60px}
}
.ui-paragraph{font-size:18px}
@media screen and (min-width:320px){
.ui-paragraph{font-size:calc(18px + 4 * ((100vw - 320px)/ 880))}
}
@media screen and (min-width:1200px){
.ui-paragraph{font-size:22px}
}
nav#nav-supplemental{position:absolute;top:0;width:100%}
@media only screen and (min-width:40em){
#nav-main{position:absolute;width:100%;top:30px}
}
footer{display:none;position:absolute;bottom:0;width:100%}
nav#nav-footer-main{bottom:50px}
footer #nav-footer-supplemental{margin:10px 40px;position:absolute;width:100%;bottom:0;margin:0;padding:10px 40px}
body{font-family:'Source Sans Pro',sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:antialiased}
.plain-list{list-style-type:none;margin-left:0}
img{width:100%}
#app{height:100%;width:100%;background:url(/images/trends-2019/2019-d3c053b6e7.png) no-repeat;background-size:25%;background-position:23% 0;margin-top:100px}
.ui-big-images{position:absolute;height:100%;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex}
.ui-big-image{width:100%;margin-right:-100%;position:relative}
.ui-big-image.w1 .c1-1{background-color:#384c1d}
.ui-big-image.w1 .c1-2{background-color:#f8f5ef}
.ui-big-image.w1 .c1-3{background-color:#5a636d}
.ui-big-image.w1 .c1-4{background-color:#064763}
.ui-big-image.w1 .c1-5{background-color:#063b4f}
.ui-big-image.w2 .c1-1{background-color:#97462b}
.ui-big-image.w2 .c1-2{background-color:#2b1509}
.ui-big-image.w2 .c1-3{background-color:#e7e5e6}
.ui-big-image.w2 .c1-4{background-color:#433f1d}
.ui-big-image.w2 .c1-5{background-color:#7b6232}
.ui-big-image.w3 .c1-1{background-color:#76532c}
.ui-big-image.w3 .c1-2{background-color:#e6b5aa}
.ui-big-image.w3 .c1-3{background-color:#a8874e}
.ui-big-image.w3 .c1-4{background-color:#dcdfdd}
.ui-big-image.w3 .c1-5{background-color:#262829}
.ui-big-image.w4 .c1-1{background-color:#ecccc1}
.ui-big-image.w4 .c1-2{background-color:#cbd8d7}
.ui-big-image.w4 .c1-3{background-color:#e3dbc2}
.ui-big-image.w4 .c1-4{background-color:#685e4f}
.ui-big-image.w4 .c1-5{background-color:#689089}
.ui-big-image.w5 .c1-1{background-color:#f0edd9}
.ui-big-image.w5 .c1-2{background-color:#b41f26}
.ui-big-image.w5 .c1-3{background-color:#1c5798}
.ui-big-image.w5 .c1-4{background-color:#4b4f54}
.ui-big-image.w5 .c1-5{background-color:#d94320}
.ui-big-image p{font-size:120px;font-weight:700;color:#fff;opacity:.4;line-height:.7;margin:0;position:absolute;z-index:9;bottom:0;left:0}
@media only screen and (max-width:40em){
.ui-big-image p{bottom:auto;top:0}
}
.ui-big-image>img{-o-object-fit:cover;object-fit:cover;-o-object-position:center 20%;object-position:center 20%;width:100%;display:block;opacity:.2}
@media (max-height:600px){
.ui-big-image>img{-o-object-position:center center;object-position:center center}
}
.ui-big-image .slider-wrapper{position:absolute;top:10%;right:6vw;width:30%;max-width:400px}
.ui-big-image .slider-wrapper img{-o-object-fit:cover;object-fit:cover}
.ui-big-image .nav-thumbs{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;height:85px;width:80%;right:-1vw;position:absolute;-webkit-transform:translateY(-50%);transform:translateY(-50%);bottom:-12.5%}
.ui-big-image .nav-thumbs .nav-thumb{width:85px!important;height:85px!important}
.ui-big-image .nav-thumbs .nav-thumb+.nav-thumb{margin-left:10px!important}
.ui-big-image .nav-thumbs .slick-track{width:calc(100% + 30px)!important;top:10px;left:-70px}
@media (max-width:768px){
.ui-big-image .nav-thumbs .slick-track{width:calc(100% + 100px)!important;top:40px;left:-70px}
}
@media (max-width:1024px){
.ui-big-image .nav-thumbs .slick-track{width:calc(100% + 100px)!important;top:30px;left:-55px}
}
.ui-big-image .smallimage-image{-webkit-box-shadow:1px 2px 0 #fff;box-shadow:1px 2px 0 #fff}
.ui-big-image .chips{position:absolute;display:-webkit-box;display:-ms-flexbox;display:flex;top:10vh;right:3.7vw;list-style:none;padding:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}
.ui-big-image .chips>*{width:5vw;height:5vw;max-width:80px;max-height:80px;margin-bottom:10px;background:#000;border:1px solid #fff;-webkit-box-shadow:8px 13px 50px rgba(0,15,46,.4);box-shadow:8px 13px 50px rgba(0,15,46,.4)}
.ui-big-image[data-active]~.chips{-webkit-transform:translateX(100%);transform:translateX(100%)}
.chips li{-webkit-transform:translateY(-100vh);transform:translateY(-100vh);-webkit-transition-duration:1s;transition-duration:1s;-webkit-transition-timing-function:cubic-bezier(0,.5,.5,1);transition-timing-function:cubic-bezier(0,.5,.5,1)}
[data-active] .chips li{-webkit-transform:translateY(0);transform:translateY(0)}
[data-active] .chips li:nth-of-type(1){-webkit-transition-delay:420ms;transition-delay:420ms}
[data-active] .chips li:nth-of-type(2){-webkit-transition-delay:520ms;transition-delay:520ms}
[data-active] .chips li:nth-of-type(3){-webkit-transition-delay:620ms;transition-delay:620ms}
[data-active] .chips li:nth-of-type(4){-webkit-transition-delay:720ms;transition-delay:720ms}
[data-active] .chips li:nth-of-type(5){-webkit-transition-delay:820ms;transition-delay:820ms}
.ui-article>*{-webkit-transition:all .3s;transition:all .3s;-webkit-transform:translateY(-30px);transform:translateY(-30px);opacity:0}
[data-active].ui-article>*{-webkit-transition:all 1s;transition:all 1s;-webkit-transform:translateY(0);transform:translateY(0);opacity:1}
[data-active].ui-article>:nth-child(1){-webkit-transition-delay:.5s;transition-delay:.5s}
[data-active].ui-article>:nth-child(2){-webkit-transition-delay:.6s;transition-delay:.6s}
[data-active].ui-article>:nth-child(3){-webkit-transition-delay:.7s;transition-delay:.7s}
[data-active].ui-article>:nth-child(4){-webkit-transition-delay:.8s;transition-delay:.8s}
[data-active].ui-article>:nth-child(5){-webkit-transition-delay:.9s;transition-delay:.9s}
.ui-thumbnails{position:absolute;width:7%;top:50vh;-webkit-transform:translateY(-50%);transform:translateY(-50%);left:3.5%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0;line-height:0;z-index:100}
.ui-thumbnail{display:block;padding:0;cursor:pointer;margin-bottom:10px;border:1px solid #777;border-radius:50px;width:85px;height:85px;overflow:hidden}
.ui-thumbnail>img{height:auto;width:100%;-o-object-fit:cover;object-fit:cover}
.ui-thumbnail>img:hover{-webkit-transform:scale(1.1);transform:scale(1.1);-webkit-filter:none;filter:none}
.thumb-active{border-color:#d3e16b;position:absolute;top:0;left:0;width:100%;height:100%;border:4px solid #d3e16b;border-radius:50px}
.ui-content{position:absolute;width:48%;left:14%;top:10%;overflow-x:hidden;overflow-y:hidden}
@media (max-width:640px){
.ui-content{width:28%}
}
.ui-articles{color:#0a1e30;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;margin-bottom:2rem}
.ui-article{width:100%;margin-right:-100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:top;-ms-flex-pack:top;justify-content:top}
.ui-paragraph{margin:0 0 1em;line-height:1.7}
.mobile-title{display:none}
@media only screen and (max-width:40em){
.mobile-title{display:block;margin-top:66px;text-align:center;background:#333;padding:17px 20px}
.mobile-title h1{font-size:21px;margin:0;color:#fff}
}
.ui-nav{height:auto;z-index:3;overflow:visible;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;top:66px}
@media only screen and (min-width:40em){
.ui-nav{position:absolute;left:7%;top:168px;width:auto;z-index:9;-webkit-transform:translateX(-50%);transform:translateX(-50%)}
}
.ui-nav button{background:#fff;border:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:.5em;width:2em;color:#333;font-weight:700;font-family:monospace;-webkit-transition:inherit;transition:inherit;-webkit-transition-duration:.3s;transition-duration:.3s}
@media only screen and (max-width:40em){
.ui-nav button{justify-self:flex-end;height:100%;padding:1.1em;width:4em}
}
.ui-nav button:focus,.ui-nav button:hover{background:#d3e16b;outline:0;cursor:pointer}
.ui-nav button:active{outline:0;-webkit-transform:translateY(.25em);transform:translateY(.25em);-webkit-transition-duration:.1s;transition-duration:.1s}
.ui-heading{line-height:1;margin:0 0 .5rem;font-family:'Source Sans Pro',sans-serif;font-weight:300}
@media only screen and (max-width:40em){
.ui-heading{font-weight:700;margin-bottom:1rem}
}
.ui-heading:before{content:'FrogTape Design Trend:';font-size:.4em;text-transform:uppercase;display:block;margin-bottom:.5rem;letter-spacing:3px}
@media only screen and (max-width:40em){
.ui-heading:before{font-size:.7em;margin-top:2em}
}
.ui-attribute{margin:0;line-height:1.7;list-style-type:none}
.ui-attribute p{margin:1rem 0 0}
.ui-attribute strong{color:#333}
.ui-big-image{opacity:0;-webkit-transform:translateX(-100%);transform:translateX(-100%);will-change:transform}
.ui-big-image>img{-webkit-transform:scale(.85);transform:scale(.85)}
.ui-big-image[data-active]~.ui-big-image{-webkit-transform:translateX(100%);transform:translateX(100%)}
.ui-big-image[data-active]{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}
.ui-big-image[data-active] img{-webkit-transform:scale(1);transform:scale(1)}
.nav-thumb{-webkit-transform:translateX(100vw);transform:translateX(100vw);cursor:pointer;-webkit-transition-duration:1s;transition-duration:1s;-webkit-transition-timing-function:cubic-bezier(0,.5,.5,1);transition-timing-function:cubic-bezier(0,.5,.5,1);width:100%;height:auto}
[data-active] .nav-thumb{-webkit-transform:translateX(0);transform:translateX(0)}
[data-active] .nav-thumb:nth-of-type(1){-webkit-transition-delay:420ms;transition-delay:420ms}
[data-active] .nav-thumb:nth-of-type(2){-webkit-transition-delay:520ms;transition-delay:520ms}
[data-active] .nav-thumb:nth-of-type(3){-webkit-transition-delay:620ms;transition-delay:620ms}
[data-active] .nav-thumb:nth-of-type(4){-webkit-transition-delay:720ms;transition-delay:720ms}
[data-active] .nav-thumb:nth-of-type(5){-webkit-transition-delay:820ms;transition-delay:820ms}
.ui-article{-webkit-transform:translateX(-100%);transform:translateX(-100%)}
.ui-article[data-active]~.ui-article{-webkit-transform:translateX(100%);transform:translateX(100%)}
.ui-article[data-active]{-webkit-transform:translateX(0);transform:translateX(0)}
.ui-article[data-active]:before{opacity:0}
body{counter-reset:section;font-size:16px}
.ui-thumbnail-wrap{counter-increment:section}
.ui-thumbnail-wrap:after{display:block;content:counter(section);font-size:25px;position:absolute;top:43%;left:0;line-height:1;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);background:#fff;width:30px;height:30px;border-radius:50px;color:#b6bfc9;font-weight:700;padding:2px 10px 0 8px;pointer-events:none}
.ui-thumbnail-wrap .thumb-active:after{background-color:orange}
.ui-attribute{position:relative}
.ui-attribute p{padding-left:34px}
.ui-attribute .icon{display:block;margin-top:1.5rem;content:'';height:90px;width:24px;position:absolute}
.ui-attribute .icon svg{width:100%}
.ui-attribute .icon.palette{margin-top:0}
.ui-thumbnail{position:relative}
.ui-thumbnail>img{-webkit-filter:grayscale(100%);filter:grayscale(100%);-webkit-transition-duration:.35s;transition-duration:.35s}
.ui-thumbnail:active>img{-webkit-transform:scale(.9);transform:scale(.9);-webkit-transition-duration:.1s;transition-duration:.1s}
.ui-thumbnail:focus{outline:0}
.thumb-active{display:none}
[data-active].ui-thumbnail:before{position:absolute;content:'';display:block;-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-animation:pulsate 1.5s cubic-bezier(.5,0,1,.5);animation:pulsate 1.5s cubic-bezier(.5,0,1,.5);-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;opacity:0;background-color:rgba(255,255,255,.3);border-radius:50px;height:85px;width:85px;z-index:999}
[data-active].ui-thumbnail:hover>img,[data-active].ui-thumbnail[data-active]>img{-webkit-filter:grayscale(0);filter:grayscale(0);opacity:1}
[data-active].ui-thumbnail[data-active] .thumb-active{display:block}
.design-trend-title{font-size:32px;line-height:1;font-weight:100;color:rgba(255,255,255,.25);-webkit-transform-origin:0 0;transform-origin:0 0;position:absolute;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);margin:25vh 30px 30px 3vw}
.pipe{position:fixed;left:7%;top:0;height:100vh;width:1px;background-color:#777}
body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#e2e5e9}
*,:after,:before{-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;-webkit-transition-duration:.7s,.7s,.7s;transition-duration:.7s,.7s,.7s;-webkit-transition-timing-function:cubic-bezier(.5,0,.5,1);transition-timing-function:cubic-bezier(.5,0,.5,1)}
body,html{height:100%;width:100%;padding:0;margin:0;overflow-y:auto;overflow-x:hidden;max-width:100%}
@-webkit-keyframes in{
0%{opacity:0;-webkit-transform:translateY(250%);transform:translateY(250%)}
100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
}
@keyframes in{
0%{opacity:0;-webkit-transform:translateY(250%);transform:translateY(250%)}
100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
}
@-webkit-keyframes out{
0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
100%{opacity:0;-webkit-transform:translateY(-200%);transform:translateY(-200%)}
}
@keyframes out{
0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
100%{opacity:0;-webkit-transform:translateY(-200%);transform:translateY(-200%)}
}
@-webkit-keyframes pulsate{
0%{-webkit-transform:scale(.1,.1);transform:scale(.1,.1);opacity:0}
50%{opacity:1}
90%{opacity:0}
100%{-webkit-transform:scale(1.2,1.2);transform:scale(1.2,1.2);opacity:0}
}
@keyframes pulsate{
0%{-webkit-transform:scale(.1,.1);transform:scale(.1,.1);opacity:0}
50%{opacity:1}
90%{opacity:0}
100%{-webkit-transform:scale(1.2,1.2);transform:scale(1.2,1.2);opacity:0}
}
.slider-nav-thumbnails .slick-slide{opacity:1;-webkit-transition:all .25s;transition:all .25s;border-radius:100px;-webkit-box-shadow:4px 4px 20px rgba(0,0,0,.5);box-shadow:4px 4px 20px rgba(0,0,0,.5);overflow:hidden;border:2px solid #fff}
.slider-nav-thumbnails .slick-slide.slick-active{opacity:1;border:2px solid #7fb24d}
.slick-list{overflow:visible}
@media (max-width:40em){
#app{background:0 0;max-width:90%;margin:auto;position:relative}
#app .ui-thumbnails{display:none}
#app .ui-big-images{position:relative;top:10px;overflow:visible;padding-bottom:10%}
#app .ui-big-image .chips{right:3.7vw;top:30px}
#app .ui-big-image .chips>*{width:12vw;height:12vw}
#app .slider-wrapper{position:absolute;top:10%;width:100%;right:auto}
#app .ui-content{width:auto;max-width:100%;padding:20px;top:0;left:0;position:relative}
#app .smallimage-image{-webkit-box-shadow:none;box-shadow:none}
#app .pipe{display:none}
#app .ui-big-image .nav-thumbs .slick-track{width:unset;top:unset;left:unset;height:unset}
#app .ui-big-image .nav-thumbs{width:100vw;-webkit-transform:translateY(-10%);transform:translateY(-10%)}
#app .ui-big-image .nav-thumbs .nav-thumb{width:65px!important;height:65px!important}
}
header.main-header{position:fixed;top:0;left:0;height:50px;background:#7fb24d;width:100%;z-index:10}
@media only screen and (max-width:40em){
header.main-header{display:-webkit-box;display:-ms-flexbox;display:flex}
}
header.main-header img{height:60px;width:auto;left:20%}
.trends2019 .trends-social-nav{position:absolute;top:20px;left:64%;z-index:2}
@media only screen and (max-width:40em){
.trends2019 .trends-social-nav{position:absolute;top:20px;left:auto;right:0;z-index:9999}
}
.trends2019 .trends-social-nav span{display:none}
.trends2019 .trends-social-nav img{width:auto;height:30px}
.trends2019 .pin-button{opacity:1}