:root{--bg-color:#f8f8f8;--rubber-color:#ff9dae;--body-color:#d672ff;--end-color:#c77f60}*{margin:0;padding:0}body{background:var(--bg-color);font-family:arial;font-size:12px;line-height:1.4em;text-align:justify}img{max-width:100%;height:auto}.wrapper{padding:100px 0 400px;position:relative;width:850px;margin:0 auto}.pencil{width:200px;margin:0 auto}.rubber particle{background:var(--rubber-color)}.rubber .part-1::after,.rubber .part-3::after{content:'';display:block;width:0;height:0;position:absolute;border:50px solid transparent;border-bottom-width:0;z-index:999;top:-50px}.rubber .part-1::after{left:-50px}.rubber .part-3::after{right:-50px}.rubber .part-1::after{border-right-color:var(--rubber-color)}.rubber .part-3::after{border-left-color:var(--rubber-color)}.rubber .part-2::after{content:'';display:block;width:100%;z-index:999;position:absolute;height:50px;top:-50px}.rubber .part-2::after{background:var(--rubber-color)}.top-element{background:#f8f8f8;padding:5px 5px 3px;border:2px solid #888;line-height:0;position:relative;z-index:999999}.body,.end,.rubber{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;position:relative}.rubber{height:25px}.body{height:1050px;z-index:9999}.end{height:61px}.particle{height:100%;-webkit-box-flex:1;-webkit-flex:1 0 auto;-moz-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;position:relative}.rubber .particle{background:var(--rubber-color)}.body .particle{background:var(--body-color)}.end .particle{background:var(--end-color)}.body .part-1,.end .part-1,.rubber .part-1{-webkit-filter:brightness(1.3);filter:brightness(1.3);max-width:50px}.body .part-2,.end .part-2,.rubber .part-2{-webkit-filter:brightness(1);filter:brightness(1)}.body .part-3,.end .part-3,.rubber .part-3{-webkit-filter:brightness(.7);filter:brightness(.7);max-width:50px}.body .part-1::after,.body .part-3::after,.end .part-1::after,.end .part-3::after{content:'';display:block;width:0;height:0;position:absolute;border:50px solid transparent;border-top-width:0;z-index:999}.body .part-1::after,.body .part-3::after{bottom:-35px;border-bottom-width:35px}.end .part-1::after,.end .part-3::after{bottom:-150px;border-bottom-width:150px}.body .part-1::after,.end .part-1::after{left:-50px}.body .part-3::after,.end .part-3::after{right:-50px}.body .part-1::after{border-right-color:var(--body-color)}.end .part-1:after{border-right-color:var(--end-color)}.body .part-3::after{border-left-color:var(--body-color)}.end .part-3:after{border-left-color:var(--end-color)}.body .part-2::after,.end .part-2::after{content:'';display:block;width:100%;z-index:999;position:absolute}.body .part-2::after{height:35px;bottom:-35px}.end .part-2::after{height:150px;bottom:-150px}.body .part-2::after{background:var(--body-color)}.end .part-2::after{background:var(--end-color)}.tip{width:100px;height:75px;background:-webkit-gradient(linear,right top,left bottom,from(#000),to(#303030));background:-webkit-linear-gradient(right top,#000,#303030);background:-moz-linear-gradient(right top,#000,#303030);background:-o-linear-gradient(right top,#000,#303030);background:linear-gradient(to left bottom,#000,#303030);position:absolute;bottom:-225px;left:50px;-webkit-border-radius:0 0 150px 150px;-moz-border-radius:0 0 150px 150px;border-radius:0 0 150px 150px}.tip::after,.tip::before{content:'';display:block;position:absolute;top:-85px;width:0;height:0;border:80px solid transparent;border-bottom-width:0;border-top-width:160px}.tip::before{border-left-color:var(--bg-color);left:-35px}.tip::after{border-right-color:var(--bg-color);right:-35px}.shadow{background:#000;width:200px;height:5px;position:absolute;left:50%;margin-left:-100px;bottom:51px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;-webkit-box-shadow:0 0 50px 25px #000,0 0 100px 50px #202020,0 0 150px 50px #202020;-moz-box-shadow:0 0 50px 25px #000,0 0 100px 50px #202020,0 0 150px 50px #202020;box-shadow:0 0 50px 25px #000,0 0 100px 50px #202020,0 0 150px 50px #202020}.elements{width:100%;position:absolute;top:100px;left:0;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:start;-webkit-align-items:flex-start;-moz-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center;z-index:99999;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}.el{height:000px;width:000px;margin:5px;border:136px solid transparent;outline:6px solid #f8f8f8}.el-1{border-right-color:rgba(255,0,0,.2);border-bottom-color:rgba(255,0,0,.5);outline:0}.el-2{border-right-color:rgba(255,0,0,.2);border-bottom-color:rgba(255,0,0,.2)}.el-4{border-top-color:rgba(255,59,0,.5);border-right-color:rgba(255,59,0,.3);border-bottom-color:rgba(255,59,0,.2);border-left-color:rgba(255,59,0,.1);outline-width:10px}.el-5{border-left-color:rgba(255,165,0,.45);border-bottom-color:rgba(255,165,0,.55);border-top-color:rgba(255,165,0,.2);border-right-color:rgba(255,165,0,.1)}.el-6{border-right-color:rgba(133,255,0,.15);border-bottom-color:rgba(133,255,0,.15)}.el-8{border-top-color:rgba(133,255,0,.4);border-right-color:rgba(0,255,137,.4);border-bottom-color:rgba(133,255,0,.2);border-left-color:rgba(133,255,0,.1)}.el-9{border-top-color:rgba(0,90,255,.1);border-right-color:rgba(0,90,255,.2);border-bottom-color:rgba(0,90,255,.2);border-left-color:rgba(0,90,255,.6);outline-width:10px}.el-11{border-right-color:rgba(0,90,255,.05);border-bottom-color:rgba(0,90,255,.05)}.el-12{outline:0}.content{-webkit-transform:rotate(-45deg) translate(-10px,-140px);-moz-transform:rotate(-45deg) translate(-10px,-140px);-ms-transform:rotate(-45deg) translate(-10px,-140px);-o-transform:rotate(-45deg) translate(-10px,-140px);transform:rotate(-45deg) translate(-10px,-140px);width:200px;height:170px}.flex-container{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:start;-webkit-align-items:flex-start;-moz-box-align:start;-ms-flex-align:start;align-items:flex-start}.el-11 .flex-container,.el-7 .flex-container{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-webkit-flex-direction:row-reverse;-moz-box-orient:horizontal;-moz-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.letter{font-size:100px;line-height:75px;font-weight:600}.el-2 .letter{color:#eb397f}.el-7 .letter{color:#e8898c}.el-6 .letter{color:#b6aa99}.el-11 .letter{color:#5664ff}.letter p{margin:0}.stars{width:108px;height:73px;background:url(../img/stars.png) left top repeat;-webkit-background-size:18px 18px;-moz-background-size:18px;-o-background-size:18px;background-size:18px}.content h3{text-transform:uppercase;font-size:16px;line-height:1.2;letter-spacing:1.1px;margin:5px 0}.el-4::before{-webkit-transform:rotate(-45deg) translate(90px,-120px);-moz-transform:rotate(-45deg) translate(90px,-120px);-ms-transform:rotate(-45deg) translate(90px,-120px);-o-transform:rotate(-45deg) translate(90px,-120px);transform:rotate(-45deg) translate(90px,-120px)}.el-8::before{-webkit-transform:rotate(-45deg) translate(90px,-105px);-moz-transform:rotate(-45deg) translate(90px,-105px);-ms-transform:rotate(-45deg) translate(90px,-105px);-o-transform:rotate(-45deg) translate(90px,-105px);transform:rotate(-45deg) translate(90px,-105px)}.el-5::before,.el-9::before{-webkit-transform:rotate(-45deg) translate(-40px,-105px);-moz-transform:rotate(-45deg) translate(-40px,-105px);-ms-transform:rotate(-45deg) translate(-40px,-105px);-o-transform:rotate(-45deg) translate(-40px,-105px);transform:rotate(-45deg) translate(-40px,-105px)}.el-4::before,.el-5::before,.el-8::before,.el-9::before{display:block;font-size:170px;line-height:175px;font-weight:600;position:absolute;z-index:-1}.el-4::before{content:'A'}.el-5::before{content:'B'}.el-8::before{content:'C'}.el-9::before{content:'D'}.el-4::after,.el-5::after,.el-8::after,.el-9::after{content:'';display:block;width:390px;height:10px;background:#fff;position:absolute;z-index:1;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg) translate(-135px,-141px)}