.modal{will-change:visibility,opacity;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;position:fixed;top:0;left:0;right:0;bottom:0;overflow-y:auto;overflow-x:hidden;z-index:1000;visibility:hidden;opacity:0;-webkit-transition:all .5s cubic-bezier(.23,1,.32,1);transition:all .5s cubic-bezier(.23,1,.32,1);-webkit-transition-delay:$modal-delay;transition-delay:$modal-delay}.modal--active{visibility:visible;opacity:1}.modal--align-top{-webkit-box-align:start;align-items:flex-start}.modal__bg{background:0 0}.modal__dialog{max-width:600px;padding:1.2rem}.modal__content{will-change:transform,opacity;position:relative;padding:2.4rem;background: #ffffff;background-clip:padding-box;box-shadow:0 12px 15px 0 rgba(0,0,0,.25);opacity:0;-webkit-transition:all .25s cubic-bezier(.23,1,.32,1);transition:all .25s cubic-bezier(.23,1,.32,1);}.modal__content--active{opacity:1}.modal__close{z-index:1100;cursor:pointer}.modal__trigger{position:relative;display:inline-block;padding:1.2rem 2.4rem;color:rgba(0,0,0,.7);line-height:1;cursor:pointer;background:#ffebee;box-shadow:0 2px 5px 0 rgba(0,0,0,.26);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transition:all .5s cubic-bezier(.23,1,.32,1);transition:all .5s cubic-bezier(.23,1,.32,1)}.modal__trigger--active{z-index:10}.modal__trigger:hover{background:#e5d3d6}#modal__temp{will-change:transform,opacity;position:absolute;top:0;left:0;right:0;bottom:0;background:#ffebee;-webkit-transform:none;transform:none;opacity:1;-webkit-transition:opacity .1s ease-out,-webkit-transform .5s cubic-bezier(.23,1,.32,1);transition:opacity .1s ease-out,-webkit-transform .5s cubic-bezier(.23,1,.32,1);transition:opacity .1s ease-out,transform .5s cubic-bezier(.23,1,.32,1);transition:opacity .1s ease-out,transform .5s cubic-bezier(.23,1,.32,1),-webkit-transform .5s cubic-bezier(.23,1,.32,1)}.demo-btns header{padding:7vh 10vw;background:#ffebee;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center}.demo-btns header h1{margin:0;color:rgba(0,0,0,.54);font-weight:300}.demo-btns .info{background:#f44336;padding:3vh 10vw;height:70vh;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-flow:column wrap}.demo-btns p{text-align:center;color:#fff}.demo-btns .link{font-size:20px}.demo-btns .modal__trigger{margin-right:3px}@media(max-width:640px){.demo-btns .modal__trigger{margin-bottom:.8rem}}.demo-close{position:absolute;top:0;right:0;margin:1.2rem;padding: 0.5rem;background:rgba(0,0,0,.3);border-radius:50%;-webkit-transition:all .5s cubic-bezier(.23,1,.32,1);transition:all .5s cubic-bezier(.23,1,.32,1);}.demo-close svg{width:24px;fill:#fff;pointer-events:none;vertical-align:top;margin-top: 2px;}.demo-close:hover{background:rgba(0,0,0,.6)}.logo{position:fixed;bottom:3vh;right:3vw;z-index:2}.logo img{width:45px;-webkit-transform:rotate(0);transform:rotate(0);-webkit-transition:all .5s cubic-bezier(.23,1,.32,1);transition:all .5s cubic-bezier(.23,1,.32,1)}.logo img:hover{-webkit-transform:rotate(180deg) scale(1.1);transform:rotate(180deg) scale(1.1)}