 * { box-sizing : border-box ; } .row::after { content : "" ; clear : both ; display : table ; } [class*="space-"] , [class*="col-"] { float : left ; border : none ; min-height : 1px ; } [class*="space-"] { width : 0 ; } [class*="col-"] { width : 100% ; } .col-label { text-align : left ; padding-right : 0 ; width : 50% ; color : #a9a9a9 ; } div.datafind .col-label { width : 30% ; } .col-field { width : 50% ; color : #a9a9a9 ; } .col-find { width : 30% ; color : #a9a9a9 ; } .col-sep { display : none ; } div.showmenu { display : block ; padding : 0.3em ; cursor : pointer ; margin : 0.3em !important ; float : right !important ; } div.menubuttonpanel { position : absolute ; left : -9999px ; right : unset ; z-index : unset ; top : 1em ; background-color : #f0f0f0 ; padding : 0.3em ; top : 1.3em ; } div.menubuttonpanel-show { left : unset ; right : 0 ; z-index : 1 ; } div.searchinput { position : fixed ; right : 2em ; padding : 0.4em ; } div.dataoptions { position : absolute ; background-color : #ffffff ; color : #a9a9a9 ; z-index : 1 ; font-size : initial ; right : 3.2em ; margin-top : -0.7em ; } div.menubutton , div.okbutton { float : unset ; } hr { background-color : #a9a9a9 ; } textarea , input , select { background-color : #ffffff ; color : #a9a9a9 ; border-radius : 1em ; padding-top : 0.4em ; padding-bottom : 0.4em ; padding-left : 0.6em ; padding-right : 0.6em ; border : solid 1px #a9a9a9 ; } div.fieldsdiv , div.childsdiv { float : unset ; padding : 1em ; } div.row { padding : 0.2em ; } div.more { padding-top : 1em ; padding-left : 1em ; } @media only screen and (min-width:600px) { [class*="col-"] { width : 50% ; } .col-label { text-align : left ; padding-right : 0 ; width : 50% ; } div.datafind .col-label { width : 30% ; margin-top : 0.5em ; } div.dataedit .col-label { width : 30% ; margin-top : 0.5em ; } .col-field { width : 50% ; } .col-find { width : 30% ; } .col-sep { display : none ; } div.datapicklist > div { width : 100% ; float : left ; } } @media only screen and (min-width:800px) { div.showmenu { display : none ; } div.menubuttonpanel { position : absolute ; right : 0px ; top : 0px ; margin-right : 1em ; margin-top : 0.6em ; background-color : transparent ; padding : 0 ; padding-bottom : 0.4em ; } div.searchinput { right : 9em ; } div.dataoptions { position : absolute ; background-color : #ffffff ; color : #a9a9a9 ; z-index : 1 ; font-size : initial ; top : 4em ; margin-left : -1em ; right : auto ; margin-top : auto ; } div.menubutton , div.okbutton { float : right ; } .col-label { text-align : right ; padding-right : 1em ; width : 50% ; } div.datafind .col-label { width : 30% ; } .col-field { width : 50% ; } .col-find { width : 30% ; } .col-sep { display : block ; text-align : center ; width : 10% ; } div.datapicklist > div { width : 32% ; float : left ; } div.fieldsdiv { float : left ; width : 70% ; } div.childsdiv { float : right ; width : 30% ; } .space-0 , .col-0{ width : 0% ; } .space-1 , .col-1{ width : 1% ; } .space-2 , .col-2{ width : 2% ; } .space-3 , .col-3{ width : 3% ; } .space-4 , .col-4{ width : 4% ; } .space-5 , .col-5{ width : 5% ; } .space-6 , .col-6{ width : 6% ; } .space-7 , .col-7{ width : 7% ; } .space-8 , .col-8{ width : 8% ; } .space-9 , .col-9{ width : 9% ; } .space-10 , .col-10{ width : 10% ; } .space-11 , .col-11{ width : 11% ; } .space-12 , .col-12{ width : 12% ; } .space-13 , .col-13{ width : 13% ; } .space-14 , .col-14{ width : 14% ; } .space-15 , .col-15{ width : 15% ; } .space-16 , .col-16{ width : 16% ; } .space-17 , .col-17{ width : 17% ; } .space-18 , .col-18{ width : 18% ; } .space-19 , .col-19{ width : 19% ; } .space-20 , .col-20{ width : 20% ; } .space-21 , .col-21{ width : 21% ; } .space-22 , .col-22{ width : 22% ; } .space-23 , .col-23{ width : 23% ; } .space-24 , .col-24{ width : 24% ; } .space-25 , .col-25{ width : 25% ; } .space-26 , .col-26{ width : 26% ; } .space-27 , .col-27{ width : 27% ; } .space-28 , .col-28{ width : 28% ; } .space-29 , .col-29{ width : 29% ; } .space-30 , .col-30{ width : 30% ; } .space-31 , .col-31{ width : 31% ; } .space-32 , .col-32{ width : 32% ; } .space-33 , .col-33{ width : 33% ; } .space-34 , .col-34{ width : 34% ; } .space-35 , .col-35{ width : 35% ; } .space-36 , .col-36{ width : 36% ; } .space-37 , .col-37{ width : 37% ; } .space-38 , .col-38{ width : 38% ; } .space-39 , .col-39{ width : 39% ; } .space-40 , .col-40{ width : 40% ; } .space-41 , .col-41{ width : 41% ; } .space-42 , .col-42{ width : 42% ; } .space-43 , .col-43{ width : 43% ; } .space-44 , .col-44{ width : 44% ; } .space-45 , .col-45{ width : 45% ; } .space-46 , .col-46{ width : 46% ; } .space-47 , .col-47{ width : 47% ; } .space-48 , .col-48{ width : 48% ; } .space-49 , .col-49{ width : 49% ; } .space-50 , .col-50{ width : 50% ; } .space-51 , .col-51{ width : 51% ; } .space-52 , .col-52{ width : 52% ; } .space-53 , .col-53{ width : 53% ; } .space-54 , .col-54{ width : 54% ; } .space-55 , .col-55{ width : 55% ; } .space-56 , .col-56{ width : 56% ; } .space-57 , .col-57{ width : 57% ; } .space-58 , .col-58{ width : 58% ; } .space-59 , .col-59{ width : 59% ; } .space-60 , .col-60{ width : 60% ; } .space-61 , .col-61{ width : 61% ; } .space-62 , .col-62{ width : 62% ; } .space-63 , .col-63{ width : 63% ; } .space-64 , .col-64{ width : 64% ; } .space-65 , .col-65{ width : 65% ; } .space-66 , .col-66{ width : 66% ; } .space-67 , .col-67{ width : 67% ; } .space-68 , .col-68{ width : 68% ; } .space-69 , .col-69{ width : 69% ; } .space-70 , .col-70{ width : 70% ; } .space-71 , .col-71{ width : 71% ; } .space-72 , .col-72{ width : 72% ; } .space-73 , .col-73{ width : 73% ; } .space-74 , .col-74{ width : 74% ; } .space-75 , .col-75{ width : 75% ; } .space-76 , .col-76{ width : 76% ; } .space-77 , .col-77{ width : 77% ; } .space-78 , .col-78{ width : 78% ; } .space-79 , .col-79{ width : 79% ; } .space-80 , .col-80{ width : 80% ; } .space-81 , .col-81{ width : 81% ; } .space-82 , .col-82{ width : 82% ; } .space-83 , .col-83{ width : 83% ; } .space-84 , .col-84{ width : 84% ; } .space-85 , .col-85{ width : 85% ; } .space-86 , .col-86{ width : 86% ; } .space-87 , .col-87{ width : 87% ; } .space-88 , .col-88{ width : 88% ; } .space-89 , .col-89{ width : 89% ; } .space-90 , .col-90{ width : 90% ; } .space-91 , .col-91{ width : 91% ; } .space-92 , .col-92{ width : 92% ; } .space-93 , .col-93{ width : 93% ; } .space-94 , .col-94{ width : 94% ; } .space-95 , .col-95{ width : 95% ; } .space-96 , .col-96{ width : 96% ; } .space-97 , .col-97{ width : 97% ; } .space-98 , .col-98{ width : 98% ; } .space-99 , .col-99{ width : 99% ; } .space-100 , .col-100{ width : 100% ; } } body { background-color : #f0f0f0 ; color : #a9a9a9 ; padding : 0 ; margin : 0 ; overflow : hidden ; font-family : Arial ; font-size : 16px ; cursor : default ; } ::placeholder { color : #cdcdce ; opacity : 1 ; font-style : italic ; } :-ms-input-placeholder { color : #cdcdce ; font-style : italic ; } ::-ms-input-placeholder { color : #cdcdce ; font-style : italic ; } ::-webkit-scrollbar { width : 0px ; background : transparent ; } .col-find > input , .col-field > input , .col-find > textarea , .col-field > textarea { width : 100% ; margin : 0.25em ; } .col-field > img { width : 50% ; margin : 0.25em ; } img.fullscreenimage { position : absolute ; width : 100% ; height : auto ; top : 0px ; left : 0px ; margin : 0px ; padding : 0px ; } .col-find > select , .col-field > select { margin : 0.25em ; margin-top : 0.6em ; } .col-find > textarea , .col-field > textarea { height : 10em ; } .dataaction { background-color : #ffffff ; color : #df0914 ; border : solid 0.5em #cdcdce ; } .dataaction:hover { cursor : pointer ; color : #ffffff ; background-color : #df0914 ; } .loginform , .changepasswordform { } .dom-INDICATOR { } div.processes { position : absolute ; left : 0 ; right : 0 ; top : 0 ; bottom : 0 ; background-color : #ffffff ; overflow : auto ; } div.process { margin : 0.5em ; padding : 0.5em ; border : solid 1px #a9a9a9 ; } div.process h1 { font-size : 1em ; color : #a9a9a9 ; } .graph polygon { fill : #ffffff ; stroke : none ; } .node polygon { fill : none ; stroke : #a9a9a9 ; } .node text { stroke : none ; fill : #000000 ; } .startnode polygon { fill : none ; stroke : #1067de ; } .endnode polygon { fill : none ; stroke : #df0914 ; } .errornode polygon { fill : none ; stroke : #df0914 ; } .wasselected polygon { fill : #f0f0f0 ; stroke : #a9a9a9 ; } .wasselected text { stroke : none ; fill : #000000 ; } .selected polygon { fill : #1067de ; stroke : #1067de ; } .selected text { stroke : none ; fill : #ffffff ; } .edge polygon { stroke : #a9a9a9 ; fill : #a9a9a9 ; } .edge path { stroke : #a9a9a9 ; fill : none ; } .edge text { stroke : none ; fill : #a9a9a9 ; } .edgeselected polygon { stroke : #1067de ; fill : #1067de ; } .edgeselected path { stroke : #1067de ; fill : none ; } .edgeselected text { stroke : none ; fill : #1067de ; } div.datapanel { } div.datapickpanel { position : absolute ; left : 2em ; right : 2em ; top : 2em ; bottom : 2em ; background-color : #f0f0f0 ; box-shadow : 0 0 1em 0.1em #a9a9a9 ; } div.datawaitfor { position : absolute ; left : 0 ; bottom : 0 ; padding : 0.2em ; background-color : #ffffff ; color : #1067de ; } div.datareadyfordownload:hover { color : #ffffff ; background-color : #1067de ; } div.datamenu { position : absolute ; font-size : 2em ; top : 0px ; width : 100% ; height : 2em ; background-image : linear-gradient(#ffffff , #dadada ) ; border-bottom : 2px ; border-bottom-style : solid ; border-bottom-color : #dadada ; } div.datatitle { visibility : hidden ; } div.searchinput > input , div.searchinput > input:active { color : #a9a9a9 ; } div.menubutton , div.okbutton { box-sizing : content-box ; padding : 0.4em ; margin : 0.1em ; cursor : pointer ; background-repeat : no-repeat ; background-size : contain ; border : 0 ; } div.imgbutton { position : absolute ; left : 0px ; top : 0px ; width : 2em ; height : 2em ; cursor : pointer ; background-repeat : no-repeat ; background-size : contain ; border : 0 ; } div.databuttonapply{ background-image : url("webapp_apply.png") ; } div.databuttonapply:hover { background-image : url("webapp_applyhover.png") ; } div.databuttonback{ background-image : url("webapp_back.png") ; } div.databuttonback:hover { background-image : url("webapp_backhover.png") ; } div.databuttonclear{ background-image : url("webapp_clear.png") ; } div.databuttonclear:hover { background-image : url("webapp_clearhover.png") ; } div.databuttoncopy{ background-image : url("webapp_copy.png") ; } div.databuttoncopy:hover { background-image : url("webapp_copyhover.png") ; } div.databuttondelete{ background-image : url("webapp_delete.png") ; } div.databuttondelete:hover { background-image : url("webapp_deletehover.png") ; } div.databuttondownload{ background-image : url("webapp_download.png") ; } div.databuttondownload:hover { background-image : url("webapp_downloadhover.png") ; } div.databuttonedit{ background-image : url("webapp_edit.png") ; } div.databuttonedit:hover { background-image : url("webapp_edithover.png") ; } div.databuttonfind{ background-image : url("webapp_find.png") ; } div.databuttonfind:hover { background-image : url("webapp_findhover.png") ; } div.databuttonlink{ background-image : url("webapp_link.png") ; } div.databuttonlink:hover { background-image : url("webapp_linkhover.png") ; } div.databuttonmenu{ background-image : url("webapp_menu.png") ; } div.databuttonmenu:hover { background-image : url("webapp_menuhover.png") ; } div.databuttonnew{ background-image : url("webapp_new.png") ; } div.databuttonnew:hover { background-image : url("webapp_newhover.png") ; } div.databuttonorderby{ background-image : url("webapp_orderby.png") ; } div.databuttonorderby:hover { background-image : url("webapp_orderbyhover.png") ; } div.databuttonprint{ background-image : url("webapp_print.png") ; } div.databuttonprint:hover { background-image : url("webapp_printhover.png") ; } div.databuttonquit{ background-image : url("webapp_quit.png") ; } div.databuttonquit:hover { background-image : url("webapp_quithover.png") ; } div.databuttonrefresh{ background-image : url("webapp_refresh.png") ; } div.databuttonrefresh:hover { background-image : url("webapp_refreshhover.png") ; } div.databuttonunlink{ background-image : url("webapp_unlink.png") ; } div.databuttonunlink:hover { background-image : url("webapp_unlinkhover.png") ; } div.databuttonuser{ background-image : url("webapp_user.png") ; } div.databuttonuser:hover { background-image : url("webapp_userhover.png") ; } div.databuttonviewpanel{ background-image : url("webapp_viewpanel.png") ; } div.databuttonviewpanel:hover { background-image : url("webapp_viewpanelhover.png") ; } div.datacaption { position : absolute ; top : 0px ; left : 0px ; padding : 0.5em ; height : 1.8em ; overflow : hidden ; } div.datacaption2 { height : 2.8em ; font-size : 0.6em ; } div.datafind , div.dataedit , div.datarecord , div.datatable , div.datapicklist , div.dataroom , div.datapage { position : absolute ; font-size : 1em ; overflow : auto ; overflow-wrap : break-word ; top : 5em ; bottom : 0px ; width : 100% ; } div.datatablewithheader { top : 4em ; } div.datarecord , div.dataedit , div.datafind { padding : 0 ; z-index : -1 ; } div.datarecord { background-color : #f0f0f0 ; } div.dataroom { background-color : #ffffff ; } div.datapage { background-color : #ffffff ; } div.fullpage { position : fixed ; left : 0 ; right : 0 ; top : 0 ; bottom : 0 ; background-color : #ffffff ; overflow : auto ; } div.dataview { position : absolute ; padding : 0.5em ; font-size : 1em ; overflow : auto ; overflow-wrap : break-word ; bottom : 1em ; right : 1em ; background-color : #f0f0f0 ; box-shadow : 0 0 1em 0.1em #a9a9a9 ; min-width : 40% ; max-width : 60% ; max-height : 90% ; } div.dataedit { background-color : #f0f0f0 ; } .todelete { background-color : #ffffff !important ; } .dataforeignkey { cursor : pointer ; text-align : left ; font-size : 1em ; background-image : url("webapp_link.png") ; background-size : 1em ; background-repeat : no-repeat ; background-position : left ; background-origin : padding-box ; padding-left : 1.5em ; border : none ; background-color : inherit ; color : inherit ; margin : 0 !important ; margin-top : -0.25em !important ; } div.dataedit .dataforeignkey { margin-top : 0.25em !important ; } .dataforeignkey:hover { background-image : url("webapp_linkHover.png") ; color : #1067de ; } .datachildkey { cursor : pointer ; margin : 0.6em ; padding : 0.8em ; float : left ; border : none ; background-color : #ffffff ; color : #a9a9a9 ; } .datachildkey:hover { background-color : #1067de ; color : #ffffff ; } div.datapicklist { background-color : #f0f0f0 ; } div.datatable { background-color : #f0f0f0 ; } div.datafind { background-color : #f0f0f0 ; } div.datafind > div , div.datatable > div , div.datapicklist > div , div.dataoptions > div { left : 0px ; right : 0px ; height : auto ; background-color : #ffffff ; color : #a9a9a9 ; margin-bottom : 0.5em ; margin-left : 0.5% ; margin-right : 0.5% ; padding : 0.5em ; cursor : pointer ; } div.datarow { } div.datarowfixed , div.datarowfixed:hover { background-color : #f0f0f0 !important ; color : #a9a9a9 !important ; font-weight : bold ; cursor : default !important ; } div.dataheaderrow { position : sticky ; top : 0 ; width : 100% ; height : auto ; background-color : #dadada !important ; color : #a9a9a9 !important ; margin-left : 0 !important ; margin-right : 0 !important ; cursor : default !important ; } div.orderby { cursor : pointer !important ; } div.orderby:hover { color : #ffffff ; } div.datarow > table { width : 100% ; text-align : left ; } .nofocus * { cursor : default !important ; background-color : #cdcdce !important ; overflow : hidden !important ; background-image : none !important ; } .nofocus div.menubutton:hover , .nofocusdiv.okbutton:hover { border-color : transparent !important ; } .datapos { } .datapos:hover { background-color : #7bb5e8 ; color : #ffffff ; } .dataselected { background-color : #1067de !important ; color : #cdcdce !important ; border-color : #cdcdce !important ; color : #ffffff !important ; } div.datarecord td { padding : 0.2em ; vertical-align : top ; } div.dataload { } div.datapicklist > div { width : 32% ; float : left ; } input:focus , select:focus { } .dataerror { padding : 0 ; margin : 0 ; } .haserror { background-color : #df0914 ; color : #ffffff ; padding : 1em ; margin-bottom : 1em ; } .button { padding : 0.5em 1em ; text-align : center ; cursor : pointer ; background-color : transparent ; color : #a9a9a9 ; } div.button:hover , div.selected-button { border-color : yellow ; } div.button:active { border-style : inset ; } .disable { color : #a9a9a9 ; background-color : #cdcdce ; } .disable:active { border-style : outset ; } .centercontent { position : absolute ; border : none ; padding : 0px ; margin : 0px ; top : 0px ; left : 0px ; right : 0px ; bottom : 0px ; display : flex ; align-items : center ; justify-content : center ; } div[interface="1"] { position : absolute ; z-index : 3 ; background-color : steelblue ; border-radius : 1em ; border : ridge 0.25em ; padding : 1em ; overflow : hidden ; } div.selectlist1 { min-height : 2em ; } div.selectlist2 { max-height : 20em ; overflow : auto ; } div.selectlist2 > div.button { min-width : 20em ; clear : both ; background-color : midnightblue ; } div.askaccept1 { min-height : 4em ; } div.askaccept2 { min-height : 3em ; display : flex ; justify-content : center ; align-items : center ; } div.askinput1 { min-height : 2em ; } div.askinput2 { min-height : 2em ; text-align : center ; font-weight : bold ; } div.askinput3 { } div.keyline { display : table ; margin : 0 auto ; clear : both ; } div.askinput3 > div.button { float : left ; width : 3em ; } div.yes-button { background-color : green !important ; color : white ; } div.no-button { background-color : red !important ; color : white ; } div.backspace-button { background-color : red !important ; color : white ; } div.cancel-button { background-color : blue !important ; color : white ; } div.escape-button { position : absolute ; top : -0.3em ; right : -0.3em ; background-color : red !important ; color : white ; padding : 0.5em 0.5em 0.2em 0.2em ; border-radius : 30% ; } div.hidden-button { visibility : hidden ; } .on { color : black ; background-color : lime ; } .off { color : white ; background-color : red ; } .barcontainer { position : relative ; width : 200px ; height : 40px ; border : solid 0.2em yellow ; background-color : blue ; } .level { width : 100% ; height : 1px ; } .v-level { height : 100% ; width : 1px ; } .bar { background-color : red ; } div.items { margin : 1em ; } div.items table { border : solid 1px white ; border-collapse : collapse ; } div.items td { text-align : left ; border : solid 1px white ; padding : 0 1em ; } div.items td:first-of-type { text-align : right ; padding : 0 0.5em ; } @media only print { * { background-color : none ; color : black ; } div.datamenu { visibility : hidden ; } div.datatitle { visibility : visible ; position : initial ; font-size : 1.5em ; height : auto ; width : 100% ; text-align : center ; margin-bottom : 0.5em ; text-decoration : underline ; } div.datafind , div.dataedit , div.datarecord , div.datatable , div.datapicklist , div.dataroom { font-size : 1em ; position : initial ; overflow : visible ; } input , select { display : block ; -webkit-appearance : none ; border : none ; padding : 0 ; font : inherit ; margin : 0 ; text-align : left ; } div.datafind > div , div.datatable > div , div.datapicklist > div { left : 0px ; right : 0px ; height : auto ; border : none ; margin : 0 ; padding : 0.1em ; } div.processes { overflow : visible ; } div.process { border : none ; } .graph polygon { fill : none ; stroke : none ; } .node polygon , .selected polygon , .wasselected polygon , .errornode polygon , .endnode polygon , .startnode polygon { fill : none ; stroke : black ; } .edge polygon , .edgeselected polygon { stroke : black ; fill : black ; } .edge path , .edgeselected path { stroke : black ; fill : none ; } .edge text , .edgeselected text , .selected text , .wasselected text , .errornode text , .endnode text , .startnode text { fill : black ; stroke : none ; } .col-label { text-align : right ; padding-right : 1em ; width : 30% ; } .col-field { width : 70% ; } .col-find { width : 30% ; } .col-sep { display : block ; text-align : center ; width : 10% ; } .space-0 , .col-0{ width : 0% ; } .space-1 , .col-1{ width : 1% ; } .space-2 , .col-2{ width : 2% ; } .space-3 , .col-3{ width : 3% ; } .space-4 , .col-4{ width : 4% ; } .space-5 , .col-5{ width : 5% ; } .space-6 , .col-6{ width : 6% ; } .space-7 , .col-7{ width : 7% ; } .space-8 , .col-8{ width : 8% ; } .space-9 , .col-9{ width : 9% ; } .space-10 , .col-10{ width : 10% ; } .space-11 , .col-11{ width : 11% ; } .space-12 , .col-12{ width : 12% ; } .space-13 , .col-13{ width : 13% ; } .space-14 , .col-14{ width : 14% ; } .space-15 , .col-15{ width : 15% ; } .space-16 , .col-16{ width : 16% ; } .space-17 , .col-17{ width : 17% ; } .space-18 , .col-18{ width : 18% ; } .space-19 , .col-19{ width : 19% ; } .space-20 , .col-20{ width : 20% ; } .space-21 , .col-21{ width : 21% ; } .space-22 , .col-22{ width : 22% ; } .space-23 , .col-23{ width : 23% ; } .space-24 , .col-24{ width : 24% ; } .space-25 , .col-25{ width : 25% ; } .space-26 , .col-26{ width : 26% ; } .space-27 , .col-27{ width : 27% ; } .space-28 , .col-28{ width : 28% ; } .space-29 , .col-29{ width : 29% ; } .space-30 , .col-30{ width : 30% ; } .space-31 , .col-31{ width : 31% ; } .space-32 , .col-32{ width : 32% ; } .space-33 , .col-33{ width : 33% ; } .space-34 , .col-34{ width : 34% ; } .space-35 , .col-35{ width : 35% ; } .space-36 , .col-36{ width : 36% ; } .space-37 , .col-37{ width : 37% ; } .space-38 , .col-38{ width : 38% ; } .space-39 , .col-39{ width : 39% ; } .space-40 , .col-40{ width : 40% ; } .space-41 , .col-41{ width : 41% ; } .space-42 , .col-42{ width : 42% ; } .space-43 , .col-43{ width : 43% ; } .space-44 , .col-44{ width : 44% ; } .space-45 , .col-45{ width : 45% ; } .space-46 , .col-46{ width : 46% ; } .space-47 , .col-47{ width : 47% ; } .space-48 , .col-48{ width : 48% ; } .space-49 , .col-49{ width : 49% ; } .space-50 , .col-50{ width : 50% ; } .space-51 , .col-51{ width : 51% ; } .space-52 , .col-52{ width : 52% ; } .space-53 , .col-53{ width : 53% ; } .space-54 , .col-54{ width : 54% ; } .space-55 , .col-55{ width : 55% ; } .space-56 , .col-56{ width : 56% ; } .space-57 , .col-57{ width : 57% ; } .space-58 , .col-58{ width : 58% ; } .space-59 , .col-59{ width : 59% ; } .space-60 , .col-60{ width : 60% ; } .space-61 , .col-61{ width : 61% ; } .space-62 , .col-62{ width : 62% ; } .space-63 , .col-63{ width : 63% ; } .space-64 , .col-64{ width : 64% ; } .space-65 , .col-65{ width : 65% ; } .space-66 , .col-66{ width : 66% ; } .space-67 , .col-67{ width : 67% ; } .space-68 , .col-68{ width : 68% ; } .space-69 , .col-69{ width : 69% ; } .space-70 , .col-70{ width : 70% ; } .space-71 , .col-71{ width : 71% ; } .space-72 , .col-72{ width : 72% ; } .space-73 , .col-73{ width : 73% ; } .space-74 , .col-74{ width : 74% ; } .space-75 , .col-75{ width : 75% ; } .space-76 , .col-76{ width : 76% ; } .space-77 , .col-77{ width : 77% ; } .space-78 , .col-78{ width : 78% ; } .space-79 , .col-79{ width : 79% ; } .space-80 , .col-80{ width : 80% ; } .space-81 , .col-81{ width : 81% ; } .space-82 , .col-82{ width : 82% ; } .space-83 , .col-83{ width : 83% ; } .space-84 , .col-84{ width : 84% ; } .space-85 , .col-85{ width : 85% ; } .space-86 , .col-86{ width : 86% ; } .space-87 , .col-87{ width : 87% ; } .space-88 , .col-88{ width : 88% ; } .space-89 , .col-89{ width : 89% ; } .space-90 , .col-90{ width : 90% ; } .space-91 , .col-91{ width : 91% ; } .space-92 , .col-92{ width : 92% ; } .space-93 , .col-93{ width : 93% ; } .space-94 , .col-94{ width : 94% ; } .space-95 , .col-95{ width : 95% ; } .space-96 , .col-96{ width : 96% ; } .space-97 , .col-97{ width : 97% ; } .space-98 , .col-98{ width : 98% ; } .space-99 , .col-99{ width : 99% ; } .space-100 , .col-100{ width : 100% ; } } #tf_hui_container { visibility:hidden ; } div.label , div.field label { font-size:80% ; color:#a9a9a9 ; clear:both ; } div.field { float:left ; padding:0.5em ; } div.fitting { min-width:fit-content ; } div.panel { border-style:ridge ; resize:both ; overflow:auto ; } div.groupbox { border:ridge #dadada ; resize:both ; overflow:auto ; } div.groupboxlabel { border:outset #dadada ; border-bottom:none ; background-color:#dadada ; margin-left:1em ; padding-left:0.5em ; padding-right:0.5em ; width:fit-content ; } div.field input { width:100% ; } div.field input[type=checkbox] { width:unset ; } div.field select { width:100% ; } div.field textarea { width:100% ; } div.field img { width:100% ; } img.no_image { display:none ; } div.image { position:relative ; resize:both ; overflow:auto ; background-color:#dadada ; min-height:2em ; } div.cr { clear:left ; border:none ; width:0px ; height:0px ; } .c-1 {width: 8.3%;} .c-2 {width: 17%;} .c-3 {width: 25%;} .c-4 {width: 33%;} .c-5 {width: 42%;} .c-6 {width: 50%;} .c-7 {width: 58%;} .c-8 {width: 67%;} .c-9 {width: 75%;} .c-10 {width: 83%;} .c-11 {width: 92%;} .c-12 {width: 100%;} @media only screen and (max-width: 1440px) { [class$=".c-"] {width: 100%;} .c-1 {width: 9.1%;} .c-2 {width: 18%;} .c-3 {width: 27%;} .c-4 {width: 36%;} .c-5 {width: 45%;} .c-6 {width: 55%;} .c-7 {width: 64%;} .c-8 {width: 73%;} .c-9 {width: 82%;} .c-10 {width: 91%;} } @media only screen and (max-width: 960px) { [class$=".c-"] {width: 100%;} .c-1 {width: 10%;} .c-2 {width: 20%;} .c-3 {width: 30%;} .c-4 {width: 40%;} .c-5 {width: 50%;} .c-6 {width: 60%;} .c-7 {width: 70%;} .c-8 {width: 80%;} .c-9 {width: 90%;} } @media only screen and (max-width: 720px) { [class$=".c-"] {width: 100%;} .c-1 {width: 11%;} .c-2 {width: 22%;} .c-3 {width: 33%;} .c-4 {width: 44%;} .c-5 {width: 56%;} .c-6 {width: 67%;} .c-7 {width: 78%;} .c-8 {width: 89%;} } @media only screen and (max-width: 480px) { [class$=".c-"] {width: 100%;} .c-1 {width: 13%;} .c-2 {width: 25%;} .c-3 {width: 38%;} .c-4 {width: 50%;} .c-5 {width: 63%;} .c-6 {width: 75%;} .c-7 {width: 88%;} } @media only screen and (max-width: 360px) { [class$=".c-"] {width: 100%;} .c-1 {width: 14%;} .c-2 {width: 29%;} .c-3 {width: 43%;} .c-4 {width: 57%;} .c-5 {width: 71%;} .c-6 {width: 86%;} } @media only screen and (max-width: 240px) { [class$=".c-"] {width: 100%;} .c-1 {width: 17%;} .c-2 {width: 33%;} .c-3 {width: 50%;} .c-4 {width: 67%;} .c-5 {width: 83%;} } @media only screen and (max-width: 180px) { [class$=".c-"] {width: 100%;} .c-1 {width: 20%;} .c-2 {width: 40%;} .c-3 {width: 60%;} .c-4 {width: 80%;} }  [class*="space-"] , [class*="col-"] { float : left ; border : none ; min-height : 1px !important ; } @media only screen and (min-width:800px) { .col-label { text-align : right !important ; padding-right : 1em ; width : 25% !important ; } .col-field { width : 50% !important ; } } 