.smooth{transition:all .5s ease-in-out}.smooth-slow{transition:all 2s ease-in-out}#add-body{width:80px;height:80px;border-radius:200px;position:fixed;top:0px;left:0px;bottom:0px;right:0px;margin:auto;display:flex;justify-content:center;align-items:center;cursor:pointer;background-color:red;color:#fff;font-size:30px;border:10px inset pink;transition:all .5s ease}#add-body:hover{background-color:pink;border:10px inset red}#add-body:focus{outline:none;box-shadow:none}#add-body:active{outline:0;transform:scale(0.9)}#add-body span{pointer-events:none}*{box-sizing:border-box;font-family:"Courier",monospace;font-weight:200;text-transform:uppercase;letter-spacing:1px}html{min-height:100vh}body{overflow:hidden;height:100vh;width:100vw;margin:0;padding:0;background:gray;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAydpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDcuMS1jMDAwIDc5LmIwZjhiZTkwLCAyMDIxLzEyLzE1LTIxOjI1OjE1ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjMuMiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0REJCNkNGREZDNTIxMUVEQjIyOUVFM0RGRDJCMEQ2MyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo0REJCNkNGRUZDNTIxMUVEQjIyOUVFM0RGRDJCMEQ2MyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjREQkI2Q0ZCRkM1MjExRURCMjI5RUUzREZEMkIwRDYzIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjREQkI2Q0ZDRkM1MjExRURCMjI5RUUzREZEMkIwRDYzIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+BYPvJwAAAAZQTFRF////AAAAVcLTfgAAABxJREFUeNpiYAQCBiCA0QxkCJCpDUVgkLgDIMAARRAAgcd5jDoAAAAASUVORK5CYII=)}body *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;outline:0}