@font-face { font-family: Google; src:url(fonts/Google-spies.ttf); } @font-face { font-family: MinionPro; src:url(fonts/MinionPro-Medium.otf); } @font-face { font-family: ImpactNormal; src:url(fonts/Impact.ttf); } a#tab-prev { color: white; background: #b50000; font-size: 1.5em; } a#tab-next { color: white; background: #b50000; font-size: 1.5em; } .sandbox.sheet .window-content { padding: 5px 3px; overflow-y: hidden; background: url(img/bg.png) no-repeat; background-size: cover; } /* Sheet Header */ .sandbox.sheet .sheet-header { overflow: hidden; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; flex: 0 0 100px; margin-bottom: -5px; } .sandbox.sheet.actor { max-width: 784px; min-width: 650px; min-height: 480px; } .sandbox.sheet .profile-img { max-width:90px; max-height:90px; width: auto; height: auto; margin-right: 3px; margin-bottom: 5px; border-style:none; } .sandbox.sheet .header-fields { flex: 1; height: 100px; } .sandbox.sheet .charname { height: 60px; padding: 3px; margin: 0px; } .sandbox.sheet .charname input { width: 100%; height: 100%; margin: 0px; font-family: Google; border:none; } .sandbox.sheet .rightblock { display: flex; flex: 0 0 100px; float: right; padding: 3px 10px; } .sandbox.sheet .rightblock-element { margin: 0; padding: 3px 5px; } .sandbox.sheet .rightblock-element-tag { margin: 0; padding: 3px 5px; width:100px; } .sandbox.sheet .resource { height: 40px; width: 50%; padding: 3px 10px; float: left; } .sandbox.sheet .resource input { width: 100px; height: 28px; } /* Navigation Tabs */ .sandbox.sheet .tabs { width:55%; height: 34px; } .sandbox.sheet .tabs .item { font-weight: bold; flex: 1; font-family: Impact; background: #980101; font-size: 1.1em; border-radius: 6px 6px 0px 0px; color: beige; /* border-bottom: solid 1px; */ box-shadow: inset 3px 5px 6px #00000061; letter-spacing: 1px; text-shadow: 1px 1px black; padding-top: 1.5%; /* height: 25px; */ } .sandbox.sheet .tabs .item.active { text-decoration: underline; background: #bd0404; box-shadow: 3px -2px 2px #0000008c; color: #ececec; margin-top: -3px; height: inherit; letter-spacing: 1px; box-shadow: 1px 1px black; text-shadow: 1px 1px black; padding-top: 1.5%; /* -webkit-text-stroke-width: .5px; */ /* -webkit-text-stroke-color: black; */ } /* Content Tabs */ .sandbox.sheet .sheet-body { height: calc(100% - 150px); } .sandbox.sheet .sheet-body .tab { height:100%; padding: 0px 5px; } .sandbox.sheet .scrollable{ height:100%; overflow-y: auto; } .sandbox.sheet .scrollable-bio{ height:auto; max-height: 320px; overflow-y: auto; } .sandbox.sheet .sheet-body .editor { width: 100%; height: 100%; } /* Items */ .sandbox.sheet .items-list { list-style: none; margin: 7px 0; padding: 0; } .sandbox.sheet .items-list .item { height: 30px; line-height: 24px; padding: 3px 0; border-bottom: 1px solid #BBB; } .sandbox.sheet .items-list .item img { flex: 0 0 24px; margin-right: 5px; } .sandbox.sheet .items-list .item-name { margin: 0; } .sandbox.sheet .items-list .item-controls { flex: 0 0 36px; } /* Attributes */ .sandbox.sheet .attributes-header { padding: 5px; margin: 5px 0; background: rgba(0, 0, 0, 0.05); border: 1px solid #AAA; border-radius: 2px; text-align: center; font-weight: bold; } .sandbox.sheet .attribute-label { flex: 1.5; } .sandbox.sheet .attribute-control { flex: 0 0 20px; } .sandbox.sheet .attributes-list { list-style: none; margin: 0; padding: 0; } .sandbox.sheet .attributes-list li > * { margin: 0 3px; height: 28px; line-height: 24px; background: transparent; border: none; border-radius: 0; border-bottom: 1px solid #AAA; } .sandbox.sheet .attribute-value.checkbox { text-align: center; } .sandbox.sheet .attributes-list li a.attribute-control { border: none; } /* Properties */ .sandbox.sheet .properties-list { list-style: none; margin: 7px 0; padding: 0; overflow-y: auto; } .sandbox.sheet .properties-list .property { height: 30px; line-height: 24px; padding: 3px 0; border-bottom: 1px solid #BBB; } .sandbox.sheet .properties-list .property-name { margin: 0; } .sandbox.sheet .properties-list .property-controls { flex: 0 0 36px; } .sandbox.sheet .properties-list .group-controls { flex: 0 0 20px; } .sandbox.sheet .properties-list .property-row { flex: 0 0 100px; }.sandbox.sheet .properties-list .group-row { flex: 0 0 100px; } /* Custom Formats*/ .sandbox.sheet .label-free { margin: 0; padding: 5px 5px 5px 10px; font-size:13px; } .sandbox.sheet .label-small { margin: 0; padding: 5px 5px; width: 70px; font-size:13px; } .sandbox.sheet .label-med { margin: 0; padding: 5px 5px; width: 105px; font-size: 1.1em; } .sandbox.sheet .label-medlarge { margin: 0; padding: 5px 5px; width: 150px; font-size:13px; } .sandbox.sheet .label-large { margin: 0; padding: 5px 5px; width: 200px; font-size:13px; } .sandbox.sheet .input-small { padding: 1px 5px; } .sandbox.sheet .input-ahalf { padding: 0px 5px; } .sandbox.sheet .input-bhalf { padding: 0px 5px; } .sandbox.sheet .input-min { padding: 1px 5px; } .sandbox.sheet .input-med {padding: 1px 5px;border: none;background: #ffffff00;} .sandbox.sheet .input-free { padding: 1px 5px; } .sandbox.sheet .input-green{ color:green; } .sandbox.sheet .input-red{ color:red; } .sandbox.sheet .new-row { padding: 0px 0px; } .sandbox.sheet .table-row { padding: 0px 0px; } .sandbox.sheet .new-block { padding: 0px 0px; width:100%; max-width:608px; } .sandbox.sheet .new-multiblock { padding: 0px 0px; display:inline-block; margin:0; } .sandbox.sheet .new-column { display: flex; flex: 0 0 100px; flex-direction: column; padding: 5px 0px; } .sandbox.sheet .col-1-1 { width: 100%; max-width:608px; padding: 0px 3px; } .sandbox.sheet .col-1-2 { width: 50%; max-width:300px; padding: 0px 3px; display:inline-block; vertical-align:top; } .sandbox.sheet .col-1-3 { width: 33.33%; max-width:200px; padding: 0px 3px; display:inline-block; vertical-align:top; } .sandbox.sheet .col-1-4 { width: 25%; max-width:150px; padding: 0px 3px; display:inline-block; vertical-align:top; } .sandbox.sheet .col-1-6 { width: 16.66%; max-width:100px; padding: 0px 3px; display:inline-block; vertical-align:top; } .sandbox.sheet .col-1-8 { width: 12.5%; max-width:75px; padding: 0px 3px; display:inline-block; vertical-align:top; } .sandbox.sheet .col-3-8 { width: 37.5%; max-width:225px; padding: 0px 3px; display:inline-block; vertical-align:top; } .sandbox.sheet .col-5-8 { width: 62.5%; max-width:375px; padding: 0px 3px;; display:inline-block; vertical-align:top; } .sandbox.sheet .col-2-3 { width: 66.66%; max-width:400px; padding: 0px 3px; display:inline-block; vertical-align:top; } .sandbox.sheet .col-3-4 { width: 75%; max-width:400px; padding: 0px 3px; display:inline-block; vertical-align:top; } .sandbox.sheet .col-5-6 { width: 83.33%; max-width:500px; padding: 0px 3px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-1-1 { width:600px; padding: 0px 2px 4px 2px; } .sandbox.sheet .multi-1-2 { width:300px; padding: 0px 2px 4px 2px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-1-3 { width:200px; padding: 0px 2px 4px 2px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-1-4 { width:150px; padding: 0px 2px 4px 2px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-1-6 { width:100px; padding: 0px 2px 4px 2px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-1-8 { width:75px; padding: 0px 2px 4px 2px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-3-8 { width:225px; padding: 0px 2px 4px 2px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-5-8 { width:375px; padding: 0px 2px 4px 2px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-2-3 { width:400px; padding: 0px 2px 4px 2px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-3-4 { width:450px; padding: 0px 2px 4px 2px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-5-6 { width:500px; padding: 0px 2px 4px 2px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-1-1-col { width:604px; padding: 0px 1px; } .sandbox.sheet .multi-1-2-col { width:304px; padding: 0px 1px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-1-3-col { width:204px; padding: 0px 1px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-1-4-col { width:154px; padding: 0px 1px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-1-6-col { width:104px; padding: 0px 1px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-1-8-col { width:79px; padding: 0px 1px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-3-8-col { width:229px; padding: 0px 1px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-5-8-col { width:379px; padding: 0px 1px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-2-3-col { width:404px; padding: 0px 1px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-3-4-col { width:454px; padding: 0px 1px; display:inline-block; vertical-align:top; } .sandbox.sheet .multi-5-6-col { width:504px; padding: 0px 1px; display:inline-block; vertical-align:top; } .sandbox.sheet .panelheader { background-color: black; color: #e8e8e8; margin-top: 10px; padding: 3px 5px; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; font-size: 14px; font-weight: bold; text-align: center; text-shadow: 1px 1px black; border-bottom: 1px solid black; border-radius: 7px 7px 0px 0px; box-shadow: 1px 1px 7px #000000ab; letter-spacing: 1px; } .sandbox.sheet .panelheader-t { background-color: transparent; color:black; padding: 3px 5px; font-family: Arial Narrow, sans-serif; font-size: 14px; font-weight: bold; text-align: center; text-shadow: 1px 1px white; } .sandbox.sheet .flexblock { display: flex; flex-direction:row; flex: 0 0 100px; font-family: MinionPro, sans-serif; font-size: 12px; padding: 10px 0px; } .sandbox.sheet .flexblock-simple { display: flex; flex-direction:row; flex: 0 0 100px; font-family: MinionPro, sans-serif; font-size: 12px; padding: 3px 5px; } .sandbox.sheet .flexblock-center { display: flex; flex-direction:row; height:100%; flex: 0 0 100px; font-family: MinionPro, sans-serif; padding: 2px 0px; align-items: center; justify-content: center; } .sandbox.sheet .tabblock-center { display: flex; flex-direction:row; height:100%; flex: 0 0 100px; font-family: MinionPro, sans-serif; padding: 0px 0px; align-items: center; justify-content: center; } .sandbox.sheet .tabblock-center input{ font-size: 11px; text-align: center; border: 1px solid #4d2424; border-radius: 3px; background-color:#ebdfc5; } .sandbox.sheet .flexblock-left { display: flex; flex-direction:row; height:100%; flex: 0 0 100px; font-family: MinionPro, sans-serif; font-size: 12px; padding: 2px 0px; } .sandbox.sheet .flexblock-left input { font-size: 1.1em; text-align: center; /* border: 1px solid #4d2424; */ /* border-radius: 3px; */ background-color: #ebdfc5; border: none; border-bottom: dashed 1px; } .sandbox.sheet .flexblock-center input{ font-size: 11px; text-align: center; border: 1px solid #4d2424; border-radius: 3px; background-color:#ebdfc5; padding: 2px 0px; } .sandbox.sheet .flexblock-center-nopad { display: flex; flex-direction:row; flex: 0 0 100px; font-family: MinionPro, sans-serif; font-size: 12px; padding: 3px 3px; align-items: center; justify-content: center; } .sandbox.sheet .flexblock-center-nopad input.input-small{ width:45px; height: 26px; text-align: center; } .sandbox.sheet .flexblock-center-nopad input.input-med{ width:70px; height: 26px; text-align: center; } .sandbox.sheet .flexblock-center-nopad input.input-medlarge{ width:230px; height: 26px; text-align: center; } .sandbox.sheet .flexblock-center-nopad .label-small{ text-align: right; width:50px; } .sandbox.sheet .flexblock-left input[type=number]{ width:45px; height: 26px; } .sandbox.sheet .flexblock-left input[type=number].input-smallmed{ width:65px; height: 26px; } .sandbox.sheet .flexblock-left input[type=number].input-med{ width:60px; height: 26px; } .sandbox.sheet .flexblock-left input[type=text].input-min{ width:40px; min-width:40px; height: 26px; } .sandbox.sheet .flexblock-left input[type=text].input-bhalf{ width:35px; height: 26px; border-radius: 0px 3px 3px 0px; } .sandbox.sheet .flexblock-left input[type=text].input-ahalf{ width:35px; height: 26px; border-radius: 3px 0px 0px 3px; } .sandbox.sheet .flexblock-left input.input-disabled { background-color: lightgrey; } .sandbox.sheet .flexblock-left input[type=text].input-small{ width:80px; height: 26px; } .sandbox.sheet .flexblock-left input[type=text].input-med{ width:130px; height: 26px; } .sandbox.sheet .flexblock-left input[type=text].input-medlarge{ width:180px; height: 26px; } .sandbox.sheet .flexblock-left input[type=text].input-free{ width:100%; height: 26px; } .sandbox.sheet .flexblock-center input[type=number]{ width:45px; height: 26px; } .sandbox.sheet .flexblock-center input[type=number].input-med{ width:60px; height: 26px; } .sandbox.sheet .flexblock-center input[type=text].input-min{ width:40px; min-width:40px; height: 26px; } .sandbox.sheet .flexblock-center input[type=text].input-bhalf{ width:35px; height: 26px; border-radius: 0px 3px 3px 0px; } .sandbox.sheet .flexblock-center input[type=text].input-ahalf{ width:35px; height: 26px; border-radius: 3px 0px 0px 3px; } .sandbox.sheet .flexblock-center input.input-disabled { background-color: lightgrey; } .sandbox.sheet .flexblock-center input[type=text].input-small{ width:80px; height: 26px; } .sandbox.sheet .flexblock-center input[type=text].input-med{ width:130px; height: 26px; } .sandbox.sheet .flexblock-center input[type=text].input-medlarge{ width:180px; height: 26px; } .sandbox.sheet .flexblock-center input[type=text].input-free{ width:100%; height: 26px; } .sandbox.sheet .boldtext { font-weight: bold; } .sandbox.sheet .smalltext { font-size: 11px; } .sandbox.sheet .centertext { text-align: center; } .sandbox.sheet .righttext { text-align: right; } .sandbox.sheet .texteditor-small { height: 65px; resize: vertical; padding: 4px 5px; } .sandbox.sheet .texteditor-med { height: 140px; resize: vertical; padding: 4px 5px; } .sandbox.sheet .texteditor-large { height: 210px; resize: vertical; padding: 4px 5px; } .texteditor-large { height: 210px; resize: vertical; padding: 4px 5px; } .sandbox.sheet .rollable { cursor: pointer; } .sandbox.sheet .rollable:hover{ color: darkred; font-weight: bold; } .sandbox.sheet .linkable { cursor: pointer; } .sandbox.sheet .linkable:hover{ color: dodgerblue; font-weight: bold; } .sandbox.sheet .header-left { display: flex; flex-direction:row; flex: 0 0 100px; height: 100%; padding: 3px; margin: 0px; } .sandbox.sheet .header-left input{ width: 100%; height: 100%; margin: 0px; } .sandbox.sheet .header-left .typelabel{ font-size: 14px; font-weight: bold; text-align: center; } .sandbox.sheet table{ background-color:#bcc2bf; border-style:none; padding: 0px 0px; margin:0; } .sandbox.sheet table.table-free{ height:100%; width:100%; } .sandbox.sheet table.table-small{ height:90px; } .sandbox.sheet table.table-med{ height:180px; } .sandbox.sheet table.table-tall{ height:270px; } .sandbox.sheet thead { background-color: #941400; color: white; padding: 1px 5px; font-family: Arial Narrow, sans-serif; font-size: 14px; font-weight: bold; text-align: center; text-shadow: 1px 1px black; border-bottom: 1px solid black; } .sandbox.sheet tr.empty-row{ background-color:#C0C0C0; width:100%; min-width:80px; height:100%; } .sandbox.sheet tr{ border-bottom: 1px solid #ddd; } .sandbox.sheet td { height: 26px; padding: 2px 1px; font-family: MinionPro, sans-serif; font-size: 1.1em; box-shadow: 1px 0px 5px 0px #00000061; background: #e8dfcb; border-bottom: solid 1px; } .sandbox.sheet td.input-min { width:40px; min-width:40px; text-align: center; } .sandbox.sheet td.input-small { width:60px; text-align: center; } .sandbox.sheet th{ height: 26px; padding: 2px 1px; } .sandbox.sheet th.input-small { width:70px; text-align: center; } .sandbox.sheet th.input-med { width:130px; text-align: center; } .sandbox.sheet th.input-free { width:100%; text-align: left; } .sandbox.sheet th.cell-empty { width:14px; text-align: center; } .sandbox.sheet td.ci-delete{ padding:0px 1px; width:14px; } .sandbox.sheet th.input-min { width:35px; min-width:35px; text-align: center; } .sandbox.sheet input.table-input { background-color: #98550152; border: none; border-radius: 0px 0px 0px 0px; margin: 0; box-shadow: inset 1px 2px 5px #00000082; font-family: MinionPro; } .sandbox.sheet input.table-free{ width:100%; } .sandbox.sheet input.table-small{ width:40px; padding:0px 0px; } .sandbox.sheet input-small{ width:70px; } .sandbox.sheet input-med{ width:110px; } .sandbox.sheet input-large{ width:150px; } .sandbox.sheet input.table-empty{ background-color: transparent; border:none; margin:0; width:100%; } .sandbox.sheet input.table-empty-small{ background-color: transparent; border:none; margin:0; width:40px; } /* Navigation Tabs */ .sandbox.sheet .atabs { /* display: flex; */ /* width:100%; */ /* flex: 0 0 40px; */ /* flex-direction: row; */ /* border-top: 1px solid #AAA; */ /* border-bottom: 2px solid black; */ /* padding: 15px 20px; */ position: absolute; transform: translate(0px, 5%) rotate(90deg); left: 50%; top: 373px; border: none; z-index: -1; } .sandbox.sheet .modtitle{ font-family: MinionPro, sans-serif; font-size: 16px; font-weight: bold; padding:5px 10px; } .sandbox.sheet .mods-list{ list-style-type: none; } .sandbox.sheet .mod-block{ padding:15px 0px; } .sandbox.sheet .mod-row{ width:450px; } .sandbox.sheet .mod-row-listmods{ display: flex; flex-direction:row; flex: 0 0 100px; font-family: MinionPro, sans-serif; font-size: 12px; height:100%; } .sandbox.sheet .mod-row-block{ display: flex; flex-direction:row; flex: 0 0 100px; font-family: MinionPro, sans-serif; font-size: 12px; height:30px; } .sandbox.sheet .mod-row-dropblock{ display: flex; flex-direction:row; flex: 0 0 100px; font-family: MinionPro, sans-serif; font-size: 12px; } .sandbox.sheet .mod-row-header{ background-color:darkslategrey; color:white; font-size:14px; text-align:center; font-weight:bold; padding:3px 3px; border:1px solid black; } .sandbox.sheet .itemdrop-area{ padding:3px 3px; } .sandbox.sheet .mod-citem{ padding:0px 3px; } .sandbox.sheet .mod-row-itemdrop{ min-height:50px; height:100%; width:100%; } .sandbox.sheet .mod-row-input{ background-color:#ebe6d5; text-align:center; padding:3px 3px; border:1px solid black; } .sandbox.sheet .mod-row-selectnum{ width:90px; } .sandbox.sheet .mod-row-input input{ border:none; } .sandbox.sheet .mod-row-input select{ border:none; } .sandbox.sheet .mod-delete{ width: 16.66%; max-width:100px; padding:0px 0px; margin:0; } .sandbox.sheet .table-num{ width:40px; padding:0px 3px; border:none; margin:0; } .roll-free{ padding: 5px 15px; width:15px; } .roll-template{ width:100%; } .roll-flexrow{ display: flex; flex-direction:row; flex: 0 0 85%; padding: 0px 0px; margin:0; } .roll-sender-image{ max-width:35px; max-height:35px; margin-right: 3px; border-style:none; } .roll-sender-name{ font-family: Tahoma, sans-serif; font-weight: bold; font-size: 14px; width:100%; } .roll-underline{ border-bottom: 2px solid red; height:20px; width:70%; } .roll-delete-button{ width:10px; } .roll-flavor{ font-family: Tahoma, sans-serif; font-weight: bold; font-style: italic; font-size: 12px; text-align:center; width:100%; margin-top:-15px; } .roll-conditional{ font-family: Tahoma, sans-serif; font-weight: bold; font-size: 12px; text-align:center; height:20px; width:100%; padding: 3px 3px; } .roll-result{ font-family: Impact, sans-serif; font-size: 36px; text-align:center; width:100%; padding:5px 5px; height:70px; } .roll-iscrit{ color:green; } .roll-isfumble{ color:red; } .roll-detail{ width:100%; padding: 5px 5px; height:70px; } .roll-formula{ font-family: Tahoma, sans-serif; font-style: italic; font-size: 12px; text-align:left; } .label-roll{ font-family: Tahoma, sans-serif; font-weight: bold; font-size: 12px; text-align:left; } .roll-wbutton{ font-family: Tahoma, sans-serif; font-size: 10px; color:blue; font-style: italic; text-align:left; padding:0px 0px; } .roll-user{ font-family: Tahoma, sans-serif; font-size: 10px; font-style: italic; text-align:right; width:100%; padding:0px 5px; } .roll-list{ padding:0px 0px; margin:0; } .roll-die{ font-family: Tahoma, sans-serif; font-size: 12px; font-style: italic; text-align:left; padding:0px 3px; } .roll-area{ max-height: 50px; overflow-y: auto; } .sandbox.sheet .radio-input{ padding:5px 2px; vertical-align:middle; } .sandbox.sheet .group-row-block{ display: flex; flex-direction:row; flex: 0 0 100px; height: 30px; line-height: 24px; padding:5px 0px; border-bottom: 1px solid #BBB; } .sandbox.sheet .groupblock { display: flex; flex-direction:row; flex: 0 0 100px; font-family: MinionPro, sans-serif; padding: 0px 0px; justify-content: group-end; } .sandbox.sheet ,groupblock input.check-isconstant{ margin:0; padding:0px 10px; } .sandbox.sheet .properties-list .group-name { width:70%; font-size: 16px; } .sandbox.sheet .roll-mode { font-family: MinionPro, sans-serif; font-size: 16px; text-align:center; padding: 3px 15px; width:50px; } .sandbox.sheet .mod-selector { padding: 3px 20px; } .sandbox.sheet a.badge-image { background: url(img/bennie.png) no-repeat bottom center; background-size: 51px; height: 50px; width: 50px; display: block; } .sandbox.sheet .badge-click { font-family: Impact; font-size: 2em; font-weight: bold; text-align: center; margin-left: -5px; vertical-align: middle; padding: auto; position: relative; top: 7px; } .sandbox.sheet .badge-container { display: flex; flex-direction:row; justify-content: center; width:100%; } .fa-exclamation-circle { color: red; } .roll-menu { background-color: antiquewhite; border: 2px solid black; border-radius: 4px; padding: 3px 3px; margin-top:-60px; min-width:286px; } .dc-input { background-color: antiquewhite; border: 2px solid black; border-radius: 4px; height:100px; width:100%; margin-top:-46px; margin-right:10px; user-select: all; } .dc-input input{ height:60px; width:100px; border:none; color:black; font-family: Impact, sans-serif; font-size: 36px; text-align:center; pointer-events: auto; } .dc-header{ font-family: Tahoma, sans-serif; font-size: 22px; font-weight: bold; text-align:center; border-bottom: 2px solid red; padding: 2px 2px; } .flexblock-left-nopad { display: flex; flex-direction:row; flex: 0 0 100px; align-items: flex-start; justify-content: left; flex-wrap: nowrap; width:100%; } .action-bar-container { display: flex; flex-direction:row; flex-wrap: nowrap; align-items: flex-start; min-width:550px; } div.dmtk-tooltip { visibility: visible; width: auto; background-color: rgba(0, 0, 0, 0.6); color: #fff; text-align: left; border-radius: 6px; font-size: 1.5rem; position: absolute; z-index: 10000; display: flex; flex-direction: column; padding: 10px 15px; } div.dmtk-tooltip div.section { display: flex; flex-direction: column; justify-content: left; } div.dmtk-tooltip div.value { display: flex; flex-direction: row; align-items: center; justify-content: left; } div.dmtk-tooltip div.value i { color: rgb(75, 130, 225); width: 40px; text-align: center; padding-right: 10px; } /* Show the tooltip text when you mouse over the tooltip container */ div.dmtk-tooltip.visible { visibility: visible; }