.header-wrapper div{display:flex;align-items:center;justify-content:space-evenly}.header-wrapper .header-tools-wrapper{display:flex;align-items:center;justify-content:space-between;background-color:#fff;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;padding:15px;height:75px}.header-wrapper .header-tools-wrapper span{margin-bottom:5px;font-weight:700}.header-wrapper .header-tools-wrapper .header-tools input{border:1px solid #ccc;border-radius:5px;height:37px;background-color:#eee}.header-wrapper .header-tools-wrapper .header-tools .header-choose-category{margin:0 5px}.header-wrapper .header-tools-wrapper .header-tools .header-choose-category button{margin:0 10px}.header-wrapper .header-tools-wrapper .header-icons img{margin:5px;cursor:pointer;transition:width .2s ease,height .2s ease;-webkit-transition:width .2s ease,height .2s ease;-moz-transition:width .2s ease,height .2s ease;-ms-transition:width .2s ease,height .2s ease;-o-transition:width .2s ease,height .2s ease}.header-wrapper .header-tools-wrapper .header-icons img.active{height:35px;width:35px}.header-wrapper .add-category-dialog{padding:10px;-webkit-box-shadow:10px 10px 5px -7px #8a8a8a;-moz-box-shadow:10px 10px 5px -7px #8a8a8a;box-shadow:10px 10px 5px -7px #8a8a8a;min-width:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:999}.header-wrapper .add-category-dialog .closeAddCategory{position:absolute;top:10px;right:10px;cursor:pointer}.header-wrapper .add-category-dialog input{margin:10px;height:35px;width:70%}.header-wrapper .add-category-dialog input[type=text]{border:1px solid #ccc;background:#ccc;padding:0 5px}.header-wrapper .add-category-dialog input[type=text],.main-wrapper{border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px}.main-wrapper{background-color:#fff;padding:15px;margin-top:15px;display:flex;flex-direction:column}.main-wrapper .main-wrapper-header{display:grid;align-items:center;grid-template-columns:2fr 1fr;margin:10px 0}.main-wrapper .main-wrapper-header div{display:flex;align-items:center;justify-content:flex-end}.main-wrapper .main-wrapper-header div.main-wrapper-header-buttons{justify-content:flex-start}.main-wrapper .main-wrapper-header div.main-wrapper-header-buttons button{display:flex;align-items:center;min-width:100px;margin:0 10px}.card-wrapper{display:grid;grid-template-columns:2fr 1fr 2fr;gap:10%;overflow:hidden;padding-bottom:100px;position:relative}.card-wrapper .add-frame-wrapper{display:flex;align-items:center;justify-content:center;margin-top:15px;position:absolute;bottom:10px;width:100%}.card-wrapper .add-frame-wrapper button{padding:10px 50px}.card-wrapper #legendDialog{padding:50px 10px;z-index:999}.card-wrapper .card-preview,.card-wrapper .card-touch{height:100%;width:100%;position:relative;user-select:none}.card-wrapper .card-preview img,.card-wrapper .card-touch img{height:100%;width:100%;user-select:none}.card-wrapper .card-preview img.legend,.card-wrapper .card-touch img.legend{height:100px;z-index:1}.card-wrapper .card-preview input,.card-wrapper .card-touch input{max-width:150px;background-color:transparent;border:none;font-size:18px;z-index:2}.card-wrapper .card-preview input:focus,.card-wrapper .card-touch input:focus{outline:none}.card-wrapper .card-preview textarea,.card-wrapper .card-touch textarea{min-width:150px;background-color:transparent;border:1px solid #555;font-size:18px;width:80%;display:flex;align-items:center;justify-content:center;resize:both;height:40px;padding-top:10px;box-sizing:border-box;z-index:2}.card-wrapper .card-preview textarea:focus,.card-wrapper .card-touch textarea:focus{outline:none}.card-wrapper dialog{min-width:300px;-webkit-box-shadow:10px 10px 5px -7px #8a8a8a;-moz-box-shadow:10px 10px 5px -7px #8a8a8a;box-shadow:10px 10px 5px -7px #8a8a8a}.card-wrapper dialog .dialog-header{display:flex;align-items:center;justify-content:space-between}.card-wrapper dialog .dialog-header svg{cursor:pointer}.card-wrapper dialog .dialog-info{flex-direction:column}.card-wrapper dialog .dialog-info div{display:flex;align-items:center;justify-content:space-between;width:100%}.card-wrapper dialog .dialog-info div span{font-size:16px;font-weight:700;margin-right:5px}.card-wrapper dialog .dialog-info div input[type=number],.card-wrapper dialog .dialog-info div input[type=text]{width:60px;border:1px solid #ccc;background:#ccc;padding:0 5px;margin:0 5px;border-radius:15px;-webkit-border-radius:15px;-moz-border-radius:15px;-ms-border-radius:15px;-o-border-radius:15px}.card-wrapper .card-preview .PT-container{position:relative;display:flex;align-items:center;justify-content:center}.card-wrapper .card-preview .PT-container input{width:100%;text-align:center;z-index:2;height:100%;display:flex;align-items:center;justify-content:center}.card-wrapper .card-preview .mana-wrapper{display:flex;align-items:center;justify-content:space-evenly}.card-wrapper .card-settings div{display:flex;align-items:center;margin:10px 0}.card-wrapper .card-settings div button{min-width:100px;width:150px}.card-wrapper .card-settings div button,.touch{display:flex;align-items:center;justify-content:center}.touch{width:60px;height:60px;background-color:#6d8cbb;position:absolute;z-index:99;opacity:.8;transition:opacity .3s;cursor:pointer;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%}.touch:hover{opacity:1}.touch:after{content:"";border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%;background-color:#fff;height:10px;width:10px}.setting-dialog{padding:10px;-webkit-box-shadow:10px 10px 5px -7px #8a8a8a;-moz-box-shadow:10px 10px 5px -7px #8a8a8a;box-shadow:10px 10px 5px -7px #8a8a8a;z-index:999;min-width:350px;position:absolute;top:5%}.setting-dialog .dialog-header{display:flex;align-items:center;justify-content:space-between}.setting-dialog .dialog-header svg{cursor:pointer}.setting-dialog .dialog-info{padding:0;flex-direction:column}.setting-dialog .dialog-info div{display:flex;align-items:center;justify-content:space-between;width:100%}.setting-dialog .dialog-info div span{font-size:16px;font-weight:700;margin-right:5px}.setting-dialog .dialog-info div input[type=number],.setting-dialog .dialog-info div input[type=text]{width:60px;border:1px solid #ccc;background:#ccc;padding:0 5px;margin:0 5px;border-radius:15px;-webkit-border-radius:15px;-moz-border-radius:15px;-ms-border-radius:15px;-o-border-radius:15px}