.add-text-page{background-color:#000;width:100%;height:calc(var(--vh, 1vh)*100);min-height:500px;display:flex;flex-direction:column;align-items:center;position:relative}#add-text-page .header-component{z-index:15}.add-text-page__container{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:0;position:relative}#add-text-page .player-component{position:absolute;opacity:1}@font-face{font-family:Roboto-Light;src:url(../fonts/Roboto-Light.88823c20.ttf) format("truetype")}.add-text-page__input{position:absolute;width:100%;padding-left:6px;padding-right:6px;bottom:8px;min-height:40px;display:flex;align-items:center;transition:all .15s linear}.add-text-page__input input{width:100%;display:flex;border-radius:20px;border:.5px solid hsla(0,0%,100%,.5);background-color:#000;color:#fff;padding-left:22px;padding-right:50px;font-family:Roboto-Light;height:40px;resize:none;overflow:hidden;white-space:nowrap;outline:none}.add-text-page__input textarea:focus{outline:none}.add-text-page__input textarea::-moz-placeholder{color:#fff;opacity:.4;font-family:Roboto-Light}.add-text-page__input textarea:-ms-input-placeholder{color:#fff;opacity:.4;font-family:Roboto-Light}.add-text-page__input textarea::placeholder{color:#fff;opacity:.4;font-family:Roboto-Light}.add-text-page__input-counter{color:#c4c4c4;font-size:13px;line-height:20px;font-family:Roboto-Light;position:absolute;top:-20px;right:13px}.add-text-page__input-colors{position:absolute;bottom:3px;right:15px;cursor:pointer}.add-text-page__input-margin{margin-bottom:40px}.select-colors-enter-active{-webkit-animation:select-colors .15s linear;animation:select-colors .15s linear}.select-colors-leave-active{animation:select-colors .15s linear reverse}@-webkit-keyframes select-colors{0%{top:90px;opacity:0}to{opacity:1}}@keyframes select-colors{0%{top:90px;opacity:0}to{opacity:1}}.add-text-page__select-colors{display:flex;background:#1b1c2d;align-items:center;position:absolute;left:0;width:100%;overflow:hidden;transition:all .15s linear;padding-left:16px;padding-right:16px;height:32px}.add-text-page__select-color{width:26px;height:26px;border-radius:100%;overflow:hidden;margin-right:5px;margin-left:5px;cursor:pointer}.add-text-page__select-color-bgc{width:100%;height:100%}.add-text-page__select-colors-button{position:absolute;right:10px;width:32px;height:32px;display:flex;justify-content:center;align-items:center;cursor:pointer}.footer-out-enter-active{-webkit-animation:footer-fade .2s linear;animation:footer-fade .2s linear}.footer-out-leave-active{animation:footer-fade .2s linear reverse}@-webkit-keyframes footer-fade{0%{opacity:0;height:0}to{opacity:1;height:208px}}@keyframes footer-fade{0%{opacity:0;height:0}to{opacity:1;height:208px}}.add-text-page__footer{opacity:1;width:100%;background-color:#2f1f4c;height:208px;flex-grow:1;display:flex;align-items:flex-end;padding-bottom:16px;z-index:5}@font-face{font-family:Montserrat-Medium;src:url(../fonts/Montserrat-Medium.c8b6e083.ttf) format("truetype")}.add-text-page__footer-button{font-family:Montserrat-Medium;margin-left:16px;margin-right:16px;height:44px;width:100%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;line-height:12px;opacity:.5;background:hsla(0,0%,100%,.2);border-radius:5px}.add-text-page__alert-wrapper{display:flex;flex-direction:column;align-items:center}.add-text-page__alert{text-align:center;font-size:15px;color:#fff;font-family:Roboto-Light}.add-text-page__alert-button{font-family:Roboto-Light;font-size:15px;color:#fff;margin-top:10px;border-bottom:1px dashed #fff;cursor:pointer;text-decoration:none}.add-text-page__footer-button-active{background:#fff;opacity:1;color:#31283d;cursor:pointer}