/* refer documentStructure.def for detailed explanations and comments;*/ /* set all items here as variables, everything is calculated to ensure consistency and flexibility ;*/ /*set for a4 ;*/ :root{ /*--Comment: user adjustable parameters document Standards which can be overridden by setting these variable in a :root in the document;*/ --physicalpagewidth: 21.0cm; /* a4 width - change to suit your needs;*/ --physicalpageheight: 29.7cm; /* a4 Length - change to suit your needs;*/ --margintop: 1.8cm; --marginbottom: 1.8cm; --marginleft: 1.8cm; --marginright: 1.8cm; --virtualrowspacerheight: 40px; --popupmenudocsectionminheight: 5cm; --blank: ""; /*--Comment: vars blank and blanksize are used to detect browser that do not support variables, like IE and dispaly a message to the user;*/ --blanksize: 0; --BxPadtop: 2px; --BxPadbottom: 2px; --BxPadleft: 2px; --BxPadright: 2px; --HighLightOutlineStyle: solid; --RelatedHighLightOutlineColor:rgba(7, 178, 0, 0.75); --HighLightOutlineColor: rgba(63, 255, 7, 0.75); --HighLightOutlineWidth: 3px; --RelatedHighLightOutlineWidth: 2px; --HighLightOutlineOffset: -1px; /*--Comment: recheck and set suitable default tabs settings ;*/ --firsttextindent: 0cm; --tab1: 0.6cm; --tab2: 1.0cm; --tab3: 1.4cm; --tab4: 1.8cm; --tab5: 2.2cm; --tab6: 2.4cm; --tab7: 2.8cm; --tab8: 3.2cm; --tabx1: 0.6cm; --tabx2: 1.0cm; --tabx3: 1.4cm; --tabx4: 1.8cm; --ol1-1:upper-alpha; --ol1-2:upper-roman; --ol1-3:lower-greek; --ol1-4:decimal; --ol2-1:decimal; --ol2-2:lower-alpha; --ol2-3:lower-roman; --ol2-4:lower-greek; --ol3-1:lower-roman; --ol3-2:lower-alpha; --ol3-3:lower-greek; --ol3-4:decimal-leading-zero; --ul1-1:disc; --ul1-2:circle; --ul1-3:square; --ul1-4:disc; --ul2-1:circle; --ul2-2:disc; --ul2-3:square; --ul2-4:circle; --ul3-1:square; --ul3-2:circle; --ul3-3:disc; --ul3-4:square; --docdefaultLineheight: 125%; /*--Comment: 1.25 lines - neat looking but compact as default !;*/ --letterheadImage: ""; /*--Comment: variable reserved to allow each report to write an option letter head image file name CHROME BUG DOES NOT WORK;*/ --BorderLineprintsize: 0.5px; /*--Comment: when printing our report/form, what width of borders should be used around boxes tables etc => 0.5 px prints nicely;*/ --boxBordercolor: #000000; /* CheckBox Standard */ --checkboxsize: 16px; /*default here, but can individually set on object if differing sizes needed*/ --checkfontsizeadjust: 1.0; --checkboxbordersize: 1px; --checkboxborderradius: 3px; --checkboxbordercolor: black; --checkboxsymolxoffset:-1px; /* On Status */ --checkboxontextcolor: black; --checkboxonbackcolor: lightgreen; --checkboxonsymbol: '\2713'; --checkboxonhovermsg: "True"; --checkboxonsymbolyoffset: -1px; /* Off Status */ --checkboxofftextcolor: black; --checkboxoffbackcolor: antiquewhite; --checkboxoffsymbol: ' '; --checkboxoffhovermsg: "False"; --checkboxoffsymbolyoffset: 0px; /* Indeterminate Status */ --checkboxindtextcolor: black; --checkboxindbackcolor: orange; --checkboxindsymbol: '-'; --checkboxindhovermsg: "Unknown"; --checkboxindsymbolyoffset: 0px; --TitleWidthControl:6%; /*--Comment: Levels (titles) numbering control vars ;*/ --lnAppendixNumpretext : "Appendix"; /*--Comment: not yet implemented ;*/ --titledefaultSeparator : ":"; /*--Comment: list numbering control vars ;*/ --nnpretext : ""; --nnnumposttext : ") "; --nnfirstindent : 0.25cm; --nnindent : 0.5cm; --nnline2indent: 0.8cm; --nnposttext: "."; --nndigsep: "."; --lnpretext : "("; --lnnumposttext : ") "; --lnfirstindent : 0cm; --lnindent : 0cm; --lnline2indent: 0cm; --lnposttext: var(--titledefaultSeparator); --lndigsep: "."; --insertdatamessage: '\21D0 insert data'; /*--Comment: Standard font size is magic number 12 => divisible by 2,3,4,5,6 in all text formulas, use these Fracs to avoid rounding and hence minimise differences caused by Browsers handling rounding differently ;*/ --Standardfontsize: 12pt; /*--Comment: changing this is NOT recommended ;*/ --PxToPts: 0.75; /*--Comment: calc(12/16) future improvement - compute automatically for the device we are displaying on ;*/ --defaultdocumentfont: calibri; /*--Comment:fontFamily;*/ /*--Comment: end of doc variables ;*/ /*--Comment: Web page settings ;*/ --systemsfontsize: 12px; --systemsfont: "Calibri"; --top: var(--headerheight);/*--Comment: Default. set in js DragObject;*/ --Navbarswidth: 250px; /*--Comment:15% side navigation bars is specified in % to allow them to scale if screen size changes;*/ --left: var(--Navbarswidth);/*--Comment: Default. set in js DragObject;*/ --VirtualDesktopBorderSize: 2px; /*--Comment:Purely visual effect border around virtual desk top ;*/ --VirtualDesktopBorderStyle: solid transparent; /*--Comment: colors used ;*/ --nonprintareaPapercolor: rgba(255,130,1,0.1); /*--Comment:#f2f2f6; (very light blue grey);*/ --papercolor: rgb(255,255,255) ; --virtualDesktopcolor: #d9b38c; /*--Comment: light brown incase desktop background image is missing;*/ --EditDataFieldColor: deepskyblue; --buttonscolor: rgb(76,170,209); --buttons2color: rgb(100,206,249); --buttons3color: rgb(150,216,255); --buttons4color: rgb(230,237,230); /*-- light grey */ --buttons5color: rgb(81, 228, 200); --buttons6color: rgb(131, 229, 255); --buttons7color: rgb(200, 229, 255); --MenuBackground2color: rgb(176, 196, 222); --filenamecolor: rgb(252, 252, 150); /*--Comment: calculated elements - do not over write and take extreme care if adjusting these;*/ --BorderLines: calc( var(--BorderLineprintsize) / (var(--SliderDocSize) * var(--SliderDocSize) ) ); /*display only : upscale lines as we zoom out on display purely for improving visibility;*/ --printareapagewidth: calc(var(--physicalpagewidth) - (var(--marginleft) + var(--marginright)) ); --printareapagelength: calc(var(--physicalpageheight) - (var(--margintop) + var(--marginbottom)) ); --xtitlecolumnwidth: calc(0.1 * var(--printareapagewidth)); --Deskdisplayzoneheight: calc(100vh - var(--headerheight) - var(--footerheight) - var(--VirtualDesktopBorderSize) - 2px ); --Deskdisplayzonewidth: calc(100vw - var(--Navbarswidth) - 4px); /*--Comment: Variables for the Report zoom slider ;*/ --SliderDocSize: 1.0; /*--Comment:initial zoom 1.0 = 100% - do not change ;*/ --sliderdocxoffset: 0.0; /*--Comment: used to ensure top of zoomed document remains near top of virtual desktop - do not change ;*/ --smoothtransitiontime: 0.3; /*default use with .smoothtransitionclass*/ /*--Comment: note, when multiplying Standard font size by FractX-12 X is the NEW font size in points ! ;*/ /*--Comment: hence to get a font size of 19pts use font-size: calc(var(--Frac19-12) * var(--Standardfontsize));*/ /*--Comment: Seems convoluted, however it helps ensure a "Near" WYSIWYG display on the screen ;*/ --Frac1-12: calc(1/12); /*--Comment: =0.0833333333333333;*/ --Frac2-12: calc(2/12); /*--Comment: =0.166666666666667;*/ --Frac3-12: calc(3/12); /*--Comment: =0.25;*/ --Frac4-12: calc(4/12); /*--Comment: =0.333333333333333;*/ --Frac5-12: calc(5/12); /*--Comment: =0.416666666666667;*/ --Frac6-12: calc(6/12); /*--Comment: =0.5;*/ --Frac7-12: calc(7/12); /*--Comment: =0.583333333333333;*/ --Frac8-12: calc(8/12); /*--Comment: =0.666666666666667;*/ --Frac9-12: calc(9/12); /*--Comment: =0.75;*/ --Frac10-12: calc(10/12); /*--Comment: =0.833333333333333;*/ --Frac11-12: calc(11/12); /*--Comment: =0.916666666666667;*/ --Frac12-12: calc(12/12); /*--Comment: =1;*/ --Frac13-12: calc(13/12); /*--Comment: =1.08333333333333;*/ --Frac14-12: calc(14/12); /*--Comment: =1.16666666666667;*/ --Frac15-12: calc(15/12); /*--Comment: =1.25;*/ --Frac16-12: calc(16/12); /*--Comment: =1.33333333333333;*/ --Frac17-12: calc(17/12); /*--Comment: =1.41666666666667;*/ --Frac18-12: calc(18/12); /*--Comment: =1.5;*/ --Frac19-12: calc(19/12); /*--Comment: =1.58333333333333;*/ --Frac20-12: calc(20/12); /*--Comment: =1.66666666666667;*/ --Frac21-12: calc(21/12); /*--Comment: =1.75;*/ --Frac22-12: calc(22/12); /*--Comment: =1.83333333333333;*/ --Frac23-12: calc(23/12); /*--Comment: =1.91666666666667;*/ --Frac24-12: calc(24/12); /*--Comment: =2;*/ /*--Comment: user adjustable parameters ! NOTE ONLY change which Fraction is used !;*/ /*--Comment: due to problems in drag and drop, replace these calcs with sized directly in pts;*/ --reporttitlesize: 16pt; /*--Comment: calc(var(--Frac16-12) * var(--Standardfontsize));*/ --Bigtitlesize: 14pt; /*--Comment: calc(var(--Frac14-12) * var(--Standardfontsize));*/ --Normaltitlesize: 12pt; /*--Comment: calc(var(--Frac12-12) * var(--Standardfontsize));*/ --boxtitlesize: 10pt; /*--Comment: calc(var(--Frac10-12) * var(--Standardfontsize));*/ --Bigdatasize: 11pt; /*--Comment: calc(var(--Frac11-12) * var(--Standardfontsize));*/ --Normaldatasize: 10pt; /*--Comment: calc(var(--Frac10-12) * var(--Standardfontsize));*/ --titlecolumnheadingsize: var(--Bigtitlesize); --multicolumnheadingsize: var(--Bigtitlesize); --datacolumnheadingsize: var(--Normaltitlesize); --titlecolumntextsize: var(--Bigdatasize); --datacolumntextsize: var(--Normaldatasize); --bodyNormaltextsize: var(--Normaldatasize); /*--Comment: due to problems in drag and drop, replace these calcs with sized directly in px;*/ --headerfontsize: calc(var(--Frac12-12) * var(--systemsfontsize)); --systemtitle: calc(var(--Frac14-12) * var(--systemsfontsize)); --sidebarfontsize: calc(var(--Frac12-12) * var(--systemsfontsize)); --footerfontsize: calc(var(--Frac10-12) * var(--systemsfontsize)); --editmenufontsize: var(--systemsfontsize); --editmenufontSmall: calc(var(--Frac10-12) * var(--headerfontsize)); --headerheight: calc(3 * (var(--systemsfontsize) + 4px)); /*--Comment: must specify header and footer sizes in PX so that virtual desktop scales correctly when window size changes without loosine header or footer;*/ --footerheight: 0px; /*--Comment: NO FOOTER ANY MORE must specify header and footer sizes in PX so that virtual desktop scales correctly when window size changes without loosine header or footer;*/ --SpaceBetweenParagraphs :calc(var(--Frac8-12) * var(--systemsfontsize)); /* Set this variable to block in the normal system to show tags*/ /* but here we set to none so that any document not showing in the system will hide the tags*/ /* as the system is needed for Tag navigation to o-peraste*/ /* refer .tagcontainer in css below and body in ManageReportTest at div for class=bodywholepage*/ --showtags:none; } /*--Comment:IE message to user - because IE does not support variables and so display is not WYSIWYG;*/ .docbodyloader:before { content: "This Browser does not provide adequate CSS support for Accurate WYSIWYG display try a different browser eg .. Firefox, Chrome, or Edge etc"; content: var(--blank); position: fixed; width: 400px; width: 400px; height: var(--blanksize); width: var(--blanksize); font-size: calc(var(--Frac18-12) * var(--systemsfontsize)); z-index: 2000; background: yellow; } .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; } * html .clearfix { height: 1%; } /*--Comment: http://meyerweb.com/eric/tools/css/reset/v2.0 | 20110126 License: none (public domain);*/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: middle; /* line-height: normal; */ } /*--Comment: html5 display-role reset for older browsers ;*/ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;} body { /*vertical-align: top;*/ font-family: verdana; font-size: 10pt; font-size: var(--systemsfontsize); /* line-height: 130%; */ line-height: normal; color: black; font-family: var(--systemsfont); user-select: none; font-style: normal; line-height: 120%; } var { font-style: normal; } ol,ul{ white-space:normal; } li{ white-space:pre-wrap; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table,th,tr,td { border-collapse: collapse; border-spacing: 0; /* border: var(--BorderLines); */ border-style: solid; border-width: var(--BorderLines); border-color: var(--boxBordercolor); vertical-align: top; /* width: auto; */ background-clip: text; --comment: Backgroundclip=text is needed for firefox fix as broder left and bottom are obliterated if background color is set, chrome works correctly; /* background-size: contain; */ min-height: 13px; min-width: 15px; white-space: pre-wrap; } td:empty:before, th:empty:before { content: " "; /* --comment: "Prevent collapse whan all Cells in a row are Empty"; */ } table { /* table-layout: fixed; */ width: 100%; } /*--Comment: set default sytle for borders so that we only need to add a color;*/ fmt, span, ul, ol, li,o_, d_,t_, f_ ft_, r_, box, h1, h2, h3 ,h4 ,h5 ,h6 , .boxrowfixed,.boxrowloose, .boxrowleft, .boxrowfloat , .onepage, .pageheader, .pagefooter .docsection { border-style: solid; border-width: 0.1px; border-color: transparent; } .disableselect { -webkit-user-select: none; /* Chrome all / Safari all */ -moz-user-select: none; /* Firefox all */ -ms-user-select: none; /* IE 10+ */ user-select: none; /* Likely future */ } .showasdisabled ,.showasdisabled>div , .showasdisabled>div>div:not(.loginmenuclass){ background-color: rgb(180,180,180) !important; color: rgb(90,90,90) !important; background-image: unset !important; --screenBackground: unset !important; --nonprintareaPapercolor : rgb(100,100,100) !important; --papercolor: rgb(80,80,80) !important; --EditDataFieldColor: rgb(128,128,128) !important; --buttonscolor: rgb(128,128,128) !important; --buttons2color: rgb(128,128,128) !important; --buttons3color: rgb(128,128,128) !important; --buttons4color: rgb(128,128,128) !important; --buttons5color: rgb(128,128,128) !important; --buttons6color: rgb(128,128,128) !important; --buttons7color: rgb(128,128,128) !important; --buttons8color: rgb(128,128,128) !important; --MenuBackground2color: rgb(90,90,90) !important; } .showasdisabled>div>div>.tabsetbuttons { display:none; } /*--Comment:45 line can be displayed when controlling variable --Standardfontsize is 12 - unfortunately VAR and CALC do not work so have to specify manually cannot be done with a formula (yet) Thus if you change the font size you need to adjust the number of rows to suit Note, this does two things - forces a page break if printing and display red for table rows exceeding this number;*/ table tr:nth-child(45) { page-break-before: always; } table tr:nth-child(n+45) { background: #ff4d4d; opacity: 0.35; } .nooverflowscroll { overflow:hidden; } .numbered:before { counter-increment: section; /*--Comment: Increments only this instance of the section counter ;*/ content: counters(section, ".") " "; /*--Comment: Combines the values of all instances of the section counter, separated by a period ;*/ } /*--Comment: A lot more work hqas to be done to handle proper page beraking in display mode ;*/ .rotate90 { transform: rotate(90deg); } .boxrtl { direction: rtl; } .boxLTR { direction: ltr; } .boxrtl>t_{ position:relative; right:0; top:0; bottom:0; } /* rotate90Verticaltext ;*/ .boxtitlerotate90Vert>t_>o_,.boxdatarotate90Vert>d_>o_ { writing-mode: vertical-rl; text-orientation: upright; letter-spacing:-5px; min-width: calc( 1.25 * var(--bodyNormaltextsize)); /*--Comment: Minimum 1 line - work around for Firefox bug;*/ } /* rotate90 ;*/ .boxtitlerotate90>t_>o_,.boxdatarotate90>d_>o_{ white-space:pre-wrap; padding-bottom:3px; xmin-height:60px; min-width: calc( 1.25 * var(--bodyNormaltextsize)); /*--Comment: Minimum 1 line - work around for Firefox bug;*/ -webkit-transform: rotate(180deg); /*--Comment: Safari ;*/ -moz-transform: rotate(180deg);/*--Comment: Firefox ;*/ -ms-transform: rotate(180deg);/*--Comment: IE ;*/ -o-transform: rotate(180deg);/*--Comment: Opera ;*/ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);/*--Comment: Internet Explorer ;*/ transform: rotate(180deg); writing-mode: vertical-rl; xtext-orientation:sideways; text-align:center; margin:auto; } /*--Comment: rotate180 ;*/ .boxtitlerotate180.boxdatarotate180 { /*--Comment:if both 180 then swap;*/ direction: rtl; } .boxtitlerotate180>t_,.boxdatarotate180>d_ { direction: ltr; } .boxtitlerotate180>t_>o_,.boxdatarotate180>d_>o_ { -webkit-transform: rotate(180deg); /*--Comment: Safari ;*/ -moz-transform: rotate(180deg);/*--Comment: Firefox ;*/ -ms-transform: rotate(180deg);/*--Comment: IE ;*/ -o-transform: rotate(180deg);/*--Comment: Opera ;*/ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);/*--Comment: Internet Explorer ;*/ transform: rotate(180deg); display: inline-block; } /*--Comment:rotate270 ;*/ .boxtitlerotate270>t_>o_,.boxdatarotate270>d_>o_{ white-space:pre-wrap; padding-bottom:3px; xmin-height:60px; min-width: calc( 1.25 * var(--bodyNormaltextsize)); /*--Comment: Minimum 1 line - work around for Firefox bug;*/ writing-mode: vertical-rl; xtext-orientation:sideways; text-align:center; margin:auto; } .rotate2line>t_{ white-space: pre; xheight:80px; min-width: calc( 2.5 * var(--bodyNormaltextsize)); xwidth: calc( 2.5 * var(--bodyNormaltextsize)); max-height:120px; xmax-width: calc( 2.5 * var(--bodyNormaltextsize)); } .rotate3line>t_{ white-space: pre; height:80px; min-width: calc( 3.75 * var(--bodyNormaltextsize)); width: calc( 3.75 * var(--bodyNormaltextsize)); max-height:120px; max-width: calc( 3.75 * var(--bodyNormaltextsize)); } .boxtitlerotate90>t_,.boxdatarotate90>d_,.boxtitlerotate270>t_,.boxdatarotate270>d_, .boxtitlerotate270>d_,.boxdatarotate270>t_ , .sideblk>t_, .sideblk>d_, .boxtitlerotate90Vert>t_,.boxdatarotate90Vert>d_ { padding: 0; padding-left: 1px; padding-right: 1px; display: table-cell; table-layout: fixed; white-space: pre-wrap; direction: ltr; } /*--Comment: the OTHer part of box when rotating;*/ .boxtitlerotate90>d_,.boxdatarotate90>t_,.boxtitlerotate270>d_,.boxdatarotate270>t_ , .boxtitlerotate90Vert>d_,.boxdatarotate90Vert>t_ { /* padding: 0;*/ /* padding-left: 1px;*/ /* padding-right: 1px;*/ display: table-cell; table-layout: fixed; white-space: pre-wrap; direction: ltr; } .boxtitlerotate90>t_>o_>ul,.boxtitlerotate90>t_>o_>ol{ padding-left:0; padding-top:1.5em; } .boxtitlerotate270>t_>o_>ul,.boxtitlerotate270>t_>o_>ol{ padding-left:0; padding-bottom:1.5em; } .boxtitlerotate90Vert>t_>o_>ul>li,.boxtitlerotate90Vert>t_>o_>ol>li { padding-right:0.5em; } .boxdatarotate90>d_>o_>ul,.boxdatarotate90>d_>o_>ol{ padding-left:0; padding-top:1.5em; } .boxdatarotate270>d_>o_>ul,.boxdatarotate270>d_>o_>ol{ padding-left:0; padding-bottom:1.5em; } .boxdatarotate90Vert>d_>o_>ul>li,.boxdatarotate90Vert>d_>o_>ol>li { padding-right:0.5em; } /*--Comment: Format elements for text, apply to o_ regardless of which anscestor hold the class ;*/ /*--Comment: box default alignment is left ;*/ .rowunderline, .ftbul { border-bottom: var(--BorderLines) solid var(--boxBordercolor); } .rowoverline, .ftbol { border-top: var(--BorderLines) solid var(--boxBordercolor); } .inlinetxt { display:inline; } /*--Comment: Justify left;*/ .left,.ftjl, d_.ftjl>o_, t_.ftjl>o_, box.ftjl>d_>o_, box.ftjl>t_>o_, div.ftjl>box>d_>o_, div.ftjl>box>t_>o_ { text-align: left; } /*--Comment: Justify right;*/ .right,.ftjr, d_.ftjr>o_, t_.ftjr>o_, box.ftjr>d_>o_, box.ftjr>t_>o_, div.ftjr>box>d_>o_, div.ftjr>box>t_>o_ { text-align: right; } /*--Comment: Justify Center;*/ .center,.ftjc, d_.ftjc>o_, t_.ftjc>o_, box.ftjc>d_>o_, box.ftjc>t_>o_, div.ftjc>box>d_>o_, div.ftjc>box>t_>o_ { text-align: center; vertical-align: inherit;} /*--Comment: Justified Paragraph;*/ .Justified,.ftjp, d_.ftjp>o_, t_.ftjp>o_, box.ftjp>d_>o_, box.ftjp>t_>o_, div.ftjp>box>d_>o_, div.ftjp>box>t_>o_ { text-align: justify; white-space: normal; /*check ;*/ } /*--Comment: JustifiedLine;*/ .JustifiedFulloneLine ,.ftja, d_.ftja>o_, t_.ftja>o_, box.ftja>d_>o_, box.ftja>t_>o_, div.ftja>box>d_>o_, div.ftja>box>t_>o_ { white-space: pre-wrap; text-align: justify; text-align-last: justify; } /*--Comment: if justify is inside a span under o_ then we have to make it a block to work ;*/ o_>span.ftjl,o_>span.ftjr,o_>span.ftjc,o_>span.ftjp,o_>span.ftja, d_.ftjl,d_.ftjr,d_.ftjc,d_.ftjp,d_.ftja, t_.ftjl,t_.ftjr,t_.ftjc,t_.ftjp,t_.ftja{ display: block; } /*--Comment:UpperCase;*/ .ftuc, d_.ftuc>o_, t_.ftuc>o_, box.ftuc>d_>o_, box.ftuc>t_>o_, div.ftuc>box>d_>o_, div.ftuc>box>t_>o_ { text-transform: uppercase; } /*--Comment:LowerCase;*/ .ftlc, d_.ftlc>o_, t_.ftlc>o_, box.ftlc>d_>o_, box.ftlc>t_>o_, div.ftlc>box>d_>o_, div.ftlc>box>t_>o_ { text-transform: lowercase; } /*--Comment:Capitalise;*/ .ftcc, d_.ftcc>o_, t_.ftcc>o_, box.ftcc>d_>o_, box.ftcc>t_>o_, div.ftcc>box>d_>o_, div.ftcc>box>t_>o_ { text-transform: capitalize; } /*--Comment:Bold;*/ b,bold,.ftb, d_.ftb>o_, t_.ftb>o_, box.ftb>d_>o_, box.ftb>t_>o_, div.ftb>box>d_>o_, div.ftb>box>t_>o_ { font-weight: bold; } /*--Comment:NotBold;*/ .ftnorm { font-weight:normal } /*--Comment:Superscript;*/ sup,.ftsup, d_.ftsup>o_, t_.ftsup>o_, box.ftsup>d_>o_, box.ftsup>t_>o_, div.ftsup>box>d_>o_, div.ftsup>box>t_>o_ { position: relative; font-size: 75%; vertical-align: middle; font-weight:inherit; white-space:normal; top:-0.4em; } /*--Comment:subscript;*/ sub,.ftsub, d_.ftsub>o_, t_.ftsub>o_, box.ftsub>d_>o_, box.ftsub>t_>o_, div.ftsub>box>d_>o_, div.ftsub>box>t_>o_ { position: relative; font-size: 80%; vertical-align:middle; white-space:normal; bottom:-0.3em; } /*--Comment:UnderLine;*/ .ftul, d_.ftul>o_, t_.ftul>o_, box.ftul>d_>o_, box.ftul>t_>o_, div.ftul>box>d_>o_, div.ftul>box>t_>o_ { text-decoration: underline ; } /*--Comment:Strikethough;*/ strike,.ftst, d_.ftst>o_, t_.ftst>o_, box.ftst>d_>o_, box.ftst>t_>o_, div.ftst>box>d_>o_, div.ftst>box>t_>o_ { text-decoration: line-through; } /*--Comment:UnderLineStrikethough;*/ .ftul.ftst, d_.ftul.ftst>o_, t_.ftul.ftst>o_, box.ftul.ftst>d_>o_, box.ftul.ftst>t_>o_, div.ftul.ftst>box>d_>o_, div.ftul.ftst>box>t_>o_ { text-decoration: underline line-through; } /*--Comment:Italic;*/ i,.fti, d_.fti>o_, t_.fti>o_, box.fti>d_>o_, box.fti>t_>o_, div.fti>box>d_>o_, div.fti>box>t_>o_ { font-style: italic; } .reporttitle { font-size: var(--reporttitlesize); font-weight: bold; vertical-align: middle; } .textNoWrap, .nowrap , box.nowrap>t_>o_, t_.nowrap>o_, box.nowrap>d_>o_, d_.nowrap>o_ { white-space: nowrap; } .wrap { white-space: pre-wrap; } .vertmiddle{ /*default is top and is inherited down from documanet .reportcontainer*/ vertical-align:middle; } /*--Comment: old items - to be depricated ;*/ .SinglespaceLines { line-height:105%;} .oneAndQuarterspaceLines{ line-height:125%;} .oneAndHalfspaceLines{ line-height:150%;} .DoublespaceLines { line-height:200%;} /*--Comment: to set default line hieght that works when font sizes changes - unfortunately overrides the other classes ! - work needed;*/ /*--Comment: at present if LSP is not set, large fonts overlay incorrectly ;*/ /*--Comment:#reportcontainer>div>div>div>box>d_;*/ /*--Comment: * is not the most processing efficient way, need to improve this ;*/ /*--Comment: o_,o_>*,o_>*>*,o_>*>*>*,o_>*>*>*>*,o_>*>*>*>*>* { line-height: 105%; };*/ /*--Comment:- not working well. need better method to ensure correct inheritance of default 105% of CURRENT object text size (not 105% of base size ;*/ /*--Comment: LSP Class can be set on objects, o_, d_, t_, row, and box set and needs to pass down correctly to all sub objects ;*/ /*--Comment: LSP Needs improvement - too many ** in this selector ;*/ /*--Comment: Chrome and Firefox do not render items the same, FireFox is always slightly bigger in text Spacing Whilst Chromes Lines are slightly bigger Test is a tiny adjustment in LSP give closer Results;*/ .lsp100{ line-height: 99%; } .lsp105,div.lsp105>div>box>d_>o_>*>*,div.lsp105>box>d_>o_>*>*,box.lsp105>d_>o_>*>*,d_.lsp105>o_>*>*,o_.lsp105>*>*, div.lsp105>div>box>d_>o_>*,div.lsp105>box>d_>o_>*,box.lsp105>d_>o_>*,d_.lsp105>o_>*,o_.lsp105>*{ line-height: 105%; } .lsp115,div.lsp115>div>box>d_>o_>*>*,div.lsp115>box>d_>o_>*>*,box.lsp115>d_>o_>*>*,d_.lsp115>o_>*>*,o_.lsp115>*>*, div.lsp115>div>box>d_>o_>*,div.lsp115>box>d_>o_>*,box.lsp115>d_>o_>*,d_.lsp115>o_>*,o_.lsp115>*{ line-height: 115%; } .lsp125,div.lsp125>div>box>d_>o_>*>*,div.lsp125>box>d_>o_>*>*,box.lsp125>d_>o_>*>*,d_.lsp125>o_>*>*,o_.lsp125>*>*, div.lsp125>div>box>d_>o_>*,div.lsp125>box>d_>o_>*,box.lsp125>d_>o_>*,d_.lsp125>o_>*,o_.lsp125>*{ line-height: 125%; } .lsp150,div.lsp150>div>box>d_>o_>*>*,div.lsp150>box>d_>o_>*>*,box.lsp150>d_>o_>*>*,d_.lsp150>o_>*>*,o_.lsp150>*>*, div.lsp150>div>box>d_>o_>*,div.lsp150>box>d_>o_>*,box.lsp150>d_>o_>*,d_.lsp150>o_>*,o_.lsp150>*{ line-height: 150%; } .lsp175,div.lsp175>div>box>d_>o_>*>*,div.lsp175>box>d_>o_>*>*,box.lsp175>d_>o_>*>*,d_.lsp175>o_>*>*,o_.lsp175>*>*, div.lsp175>div>box>d_>o_>*,div.lsp175>box>d_>o_>*,box.lsp175>d_>o_>*,d_.lsp175>o_>*,o_.lsp175>*{ line-height: 175%; } .lsp200,div.lsp200>div>box>d_>o_>*>*,div.lsp200>box>d_>o_>*>*,box.lsp200>d_>o_>*>*,d_.lsp200>o_>*>*,o_.lsp200>*>*, div.lsp200>div>box>d_>o_>*,div.lsp200>box>d_>o_>*,box.lsp200>d_>o_>*,d_.lsp200>o_>*,o_.lsp200>*{ line-height: 200%; } .lsp225,div.lsp225>div>box>d_>o_>*>*,div.lsp225>box>d_>o_>*>*,box.lsp225>d_>o_>*>*,d_.lsp225>o_>*>*,o_.lsp225>*>*, div.lsp225>div>box>d_>o_>*,div.lsp225>box>d_>o_>*,box.lsp225>d_>o_>*,d_.lsp225>o_>*,o_.lsp225>*{ line-height: 225%; } .lsp250,div.lsp250>div>box>d_>o_>*>*,div.lsp250>box>d_>o_>*>*,box.lsp250>d_>o_>*>*,d_.lsp250>o_>*>*,o_.lsp250>*>*, div.lsp250>div>box>d_>o_>*,div.lsp250>box>d_>o_>*,box.lsp250>d_>o_>*,d_.lsp250>o_>*,o_.lsp250>*{ line-height: 250%; } .lsp275,div.lsp275>div>box>d_>o_>*>*,div.lsp275>box>d_>o_>*>*,box.lsp275>d_>o_>*>*,d_.lsp275>o_>*>*,o_.lsp275>*>*, div.lsp275>div>box>d_>o_>*,div.lsp275>box>d_>o_>*,box.lsp275>d_>o_>*,d_.lsp275>o_>*,o_.lsp275>*{ line-height: 275%; } .lsp300,div.lsp300>div>box>d_>o_>*>*,div.lsp300>box>d_>o_>*>*,box.lsp300>d_>o_>*>*,d_.lsp300>o_>*>*,o_.lsp300>*>*, div.lsp300>div>box>d_>o_>*,div.lsp300>box>d_>o_>*,box.lsp300>d_>o_>*,d_.lsp300>o_>*,o_.lsp300>*{ line-height: 300%; } .lsp105,div.lsp105>div>box>t_>o_>*>*,div.lsp105>box>t_>o_>*>*,box.lsp105>t_>o_>*>*,t_.lsp105>o_>*>*, div.lsp105>div>box>t_>o_>*,div.lsp105>box>t_>o_>*,box.lsp105>t_>o_>*,t_.lsp105>o_>*{ line-height: 105%; } .lsp115,div.lsp115>div>box>t_>o_>*>*,div.lsp115>box>t_>o_>*>*,box.lsp115>t_>o_>*>*,t_.lsp115>o_>*>*, div.lsp115>div>box>t_>o_>*,div.lsp115>box>t_>o_>*,box.lsp115>t_>o_>*,t_.lsp115>o_>*{ line-height: 115%; } .lsp125,div.lsp125>div>box>t_>o_>*>*,div.lsp125>box>t_>o_>*>*,box.lsp125>t_>o_>*>*,t_.lsp125>o_>*>*, div.lsp125>div>box>t_>o_>*,div.lsp125>box>t_>o_>*,box.lsp125>t_>o_>*,t_.lsp125>o_>*{ line-height: 125%; } .lsp150,div.lsp150>div>box>t_>o_>*>*,div.lsp150>box>t_>o_>*>*,box.lsp150>t_>o_>*>*,t_.lsp150>o_>*>*, div.lsp150>div>box>t_>o_>*,div.lsp150>box>t_>o_>*,box.lsp150>t_>o_>*,t_.lsp150>o_>*{ line-height: 150%; } .lsp175,div.lsp175>div>box>t_>o_>*>*,div.lsp175>box>t_>o_>*>*,box.lsp175>t_>o_>*>*,t_.lsp175>o_>*>*, div.lsp175>div>box>t_>o_>*,div.lsp175>box>t_>o_>*,box.lsp175>t_>o_>*,t_.lsp175>o_>*{ line-height: 175%; } .lsp200,div.lsp200>div>box>t_>o_>*>*,div.lsp200>box>t_>o_>*>*,box.lsp200>t_>o_>*>*,t_.lsp200>o_>*>*, div.lsp200>div>box>t_>o_>*,div.lsp200>box>t_>o_>*,box.lsp200>t_>o_>*,t_.lsp200>o_>*{ line-height: 200%; } .lsp225,div.lsp225>div>box>t_>o_>*>*,div.lsp225>box>t_>o_>*>*,box.lsp225>t_>o_>*>*,t_.lsp225>o_>*>*, div.lsp225>div>box>t_>o_>*,div.lsp225>box>t_>o_>*,box.lsp225>t_>o_>*,t_.lsp225>o_>*{ line-height: 225%; } .lsp250,div.lsp250>div>box>t_>o_>*>*,div.lsp250>box>t_>o_>*>*,box.lsp250>t_>o_>*>*,t_.lsp250>o_>*>*, div.lsp250>div>box>t_>o_>*,div.lsp250>box>t_>o_>*,box.lsp250>t_>o_>*,t_.lsp250>o_>*{ line-height: 250%; } .lsp275,div.lsp275>div>box>t_>o_>*>*,div.lsp275>box>t_>o_>*>*,box.lsp275>t_>o_>*>*,t_.lsp275>o_>*>*, div.lsp275>div>box>t_>o_>*,div.lsp275>box>t_>o_>*,box.lsp275>t_>o_>*,t_.lsp275>o_>*{ line-height: 275%; } .lsp300,div.lsp300>div>box>t_>o_>*>*,div.lsp300>box>t_>o_>*>*,box.lsp300>t_>o_>*>*,t_.lsp300>o_>*>*, div.lsp300>div>box>t_>o_>*,div.lsp300>box>t_>o_>*,box.lsp300>t_>o_>*,t_.lsp300>o_>*{ line-height: 300%; } /*--Comment: FireFox - adjust to 97.6% inorder to have output be the same as other browsers. We Reference Chrome ;*/ @-moz-document url-prefix() { .lsp105,div.lsp105>div>box>d_>o_>*>*,div.lsp105>box>d_>o_>*>*,box.lsp105>d_>o_>*>*,d_.lsp105>o_>*>*,o_.lsp105>*>*, div.lsp105>div>box>d_>o_>*,div.lsp105>box>d_>o_>*,box.lsp105>d_>o_>*,d_.lsp105>o_>*,o_.lsp105>*{ line-height: 89.5%; } .lsp115,div.lsp115>div>box>d_>o_>*>*,div.lsp115>box>d_>o_>*>*,box.lsp115>d_>o_>*>*,d_.lsp115>o_>*>*,o_.lsp115>*>*, div.lsp115>div>box>d_>o_>*,div.lsp115>box>d_>o_>*,box.lsp115>d_>o_>*,d_.lsp115>o_>*,o_.lsp115>*{ line-height: 101.7%; } .lsp125,div.lsp125>div>box>d_>o_>*>*,div.lsp125>box>d_>o_>*>*,box.lsp125>d_>o_>*>*,d_.lsp125>o_>*>*,o_.lsp125>*>*, div.lsp125>div>box>d_>o_>*,div.lsp125>box>d_>o_>*,box.lsp125>d_>o_>*,d_.lsp125>o_>*,o_.lsp125>*{ line-height: 114.4%; } .lsp150,div.lsp150>div>box>d_>o_>*>*,div.lsp150>box>d_>o_>*>*,box.lsp150>d_>o_>*>*,d_.lsp150>o_>*>*,o_.lsp150>*>*, div.lsp150>div>box>d_>o_>*,div.lsp150>box>d_>o_>*,box.lsp150>d_>o_>*,d_.lsp150>o_>*,o_.lsp150>*{ line-height: 138.5%; } .lsp175,div.lsp175>div>box>d_>o_>*>*,div.lsp175>box>d_>o_>*>*,box.lsp175>d_>o_>*>*,d_.lsp175>o_>*>*,o_.lsp175>*>*, div.lsp175>div>box>d_>o_>*,div.lsp175>box>d_>o_>*,box.lsp175>d_>o_>*,d_.lsp175>o_>*,o_.lsp175>*{ line-height: 163.3%; } .lsp200,div.lsp200>div>box>d_>o_>*>*,div.lsp200>box>d_>o_>*>*,box.lsp200>d_>o_>*>*,d_.lsp200>o_>*>*,o_.lsp200>*>*, div.lsp200>div>box>d_>o_>*,div.lsp200>box>d_>o_>*,box.lsp200>d_>o_>*,d_.lsp200>o_>*,o_.lsp200>*{ line-height: 187.8%; } .lsp225,div.lsp225>div>box>d_>o_>*>*,div.lsp225>box>d_>o_>*>*,box.lsp225>d_>o_>*>*,d_.lsp225>o_>*>*,o_.lsp225>*>*, div.lsp225>div>box>d_>o_>*,div.lsp225>box>d_>o_>*,box.lsp225>d_>o_>*,d_.lsp225>o_>*,o_.lsp225>*{ line-height: 212.8%; } .lsp250,div.lsp250>div>box>d_>o_>*>*,div.lsp250>box>d_>o_>*>*,box.lsp250>d_>o_>*>*,d_.lsp250>o_>*>*,o_.lsp250>*>*, div.lsp250>div>box>d_>o_>*,div.lsp250>box>d_>o_>*,box.lsp250>d_>o_>*,d_.lsp250>o_>*,o_.lsp250>*{ line-height: 238%; } .lsp275,div.lsp275>div>box>d_>o_>*>*,div.lsp275>box>d_>o_>*>*,box.lsp275>d_>o_>*>*,d_.lsp275>o_>*>*,o_.lsp275>*>*, div.lsp275>div>box>d_>o_>*,div.lsp275>box>d_>o_>*,box.lsp275>d_>o_>*,d_.lsp275>o_>*,o_.lsp275>*{ line-height: 264.4%; } .lsp300,div.lsp300>div>box>d_>o_>*>*,div.lsp300>box>d_>o_>*>*,box.lsp300>d_>o_>*>*,d_.lsp300>o_>*>*,o_.lsp300>*>*, div.lsp300>div>box>d_>o_>*,div.lsp300>box>d_>o_>*,box.lsp300>d_>o_>*,d_.lsp300>o_>*,o_.lsp300>*{ line-height: 285.8%; } .lsp105,div.lsp105>div>box>t_>o_>*>*,div.lsp105>box>t_>o_>*>*,box.lsp105>t_>o_>*>*,t_.lsp105>o_>*>*, div.lsp105>div>box>t_>o_>*,div.lsp105>box>t_>o_>*,box.lsp105>t_>o_>*,t_.lsp105>o_>*{ line-height: 89.48%; } .lsp115,div.lsp115>div>box>t_>o_>*>*,div.lsp115>box>t_>o_>*>*,box.lsp115>t_>o_>*>*,t_.lsp115>o_>*>*, div.lsp115>div>box>t_>o_>*,div.lsp115>box>t_>o_>*,box.lsp115>t_>o_>*,t_.lsp115>o_>*{ line-height: 101.7%; } .lsp125,div.lsp125>div>box>t_>o_>*>*,div.lsp125>box>t_>o_>*>*,box.lsp125>t_>o_>*>*,t_.lsp125>o_>*>*, div.lsp125>div>box>t_>o_>*,div.lsp125>box>t_>o_>*,box.lsp125>t_>o_>*,t_.lsp125>o_>*{ line-height: 114.4%; } .lsp150,div.lsp150>div>box>t_>o_>*>*,div.lsp150>box>t_>o_>*>*,box.lsp150>t_>o_>*>*,t_.lsp150>o_>*>*, div.lsp150>div>box>t_>o_>*,div.lsp150>box>t_>o_>*,box.lsp150>t_>o_>*,t_.lsp150>o_>*{ line-height: 138.5%; } .lsp175,div.lsp175>div>box>t_>o_>*>*,div.lsp175>box>t_>o_>*>*,box.lsp175>t_>o_>*>*,t_.lsp175>o_>*>*, div.lsp175>div>box>t_>o_>*,div.lsp175>box>t_>o_>*,box.lsp175>t_>o_>*,t_.lsp175>o_>*{ line-height: 163.3%; } .lsp200,div.lsp200>div>box>t_>o_>*>*,div.lsp200>box>t_>o_>*>*,box.lsp200>t_>o_>*>*,t_.lsp200>o_>*>*, div.lsp200>div>box>t_>o_>*,div.lsp200>box>t_>o_>*,box.lsp200>t_>o_>*,t_.lsp200>o_>*{ line-height: 187.8%; } .lsp225,div.lsp225>div>box>t_>o_>*>*,div.lsp225>box>t_>o_>*>*,box.lsp225>t_>o_>*>*,t_.lsp225>o_>*>*, div.lsp225>div>box>t_>o_>*,div.lsp225>box>t_>o_>*,box.lsp225>t_>o_>*,t_.lsp225>o_>*{ line-height: 212.8%; } .lsp250,div.lsp250>div>box>t_>o_>*>*,div.lsp250>box>t_>o_>*>*,box.lsp250>t_>o_>*>*,t_.lsp250>o_>*>*, div.lsp250>div>box>t_>o_>*,div.lsp250>box>t_>o_>*,box.lsp250>t_>o_>*,t_.lsp250>o_>*{ line-height: 238%; } .lsp275,div.lsp275>div>box>t_>o_>*>*,div.lsp275>box>t_>o_>*>*,box.lsp275>t_>o_>*>*,t_.lsp275>o_>*>*, div.lsp275>div>box>t_>o_>*,div.lsp275>box>t_>o_>*,box.lsp275>t_>o_>*,t_.lsp275>o_>*{ line-height: 264.4%; } .lsp300,div.lsp300>div>box>t_>o_>*>*,div.lsp300>box>t_>o_>*>*,box.lsp300>t_>o_>*>*,t_.lsp300>o_>*>*, div.lsp300>div>box>t_>o_>*,div.lsp300>box>t_>o_>*,box.lsp300>t_>o_>*,t_.lsp300>o_>*{ line-height: 285.8%; } } .fillgrey{ background-color:#bbbbbb; margin:0; margin-top:2px; border: 1px transparent; } .NoEditCSV{ background-color:#bbbbbb !important; } .NoEditCSV:before{ content: 'Null Default'; } .stdbdr { border: var(--BorderLines) solid ; border-color: var(--boxBordercolor); } .blackbdr{ border: solid black; } .greybdr{ border: solid grey; } .redbdr{ border: solid red; } .bluebdr{ border: solid blue; } .greenbdr{ border: solid rgb(0,255,0); } .blackbdr{ border: solid black; } .yellowbdr{ border: solid yellow; } .magentabdr{ border: solid magenta; } .cyanbdr{ border: solid cyan; } .orangebdr{ border: solid orange; } .purplebdr{ border: solid purple; } .brownbdr{ border: solid brown; } .nobdr{ border: 0!important; /*--Comment: use to force override when black class is overridden by inhertiance;*/ } .bdrsz0-5px{border-width: 0.5pt ;} .bdrsz1-5px{border-width: 1.5pt ;} .bdrsz1px{border-width: 1pt ;} .bdrsz2px{border-width: 2pt ;} .bdrsz3px{border-width: 3pt ;} .bdrsz4px{border-width: 4pt;} .bdrsz5px{border-width: 5pt ;} .bdrsz6px{border-width: 6pt ;} .bdrsz7px{border-width: 7pt ;} .bdrsz8px{border-width: 8pt ;} .bdrsz9px{border-width: 9pt ;} .bdrsz10px{border-width: 10pt ;} .bdrsz11px{border-width: 11pt ;} .bdrsz12px{border-width: 12pt ;} .bdrsz13px{border-width: 13pt ;} .bdrsz14px{border-width: 14pt ;} .bdrsz15px{border-width: 15pt ;} .bdrsz16px{border-width: 16pt ;} .bdrsz17px{border-width: 17pt ;} .bdrsz18px{border-width: 18pt ;} .bdrsz19px{border-width: 19pt ;} .bdrsz20px{border-width: 20pt ;} .bdrsz21px{border-width: 21pt ;} .bdrsz22px{border-width: 22pt ;} .bdrsz23px{border-width: 23pt ;} .bdrsz24px{border-width: 24pt ;} .bdrsz25px{border-width: 25pt ;} .bdrsz26px{border-width: 26pt ;} .bdrsz27px{border-width: 27pt ;} .bdrsz28px{border-width: 28pt ;} .bdrsz29px{border-width: 29pt ;} .bdrsz30px{border-width: 30pt ;} .bdrdotted {border-style: dotted ;} .bdrdashed {border-style: dashed ;} .bdrsolid {border-style: solid ;} .bdrdouble {border-style: double ;} .bdrgroove {border-style: groove ;} .bdrridge {border-style: ridge;} .bdrinset {border-style: inset ;} .bdroutset {border-style: outset ;} /*--Comment:Bdrmix {border-style: dotted dashed solid double;};*/ .greytext{ color:grey; } .redtext{ color:red; } .bluetext{ color:blue; } .greentext{ color:green; } .yellowtext{ color:yellow; } .magentatext{ color:magenta; } .cyantext{ color:cyan; } .orangetext{ color:orange; } .purpletext{ color:purple; } .browntext{ color:brown; } .greyhighlight{ background-color:grey; } .redhighlight{ background-color:red; } .bluehighlight{ background-color:#50B4F9; } .darkbluehighlight{ background-color:blue; } .greenhighlight{ background-color:#30FF30; } .darkgreenhighlight{ background-color:green ; } .yellowhighlight{ background-color:yellow; } .magentahighlight{ background-color:magenta; } .cyanhighlight{ background-color:cyan; } .orangehighlight{ background-color:orange; } .purplehighlight{ background-color:#C284FF; } .darkpurplehighlight{ background-color:#8000FF; } .brownhighlight{ background-color:brown; } .blackhighlight{ background-color:black; } /*--Comment: ref color range;*/ .Xborder {border: 2px solid #FFFFFF} .Xborder {border: 2px solid #FFFF80} .Xborder {border: 2px solid #FFFF00} .Xborder {border: 2px solid #FF80FF} .Xborder {border: 2px solid #FF8080} .Xborder {border: 2px solid #FF8000} .Xborder {border: 2px solid #FF00FF} .Xborder {border: 2px solid #FF0080} .Xborder {border: 2px solid #FF0000} .Xborder {border: 2px solid #80FFFF} .Xborder {border: 2px solid #80FF80} .Xborder {border: 2px solid #80FF00} .Xborder {border: 2px solid #8080FF} .Xborder {border: 2px solid #808080} .Xborder {border: 2px solid #808000} .Xborder {border: 2px solid #8000FF} .Xborder {border: 2px solid #800080} .Xborder {border: 2px solid #800000} .Xborder {border: 2px solid #00FFFF} .Xborder {border: 2px solid #00FF80} .Xborder {border: 2px solid #00FF00} .Xborder {border: 2px solid #0080FF} .Xborder {border: 2px solid #008080} .Xborder {border: 2px solid #008000} .Xborder {border: 2px solid #0000FF} .Xborder {border: 2px solid #000080} .Xborder {border: 2px solid #000000} .nosideborders { border-left: 0; border-right: 0; } .notopborder { border-top: 0; } .nobottomborder { border-bottom: 0; } /*--Comment: Make a logo or image fit inside a box limited by width ;*/ /*--Comment: example usage: left Logo ;*/ img { /* --default: allows parent object to control size through dragging;*/ height: auto; width: auto; display: inline-block; vertical-align: middle; max-height: 100%; max-width: 100%; padding: 0; margin: 0; border-width: 0; } .fitboximg { resize: horizontal; width: 100%; height: auto; max-width: 100%; max-height: 100%; margin: 2px; } /* google charts wrap svg in 3 levels of div!!*/ .fitboximg>div,.fitboximg>div>div,.fitboximg>div>div>div { width: auto; height: auto; } .fitboximg>div>div>div>svg { width: auto; height: auto; } .fitheightimg { width: auto; height: 100%; max-width: 100%; max-height: 100%; margin: 2px; } .fitboxsmall { width: 40px; height: 40px; /*max-width: 40px;*/ /*max-height: 40px;*/ margin: 2px; top: -16px; --comment: Unclear why top -16px is currently needed to get alignment correct to investigate; } .fitboxlogo { width: 60px; height: 60px; /* max-width: 40px; */ /* max-height: 40px; */ margin: 2px; top: -16px; --comment: Unclear why top -16px is currently needed to get alignment correct to investigate; } .fitboxlogolarge { width: 80px; height: 80px; /* max-width: 40px; */ /* max-height: 40px; */ margin: 2px; top: -16px; --comment: Unclear why top -16px is currently needed to get alignment correct to investigate; } .fitboxsmall { /* --comment: "Use for signatures "; */ /* width: 100px; */ /* height: 100px; */ max-width: 150px; max-height: 80px; margin: 2px; } img.stretchbar { width: 100%; /* min-width: 20px; */ height: auto; /* vertical-align: top; */ /* border: 0; */ /* padding: 0; */ /* margin: 0; */ /*margin-top: 0;*/ /*margin-bottom: 0;*/ /* line-height: 100%! important; */ position: relative; /* margin-left: -1.5px; */ /* margin-right: 1.5px; */ /* zoom: 1.05; */ /* display: block; */ } .stretchbarthin { width: 100.5%; min-width:200px; height: 9px; max-height: 9px; /* vertical-align: top; */ border: 0; padding: 0; margin: 0; /*margin-top: 0;*/ /*margin-bottom: 0;*/ /* line-height: 100%! important; */ position: relative; left: -1.5px; } /*--Comment: firefox special adjustment on stretchbars:;*/ @-moz-document url-prefix() { .stretchbar { width: 98%; height: 18px; max-height: 18px; /* vertical-align: top; */ border: 0; padding: 0; margin: 0; /*margin-top: 0;*/ /*margin-bottom: 0;*/ line-height: 100%! important; } } * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .fhbox { /*--Comment: custom object in line boxes for WEBPAGE footer and header;*/ width: auto; margin: 0; padding: 0; border: 1px solid transparent; display: table-cell; /* table-layout: fixed; */ text-align: left; /* word-wrap: break-word; */ /* white-space: pre-wrap; */ vertical-align: top; text-align: center; line-height: 105%; min-width: 20vw; } .fhbox>div { display: block; padding: 0; margin: 0; top: 0; /* border: 0; */ /* height: auto; */ /* min-width: 440px; */ /* vertical-align: top; */ /* min-height: 22px; */ } .fhbox>div>div,.fhbox>div>bg_ { display: inline-block; /* padding: 0; */ /* margin: 0; */ /* top: 0; */ /* border: 0; */ /* height: 141%; */ /* width: auto; */ /* line-height: 130%; */ margin-top: 2px; max-width: 40vw; } .fhbox>div>div>div { display: table-cell; padding: 0; margin: 0; top: 0; /* border: 0; */ /* height: 0px; */ width: auto; padding-left: 5px; padding-right: 5px; } .headerfont { margin-top: 2px; margin-bottom: 1px; font-size: var(--headerfontsize); } .systemtitle{ /* margin-top: 2px; */ /* margin-bottom: 1px; */ font-size: var(--systemtitle); font-weight: bold; line-height: 120%; text-align:center; } .footerfont { font-size: var(--footerfontsize); } /*--Comment:
Required screen content wrapper ;*/ .screenarea { /*--Comment: weird! background should be here but does not work - placed under body made it work. ;*/ } /*--Comment: ol.Padding left does not work correctly when box rotate is applied - work to be done for this;*/ /*--Comment: first default incase class missing;*/ o_>ol:not(.ol1):not(.ol2):not(.ol3):not(.n0):not(.n1){list-style:var(--ol1-1);padding-left: var(--tab1);} ol.ol1{list-style:var(--ol1-1);padding-left: var(--tab1); text-indent:0;} ol.ol1>ol{list-style:var(--ol1-2);padding-left: calc( var(--tab2) - var(--tab1));} ol.ol1>ol>ol{list-style:var(--ol1-3);padding-left: calc(var(--tab3) - var(--tab2));} ol.ol1>ol>ol>ol{list-style:var(--ol1-4);padding-left: calc(var(--tab4) - var(--tab3));} ol.ol2{list-style:var(--ol2-1);padding-left: var(--tab1);} ol.ol2>ol{list-style:var(--ol2-2);padding-left: calc(var(--tab2) - var(--tab1));} ol.ol2>ol>ol{list-style:var(--ol2-3);padding-left: calc(var(--tab3) - var(--tab2));} ol.ol2>ol>ol>ol{list-style:var(--ol2-4);padding-left: calc(var(--tab4) - var(--tab3));} ol.ol3{list-style:var(--ol3-1);padding-left: var(--tab1);} ol.ol3>ol{list-style:var(--ol3-2);padding-left: calc(var(--tab2) - var(--tab1));} ol.ol3>ol>ol{list-style:var(--ol3-3);padding-left: calc(var(--tab3) - var(--tab2));} ol.ol3>ol>ol>ol{list-style:var(--ol3-4);padding-left: calc(var(--tab4) - var(--tab3));} /*--Comment: first default incase class missing;*/ o_>ul:not(.ul1):not(.ul2):not(.ul3){list-style:var(--ul1-1);padding-left: var(--tab1);} ul.ul1{list-style:var(--ul1-1);padding-left: var(--tab1);text-indent:0;} ul.ul1>ul{list-style:var(--ul1-2);padding-left: calc(var(--tab2) - var(--tab1));} ul.ul1>ul>ul{list-style:var(--ul1-3);padding-left: calc(var(--tab3) - var(--tab2));} ul.ul1>ul>ul>ul{list-style:var(--ul1-4);padding-left: calc(var(--tab4) - var(--tab3));} ul.ul2{list-style:var(--ul2-1);padding-left: var(--tab1);} ul.ul2>ul{list-style:var(--ul2-2);padding-left: calc(var(--tab2) - var(--tab1));} ul.ul2>ul>ul{list-style:var(--ul2-3);padding-left: calc(var(--tab3) - var(--tab2));} ul.ul2>ul>ul>ul{list-style:var(--ul2-4);padding-left: calc(var(--tab4) - var(--tab3));} ul.ul3{list-style:var(--ul3-1);padding-left: var(--tab1);} ul.ul3>ul{list-style:var(--ul3-2);padding-left: calc(var(--tab2) - var(--tab1));} ul.ul3>ul>ul{list-style:var(--ul3-3);padding-left: calc(var(--tab3) - var(--tab2));} ul.ul3>ul>ul>ul{list-style:var(--ul3-4);padding-left: calc(var(--tab4) - var(--tab3));} /*--Comment: Copy of above oln uln for use in menu edit only ;*/ ol.olx1{list-style:var(--olx1-1);padding-left: var(--tabx1);text-indent:0;} ol.olx1>ol{list-style:var(--olx1-2);padding-left: calc( var(--tabx2) - var(--tabx1));} ol.olx1>ol>ol{list-style:var(--olx1-3);padding-left: calc(var(--tabx3) - var(--tabx2));} ol.olx1>ol>ol>ol{list-style:var(--olx1-4);padding-left: calc(var(--tabx4) - var(--tabx3));} ol.olx2{list-style:var(--olx2-1);padding-left: var(--tabx1);} ol.olx2>ol{list-style:var(--olx2-2);padding-left: calc(var(--tabx2) - var(--tabx1));} ol.olx2>ol>ol{list-style:var(--olx2-3);padding-left: calc(var(--tabx3) - var(--tabx2));} ol.olx2>ol>ol>ol{list-style:var(--olx2-4);padding-left: calc(var(--tabx4) - var(--tabx3));} ol.olx3{list-style:var(--olx3-1);padding-left: var(--tabx1);} ol.olx3>ol{list-style:var(--olx3-2);padding-left: calc(var(--tabx2) - var(--tabx1));} ol.olx3>ol>ol{list-style:var(--olx3-3);padding-left: calc(var(--tabx3) - var(--tabx2));} ol.olx3>ol>ol>ol{list-style:var(--olx3-4);padding-left: calc(var(--tabx4) - var(--tabx3));} ul.ulx1{list-style:var(--ulx1-1);padding-left: var(--tabx1);text-indent:0;} ul.ulx1>ul{list-style:var(--ulx1-2);padding-left: calc(var(--tabx2) - var(--tabx1));} ul.ulx1>ul>ul{list-style:var(--ulx1-3);padding-left: calc(var(--tabx3) - var(--tabx2));} ul.ulx1>ul>ul>ul{list-style:var(--ulx1-4);padding-left: calc(var(--tabx4) - var(--tabx3));} ul.ulx2{list-style:var(--ulx2-1);padding-left: var(--tabx1);} ul.ulx2>ul{list-style:var(--ulx2-2);padding-left: calc(var(--tabx2) - var(--tabx1));} ul.ulx2>ul>ul{list-style:var(--ulx2-3);padding-left: calc(var(--tabx3) - var(--tabx2));} ul.ulx2>ul>ul>ul{list-style:var(--ulx2-4);padding-left: calc(var(--tabx4) - var(--tabx3));} ul.ulx3{list-style:var(--ulx3-1);padding-left: var(--tabx1);} ul.ulx3>ul{list-style:var(--ulx3-2);padding-left: calc(var(--tabx2) - var(--tabx1));} ul.ulx3>ul>ul{list-style:var(--ulx3-3);padding-left: calc(var(--tabx3) - var(--tabx2));} ul.ulx3>ul>ul>ul{list-style:var(--ulx3-4);padding-left: calc(var(--tabx4) - var(--tabx3));} /*--Comment: body section Numbering items may be explicitly numbered with nn. for Ordered list, only first
    is needed;*/ ol.n0,ol.n0>ol,ol.n0>ol>ol,ol.n0>ol>ol>ol,ol.n0>ol>ol>ol>ol,ol.n0>ol>ol>ol>ol>ol,ol.n0>ol>ol>ol>ol>ol>ol,ol.n0>ol>ol>ol>ol>ol>ol>ol { padding-left:0; list-style:none; } .n1, ol.n0>li{ text-indent: calc( -1 * var(--nnline2indent)) ; padding-left: calc( var(--nnfirstindent) + var(--nnline2indent) + ((1 - 1) * var(--nnindent))) ; list-style:none; } .n2, ol.n0>ol>li{ text-indent: calc( -1 * var(--nnline2indent)) ; padding-left: calc( var(--nnfirstindent) + var(--nnline2indent) + ((2 - 1) * var(--nnindent))) ; list-style:none; } .n3, ol.n0>ol>ol>li{ text-indent: calc( -1 * var(--nnline2indent)) ; padding-left: calc( var(--nnfirstindent) + var(--nnline2indent) + ((3 - 1) * var(--nnindent))) ; list-style:none; } .n4, ol.n0>ol>ol>ol>li{ text-indent: calc( -1 * var(--nnline2indent)) ; padding-left: calc( var(--nnfirstindent) + var(--nnline2indent) + ((4 - 1) * var(--nnindent))) ; list-style:none; } .n5, ol.n0>ol>ol>ol>ol>li{ text-indent: calc( -1 * var(--nnline2indent)) ; padding-left: calc( var(--nnfirstindent) + var(--nnline2indent) + ((5 - 1) * var(--nnindent))) ; list-style:none; } .n6, ol.n0>ol>ol>ol>ol>ol>li{ text-indent: calc( -1 * var(--nnline2indent)) ; padding-left: calc( var(--nnfirstindent) + var(--nnline2indent) + ((6 - 1) * var(--nnindent))) ; list-style:none; } .n7, ol.n0>ol>ol>ol>ol>ol>ol>li{ text-indent: calc( -1 * var(--nnline2indent)) ; padding-left: calc( var(--nnfirstindent) + var(--nnline2indent) + ((7 - 1) * var(--nnindent))) ; list-style:none; } .n8, ol.n0>ol>ol>ol>ol>ol>ol>ol>li{ text-indent: calc( -1 * var(--nnline2indent)) ; padding-left: calc( var(--nnfirstindent) + var(--nnline2indent) + ((8 - 1) * var(--nnindent))) ; list-style:none; } .printzone, .n0{ counter-reset: n1sec n2sec n3sec n4sec n5sec n6sec n7sec n8sec; list-style-type: none;} .n1, ol.n0>li {counter-reset: n2sec n3sec n4sec n5sec n6sec n7sec n8sec; list-style-type: none;} .n2, ol.n0>ol>li{counter-reset: n3sec n4sec n5sec n6sec n7sec n8sec; list-style-type: none;} .n3, ol.n0>ol>ol>li{counter-reset: n4sec n5sec n6sec n7sec n8sec;list-style-type: none;} .n4, ol.n0>ol>ol>ol>li{counter-reset: n5sec n6sec n7sec n8sec;list-style-type: none;} .n5, ol.n0>ol>ol>ol>ol>li{counter-reset: n6sec n7sec n8sec;list-style-type: none;} .n6, ol.n0>ol>ol>ol>ol>ol>li{counter-reset: n7sec n8sec;list-style-type: none;} .n7, ol.n0>ol>ol>ol>ol>ol>ol>li{counter-reset: n8sec;list-style-type: none;} .n1:after,.n2:after,.n3:after,.n4:after,.n5:after,.n6:after,.n7:after,.n8:after, ol.n0>li:after,ol.n0>ol>li:after,ol.n0>ol>ol>li:after,ol.n0>ol>ol>ol>li:after,ol.n0>ol>ol>ol>ol>li:after,ol.n0>ol>ol>ol>ol>ol>li:after,ol.n0>ol>ol>ol>ol>ol>ol>li:after,ol.n0>ol>ol>ol>ol>ol>ol>ol>li:after { content : var(--nnposttext); } .n1:before, ol.n0>li:before { counter-increment: n1sec; content: var(--nnpretext) counter(n1sec) var(--nnnumposttext); } .n2:before, ol.n0>ol>li:before { counter-increment: n2sec; content: var(--nnpretext) counter(n1sec) var(--nndigsep) counter(n2sec) var(--nnnumposttext); } .n3:before, ol.n0>ol>ol>li:before { counter-increment: n3sec; content: var(--nnpretext) counter(n1sec) var(--nndigsep) counter(n2sec) var(--nndigsep) counter(n3sec) var(--nnnumposttext); } .n4:before, ol.n0>ol>ol>ol>li:before { counter-increment: n4sec; content: var(--nnpretext) counter(n1sec) var(--nndigsep) counter(n2sec) var(--nndigsep) counter(n3sec) var(--nndigsep) counter(n4sec) var(--nnnumposttext); } .n5:before, ol.n0>ol>ol>ol>ol>li:before { counter-increment: n5sec; content: var(--nnpretext) counter(n1sec) var(--nndigsep) counter(n2sec) var(--nndigsep) counter(n3sec) var(--nndigsep) counter(n4sec) var(--nndigsep) counter(n5sec) var(--nnnumposttext); } .n6:before, ol.n0>ol>ol>ol>ol>ol>li:before { counter-increment: n6sec; content: var(--nnpretext) counter(n1sec) var(--nndigsep) counter(n2sec) var(--nndigsep) counter(n3sec) var(--nndigsep) counter(n4sec) var(--nndigsep) counter(n5sec) var(--nndigsep) counter(n6sec) var(--nnnumposttext); } .n7:before, ol.n0>ol>ol>ol>ol>ol>ol>li:before { counter-increment: n7sec; content: var(--nnpretext) counter(n1sec) var(--nndigsep) counter(n2sec) var(--nndigsep) counter(n3sec) var(--nndigsep) counter(n4sec) var(--nndigsep) counter(n5sec) var(--nndigsep) counter(n6sec) var(--nndigsep) counter(n7sec) var(--nnnumposttext); } .n8:before, ol.n0>ol>ol>ol>ol>ol>ol>ol>li:before { counter-increment: n8sec; content: var(--nnpretext) counter(n1sec) var(--nndigsep) counter(n2sec) var(--nndigsep) counter(n3sec) var(--nndigsep) counter(n4sec) var(--nndigsep) counter(n5sec) var(--nndigsep) counter(n6sec) var(--nndigsep) counter(n7sec) var(--nndigsep) counter(n8sec) var(--nnnumposttext); } /*--Comment: same as .n classess above, used for menu editing;*/ ol.nx0,ol.nx0>ol,ol.nx0>ol>ol { padding-left:0; list-style:none; } .nx1, ol.nx0>li{ text-indent: calc( -1 * var(--nxnline2indent)) ; padding-left: calc( var(--nxnfirstindent) + var(--nxnline2indent) + ((1 - 1) * var(--nxnindent))) ; list-style:none; } .nx2, ol.nx0>ol>li{ text-indent: calc( -1 * var(--nxnline2indent)) ; padding-left: calc( var(--nxnfirstindent) + var(--nxnline2indent) + ((2 - 1) * var(--nxnindent))) ; list-style:none; } .nx3, ol.nx0>ol>ol>li{ text-indent: calc( -1 * var(--nxnline2indent)) ; padding-left: calc( var(--nxnfirstindent) + var(--nxnline2indent) + ((3 - 1) * var(--nxnindent))) ; list-style:none; } .nx0{ counter-reset: nx1sec nx2sec nx3sec; list-style-type: none;} .nx1, ol.nx0>li {counter-reset: nx2sec nx3sec ; list-style-type: none;} .nx2, ol.nx0>ol>li{counter-reset: nx3sec ; list-style-type: none;} .nx3, ol.nx0>ol>ol>li{list-style-type: none;} .nx1:after,.nx2:after,.nx3:after ol.nx0>li:after,ol.nx0>ol>li:after,ol.nx0>ol>ol>li:after { content : var(--nxnposttext); } .nx1:before, ol.nx0>li:before { counter-increment: nx1sec; content: var(--nxnpretext) counter(nx1sec) var(--nxnnumposttext); } .nx2:before, ol.nx0>ol>li:before { counter-increment: nx2sec; content: var(--nxnpretext) counter(nx1sec) var(--nxndigsep) counter(nx2sec) var(--nxnnumposttext); } .nx3:before, ol.nx0>ol>ol>li:before { counter-increment: nx3sec; content: var(--nxnpretext) counter(nx1sec) var(--nxndigsep) counter(nx2sec) var(--nxndigsep) counter(nx3sec) var(--nxnnumposttext); } /*--Comment: Level section Numbering apply at t_ or d_ level but acts on o_;*/ .l1>o_, .l1>t_>o_{ text-indent: calc( -1 * var(--lnline2indent)) ; padding-left: calc( var(--lnfirstindent) + var(--lnline2indent) + ((1 - 1) * var(--lnindent))) ; } .l2>o_, .l2>t_>o_{ text-indent: calc( -1 * var(--lnline2indent)) ; padding-left: calc( var(--lnfirstindent) + var(--lnline2indent) + ((2 - 1) * var(--lnindent))) ; } .l3>o_, .l3>t_>o_{ text-indent: calc( -1 * var(--lnline2indent)) ; padding-left: calc( var(--lnfirstindent) + var(--lnline2indent) + ((3 - 1) * var(--lnindent))) ; } .l4>o_, .l4>t_>o_{ text-indent: calc( -1 * var(--lnline2indent)) ; padding-left: calc( var(--lnfirstindent) + var(--lnline2indent) + ((4 - 1) * var(--lnindent))) ; } .l5>o_, .l5>t_>o_{ text-indent: calc( -1 * var(--lnline2indent)) ; padding-left: calc( var(--lnfirstindent) + var(--lnline2indent) + ((5 - 1) * var(--lnindent))) ; } .l6>o_, .l6>t_>o_{ text-indent: calc( -1 * var(--lnline2indent)) ; padding-left: calc( var(--lnfirstindent) + var(--lnline2indent) + ((6 - 1) * var(--lnindent))) ; } .l7>o_, .l7>t_>o_{ text-indent: calc( -1 * var(--lnline2indent)) ; padding-left: calc( var(--lnfirstindent) + var(--lnline2indent) + ((7 - 1) * var(--lnindent))) ; } .l8>o_, .l8>t_>o_{ text-indent: calc( -1 * var(--lnline2indent)) ; padding-left: calc( var(--lnfirstindent) + var(--lnline2indent) + ((8 - 1) * var(--lnindent))) ; } /*--Comment: Testing lxR = Reset all counters lx and below - test in rows ;*/ /*.lxx { counter-reset: l1sec l2sec;}*/ .l0, .l1R{ counter-reset: l8sec l7sec l6sec l5sec l4sec l3sec l2sec l1sec ;} /* .l2R{ counter-reset: l8sec l7sec l6sec l5sec l4sec l3sec l2sec ;} .l3R{ counter-reset: l8sec l7sec l6sec l5sec l4sec l3sec ;} .l4R{ counter-reset: l8sec l7sec l6sec l5sec l4sec ;} .l5R{ counter-reset: l8sec l7sec l6sec l5sec ;} .l6R{ counter-reset: l8sec l7sec l6sec ;} .l7R{ counter-reset: l8sec l7sec ;} .l8R{ counter-reset: l8sec;} .l1>t_>o_:before {counter-reset: l2sec;} .l1>t_>o_:before {counter-increment: l1sec;}*/ /*.l1 { counter-reset: l2sec ;} .l2 { counter-reset: l3sec ;} .l3 { counter-reset: l4sec ;} .l4 { counter-reset: l5sec ;} .l5 { counter-reset: l6sec ;} .l6 { counter-reset: l7sec ;} .l7 { counter-reset: l8sec ;}*/ .l1 { counter-reset: l8sec l7sec l6sec l5sec l4sec l3sec l2sec ;} .l2 { counter-reset: l8sec l7sec l6sec l5sec l4sec l3sec ;} .l3 { counter-reset: l8sec l7sec l6sec l5sec l4sec ;} .l4 { counter-reset: l8sec l7sec l6sec l5sec ;} .l5 { counter-reset: l8sec l7sec l6sec ;} .l6 { counter-reset: l8sec l7sec ;} .l7 { counter-reset: l8sec ;} /*.l1>t_>o_ { counter-reset: l8sec l7sec l6sec l5sec l4sec l3sec l2sec ;} .l2>t_>o_ { counter-reset: l8sec l7sec l6sec l5sec l4sec l3sec ;} .l3>t_>o_ { counter-reset: l8sec l7sec l6sec l5sec l4sec ;} .l4>t_>o_ { counter-reset: l8sec l7sec l6sec l5sec ;} .l5>t_>o_ { counter-reset: l8sec l7sec l6sec ;} .l6>t_>o_ { counter-reset: l8sec l7sec ;} .l7>t_>o_ { counter-reset: l8sec ;}*/ .l1>t_>o_:before { counter-increment: l1sec; content: var(--lnpretext) counter(l1sec) var(--lnnumposttext); } .l2>t_>o_:before { counter-increment: l2sec; content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lnnumposttext); } /*.l1>t_>o_:before { counter-increment: l1sec;} .l2>t_>o_:before { counter-increment: l2sec;}*/ .l3>t_>o_:before { counter-increment: l3sec;} .l4>t_>o_:before { counter-increment: l4sec;} .l5>t_>o_:before { counter-increment: l5sec;} .l6>t_>o_:before { counter-increment: l6sec;} .l7>t_>o_:before { counter-increment: l7sec;} .l8>t_>o_:before { counter-increment: l8sec;} /*.l1>t_>o_:before { counter-increment: l1sec; counter-reset: l8sec l7sec l6sec l5sec l4sec l3sec l2sec ;} .l2>t_>o_:before { counter-increment: l2sec; counter-reset: l8sec l7sec l6sec l5sec l4sec l3sec ;} .l3>t_>o_:before { counter-increment: l3sec; counter-reset: l8sec l7sec l6sec l5sec l4sec ;} .l4>t_>o_:before { counter-increment: l4sec; counter-reset: l8sec l7sec l6sec l5sec ;} .l5>t_>o_:before { counter-increment: l5sec; counter-reset: l8sec l7sec l6sec ;} .l6>t_>o_:before { counter-increment: l6sec; counter-reset: l8sec l7sec ;} .l7>t_>o_:before { counter-increment: l7sec; counter-reset: l8sec ;} .l8>t_>o_:before { counter-increment: l8sec; }*/ .l1>t_>o_:after,.l2>t_>o_:after,.l3>t_>o_:after,.l4>t_>o_:after,.l5>t_>o_:after,.l6>t_>o_:after,.l7>t_>o_:after,.l8>t_>o_:after { content : var(--lnposttext); } /*.l1>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lnnumposttext); } .l2>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lnnumposttext); }*/ .l3>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lnnumposttext); } .l4>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lndigsep) counter(l4sec) var(--lnnumposttext); } .l5>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lndigsep) counter(l4sec) var(--lndigsep) counter(l5sec) var(--lnnumposttext); } .l6>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lndigsep) counter(l4sec) var(--lndigsep) counter(l5sec) var(--lndigsep) counter(l6sec) var(--lnnumposttext); } .l7>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lndigsep) counter(l4sec) var(--lndigsep) counter(l5sec) var(--lndigsep) counter(l6sec) var(--lndigsep) counter(l7sec) var(--lnnumposttext); } .l8>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lndigsep) counter(l4sec) var(--lndigsep) counter(l5sec) var(--lndigsep) counter(l6sec) var(--lndigsep) counter(l7sec) var(--lndigsep) counter(l8sec) var(--lnnumposttext); } /* .l1>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lnnumposttext); } .l2>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lnnumposttext); } .l3>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lnnumposttext); } .l4>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lndigsep) counter(l4sec) var(--lnnumposttext); } .l5>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lndigsep) counter(l4sec) var(--lndigsep) counter(l5sec) var(--lnnumposttext); } .l6>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lndigsep) counter(l4sec) var(--lndigsep) counter(l5sec) var(--lndigsep) counter(l6sec) var(--lnnumposttext); } .l7>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lndigsep) counter(l4sec) var(--lndigsep) counter(l5sec) var(--lndigsep) counter(l6sec) var(--lndigsep) counter(l7sec) var(--lnnumposttext); } .l8>t_>o_:before { content: var(--lnpretext) counter(l1sec) var(--lndigsep) counter(l2sec) var(--lndigsep) counter(l3sec) var(--lndigsep) counter(l4sec) var(--lndigsep) counter(l5sec) var(--lndigsep) counter(l6sec) var(--lndigsep) counter(l7sec) var(--lndigsep) counter(l8sec) var(--lnnumposttext); }*/ /*--Comment: identical to L above but for the default edit menu handling ;*/ .lx1{ text-indent: calc( -1 * var(--lxnline2indent)) ; padding-left: calc( var(--lxnfirstindent) + var(--lxnline2indent) + ((1 - 1) * var(--lxnindent))) ; } .lx2{ text-indent: calc( -1 * var(--lxnline2indent)) ; padding-left: calc( var(--lxnfirstindent) + var(--lxnline2indent) + ((2 - 1) * var(--lxnindent))) ; } .lx3{ text-indent: calc( -1 * var(--lxnline2indent)) ; padding-left: calc( var(--lxnfirstindent) + var(--lxnline2indent) + ((3 - 1) * var(--lxnindent))) ; } .lx0{ counter-reset: lx3sec lx2sec lx1sec ; } .lx1{ counter-reset: lx3sec lx2sec ; } .lx2{ counter-reset: lx3sec ; } .lx1:after,.lx2:after,.lx3:after { content : var(--lxnposttext); } .lx1:before { counter-increment: lx1sec; content: var(--lxnpretext) counter(lx1sec) var(--lxnnumposttext); } .lx2:before { counter-increment: lx2sec; content: var(--lxnpretext) counter(lx1sec) var(--lxndigsep) counter(lx2sec) var(--lxnnumposttext); } .lx3:before{ counter-increment: lx3sec; content: var(--lxnpretext) counter(lx1sec) var(--lxndigsep) counter(lx2sec) var(--lxndigsep) counter(lx3sec) var(--lxnnumposttext); } /*--Comment:
    fixed ;*/ /*.screenarea { background: var(--screenBackground) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }*/ .screenheaderbar { position: fixed; /*--Comment: set the header bar to fixed position at top of page ;*/ top: 0; width: 100%; height: var(--headerheight); } body{ background: var(--screenBackground) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .screenheader { /*--Comment: Depricated;*/ display: table; border-collapse:collapse; border-spacing:0; table-layout: fixed; width: 100%; vertical-align: top; margin: 0; padding: 0; margin-top: calc(-2 * var(--BorderLines)); } .actionmessage { font-weight: bold; white-space: nowrap; font-size: calc(var(--Frac13-12) * var(--systemsfontsize)); line-height: 100%; } .actionindicator { font-weight: bold; white-space: nowrap; font-size: calc(var(--Frac13-12) * var(--systemsfontsize)); line-height: 100%; } /*--Comment:
    is scrollable ;*/ /*--Comment: a button which may have a group of sub buttons that float right as a group;*/ .buttonsubbutton,.buttonsubbutton>div>* { background-color: #E6EDE6; border: 2px solid LightSteelblue; border-radius: 5px; margin: auto; padding: 1px; text-align: left; -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); line-height: 100%; margin-top: 3px; font-weight: bold; padding-left: 3px; word-break: break-word; max-width: 100%; width: 100%; white-space: normal; position:relative } .buttonsubbutton>div { display:inline-block; position:absolute; right: 20px; } .leftsidebar { display: block; width: var(--Navbarswidth); max-width: var(--Navbarswidth); /* height: var(--Deskdisplayzoneheight); */ /* height: var(--Deskdisplayzoneheight); */ /* margin-top: var(--VirtualDesktopBorderSize); */ /* margin-bottom: var(--footerheight);*/ vertical-align: top; /* border: 3px solid Steelblue; */ padding-left: 10px; /* position: absolute; */ top: var(--headerheight); overflow-y: auto; overflow-x: visible; z-index: 90; background-color: DeepSkyblue; padding: 2px; border: 3px solid steelblue; border-radius: 5px; /*font-weight: bold;*/ text-align: center; z-index: -1; font-size: calc(var(--Frac11-12) * var(--systemsfontsize));; /* width: 500;*/ max-height: calc(95vh - var(--top)); } .leftsidebar>p { text-decoration-line: none; display: inline-block; background-color: Skyblue; min-width: 90%; width: 90%; font-weight: bold; border: 3px solid LightSteelblue; border-radius: 5px; margin: 1px; padding: 2px; font-size: calc(var(--Frac13-12) * var(--systemsfontsize)); line-height: 120%; -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); } .leftsidebar>p:hover { background-color: #8080ff; } .adminbutton { text-decoration-line: none; display: inline-block; background-color: #FF9933; width: 250px; font-weight: bold; border: 3px solid LightSteelblue; border-radius: 5px; margin: 1px; margin-top: 5px; padding: 2px; font-size: calc(var(--Frac14-12) * var(--systemsfontsize)); line-height: 110%; -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); } .adminbutton:hover { background-color: #FF6600; } /*--Comment:
    is scrollable ;*/ .rightsidebar { /*display: inline-block;*/ /* width: var(--Navbarswidth); */ /* height: var(--Deskdisplayzoneheight); */ /* margin-top: var(--VirtualDesktopBorderSize); */ /*margin-bottom: var(--footerheight);*/ /* vertical-align: top; */ /* position: absolute; */ /*--Comment: set the header bar to fixed position ;*/ /* top: var(--headerheight); */ /* right: 0; */ overflow-y: hidden; background-color: DeepSkyblue; padding: 5px; border: 5px solid LightSteelblue; border-radius: 15px; font-weight: bold; text-align: center; font-size: calc(var(--Frac12-12) * var(--systemsfontsize));; z-index:75; } .rightsidebar > ul ,.rightsidebar > div { list-style: none; padding: 0; /* max-width: 230px; */ } .rightsidebar>ul>div>li,.rightsidebar>div>div>div { background-color: var(--actioniconcolor)--buttons2color; border: 3px solid LightSteelblue; border-radius: 5px; margin: 5px; margin-top: 5px; padding: 2px; /* font-weight: normal; */ /* font-size: calc(var(--Frac11-12) * var(--systemsfontsize)); */ --Comment: calc(var(--systemsfontsize) * var(--Frac11-12)); line-height: 105%; -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); white-space: normal; /* max-width: 230px; */ background-color: rgb(120,220,255); } .rightsidebar>div:not(.popupmenu)>div>div:hover { background-color: #caf1ce; } .menuboxes >div>bg_>btn_:hover{ background-color: #caf1ce; } .filedisplay:hover{ background-color: #10ff10; } .directorydisplay:hover{ background-color: #FFA500; } .filedisplay{ font-weight: normal; font-size: calc(var(--Frac11-12) * var(--systemsfontsize)); } .displaygroup{ /* border-collapse: collapse; */ /* border-spacing: 5px; */ /* border: var(--BorderLines); */ border-style: solid; border-width: 2px; border-color: steelblue; width: auto; border-radius: 5px; padding: 1px; margin: 2px; } .directorygrouplevel{ /* border-collapse: collapse; */ /* border-spacing: 5px; */ /* border: var(--BorderLines); */ border-style: solid; border-width: 0.25px; border-color: #a5a5a5; vertical-align: top; width: auto; background-clip: text; border-radius: 5px; } .filedisplay,.directorydisplay{ /*max-height:10px;*/ display: block; margin-left:7px; white-space: nowrap; overflow: visible; position: relative; width: auto; } .filedisplay>img,.directorydisplay>img { display: inline-block; width: 13px; /* height: 40px; */ /* max-width: 40px; */ /* max-height: 40px; */ margin-right: 2px; } .filedisplay>div,.directorydisplay>div { display: inline-block; width: auto; /* margin: auto; */ } .directorygrouplevel>.f_tgroup{ /*max-height:10px;*/ /* margin: auto; */ margin-left:10px; /* width: auto; */ } .directorygrouplevel>div>.directorygrouplevel{ /*max-height:10px;*/ margin-left:0px; } .bartitle { font-weight: bold; white-space: nowrap; border: 1px solid LightSteelblue; border-radius: 0; font-size: calc(var(--Frac12-12) * var(--systemsfontsize)); /*--Comment: var(--systemsfontsize);*/ -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0); -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0); box-shadow: 1px 2px 4px rgba(0, 0, 0, 0); display: inline-block; } .barmessage { font-weight: normal; font-size: calc(var(--Frac10-12) * var(--systemsfontsize)); line-height: 100%; } .elementdataname{ display: inline-block; border: solid 1px silver; position:relative; } .elementdataname>span{ border: solid 1px black; display: inline-block; min-width:50px; min-height:14px; position:relative; top:-1px; font-weight: bold; /* color: black; */ } .elementdataname>span:not(:empty):not(.namewarning){ background: #66ff66; } /*--Comment:
    fixed ;*/ .screenfooterbar { position: fixed; /*--Comment: set the header bar to fixed position ;*/ bottom: 0; width: 100%; height: var(--footerheight); border-top: 1px solid black; } /*--Comment: all Elements, in sequence to manage the display of pages and objects ;*/ /*--Comment: on device display, a scrollable zone in which the report page is to appear;*/ /*--Comment: margin control handles PLacement MUST be- top margin- in onepage Before any non zero height element bottom margin- in footer Before any non zero height element ! Note heades and footers are compulsory even if they only contain a zero height box in a row left margin- in onepage Before any non zero height element right margin- in first non empty row in onepage Last element in that row after all boxes ;*/ .marginmarkh { height:0; width:0; /* z-index: 9000; */ } .marginmarkh>img { position: relative; top: -15px; left: -30px; /* z-index: 5000; */ height: 30px; width: 30px; min-height: 30px; min-width: 30px; } .marginmarkv { height:0; width:0; /* z-index: 9;*/ } /*--Comment:right margin marker;*/ .row>.marginmarkv { height:0; width:0; position: relative; top: 0; left: var(--printareapagewidth); } .marginmarkv>img { position: relative; top: -30px; left: -16px; /* z-index: +1; */ height: 30px; width: 30px; min-height: 30px; min-width: 30px; } .screenpagezone { display: block; overflow-y: scroll; overflow-x: scroll; height: var(--Deskdisplayzoneheight); width: 100vw; margin-top: var(--VirtualDesktopBorderSize); background-color: var(--virtualDesktopcolor); border: var(--VirtualDesktopBorderSize) var(--VirtualDesktopBorderStyle); position: absolute; top: var(--headerheight); /* left: calc(var(--Navbarswidth) + 2px); */ z-index: 50; } .f_selectoptionlistitem { cursor:pointer; } /*--Comment: tab Management classes;*/ .tabdoc { position:relative; /*--Comment: contains a document ;*/ } .tabsetbuttons{ /*--Comment:manages the tab buttons display;*/ position: fixed; top: calc( var(--headerheight) - 1px); font-size: calc(var(--Frac11-12) * var(--systemsfontsize)); z-index: 200; max-width: calc( 100vw - 35px); /*--Note: Minus 30 px for scroll ba;*/ /* max-height: 70px; */ overflow-y: auto; margin-top: -2px; padding-top: 7px; /*direction:ltr;*/ /* min-height: 33px; */ height: 70px; } .tabbutton{ /* --Comment: individual tab button; */ display: inline-block; margin:0; background: silver; border-radius: 5px; border: 1px black solid; /* max-height: 35px; */ z-index:1600; position:relative; margin-right: 1px; } .tabtitle{ /* border: 1px black solid; */ max-width: 180px; padding-left:2px; padding-right:2px; max-height: 23px; overflow:hidden; white-space: pre-line; line-height: 100%; min-height: 15px; } .tabhighlight>.tabtitle { max-height: 34px; max-width: 180px; white-space: pre-wrap; /* overflow: unset; */ } .tabtitle:hover { max-height: none; max-width:180px; /* overflow: unset; */ /* height: unset; */ /* white-space: normal; */ } .tabtitle:hover, .tabbutton:hover { z-index: 1800; } .tabdocname{ /*--Comment: contains popup doc name;*/ position: fixed; background: #38ce38; padding-right: 3px; font-weight: NORMAL; } .tabdocname>x_,.tabdocname>span,.tabdocname>btn_ { margin: 1px; } .tabdocname>btn_{ display:block; width:70px; padding:1px; } .tabhighlight{ font-weight:bold; background: rgba(26, 255, 26, 0.95) !important; border: 2px black solid; z-index: 1700; /* max-height: 31px; */ margin-bottom: -19px; top: -7px; min-height: 26px; overflow: visible; /* height: 65px; */ } .htmldocload { /*--Comment:no formatting, use to load html files;*/ width: 200vw; /* --Comment: width to work with scroll bars when page is less than screen width; */ } #docbodyloader{ /*--Comment:no formatting, use to save html files;*/ } /*--Comment:displaypage the virtual page where the WHOLE report appears, control is zoom slider ;*/ .displaypage {/*--Comment: slider transform does not correctly allow zoom on top of first page, gets worse the more pages there are -< to fix ;*/transform: matrix(var(--SliderDocSize), 0, 0, var(--SliderDocSize), 0, 0);margin:5px;margin-top: 200px;margin-bottom: 200px;transform-origin: left top;position:relative;/*--Comment: new to ensure outline in correct location;*/display: inline-block;margin-left: 15%;margin-right: 15%;/* text-align: center; */box-shadow: none;} .reportcontainer { /*--Comment: used as primary reference for "is this A document?", used for saving Reports and templates;*/ /*--Comment: use system defaults for fonts etc, when user sets his standards they should be as classes attached to the report container * /*position:relative;*/ /*--Comment: new to ensure outline in correct location;*/ display: inline-block; margin: 0 auto; /* comment: vertical-align = top default here and inhertited unless; */ /* vertmiddle or vert bottom class is set */ vertical-align: top; } /*--Comment: area of the virtual paper page where print is permitted ;*/ /*--Comment: page length is done by .Paper ;*/ .printzone { /*--Comment: container to set paper width for display and printing and position on display width ways;*/ /*opacity: 1.0;*/ /*--Comment:IE forced fallback;*/ /*width: 17.5cm; min-width: 17.5cm; max-width: 17.5cm; width: var(--printareapagewidth); min-width: var(--printareapagewidth); max-width: var(--printareapagewidth); margin: auto;*/ /*--Comment: new to ensure outline in correct location;*/ margin: 0 auto; display: inline-block; } /*:not(.popupmenu)*/ .docsection { /*--Comment: repeatable, three varieties - No data source = text , datasource(Master) = first record and dfines layout, datasourceSlave, = all subsequent reocrds in this section ;*/ /* display:block; was table;*/ border-collapse:collapse; border-spacing:0; /* width: 100%;*/ /*--Comment: new to ensure outline in correct location;*/ display: block; margin: 0 auto; position: relative; } .SecMaster {/*--Comment: identifies this DocSection as a master = this is the section used to define and generate the slaves (one for each record key Result);*/ } .SecSlave { /*--Comment: Do not Save when writing a Report/template ONLY use master for templates;*/ } .docsection>div.paperpage.letterhead{ /*background-image: var(--letterheadImage) !important;*/ /*--Comment:on going chrome bug for atleast 4 years;*/ /*--Comment:workaround, ad letter head class AND add style :*/ /*background-image: url(stdletterhead.jpg);*/ /*background-position: center;*/ background-image: url('stdletterhead.jpg'); background-repeat: no-repeat; background-size: var(--physicalpagewidth) var(--physicalpageheight); background-position: calc(-1 * var(--marginleft)) calc(-1 * var(--margintop)); } /*--Comment: testing for onepageBackgound - using letterhead only as a test RULE- letter head is NEVER printed (To Change, user may want to print) user background is added as inline style background-image= url(usersBackground.jpg) to avoid chrove var bug ad must add pageBackground class to correctly set page alignment ;*/ .docsection>div.paperpage.pageBackground { background-repeat: no-repeat; background-size: var(--physicalpagewidth) var(--physicalpageheight); background-position: calc(-1 * var(--marginleft)) calc(-1 * var(--margintop)); } .pagebreak { /*--Comment: a marker on a row container used by the paging algorithms to forcably move items after this one to a new page. DO NOT USED CSS page BREAK ;*/ } .pagebreak:after { /*--Comment: a visible marker to show page break After row -- do not print;*/ content: 'new page'; left: calc(-1 * var(--marginleft) + 5px ); bottom: 0; width: calc(var(--physicalpagewidth) - 10px); display: block; position: absolute; height: 1px; outline: rgba(255,0,0,0.5) solid 1px; font-size: 20px; white-space: pre; opacity: 0.5; font-family: serif; text-align: center; } .pagebreak:after:hover { content: 'new Click To Remove Page Break page'; } /*:not(.popupmenu)*/ .docsection>.paperpage {/*--Comment: physical Paper space, container for printable area and headers and footers;*//*--Comment:IE fallbacks A4;*/width: 21cm;min-width: 21cm;max-width: 21cm;min-height: 29.7cm;height: 29.7cm;max-height: 29.7cm;width: var(--physicalpagewidth);min-width: var(--physicalpagewidth);max-width: var(--physicalpagewidth);min-height: var(--physicalpageheight);height: var(--physicalpageheight);max-height: var(--physicalpageheight);/*overflow: visible;*/background: var(--papercolor);/*--Comment: paper is white;*/box-shadow: 2px 8px 12px 0 rgba(0, 0, 0, 0.5), 2px 6px 20px 0 rgba(0, 0, 0, 0.7);padding: 0;margin: 0;page-break-after: always;page-break-inside: avoid;/*--Comment: the "Paper margins show in color => nonprintareaPapercolor;*//*--Comment: header and footers DO show in these "non print" araeas;*/border-top: var(--margintop) var(--nonprintareaPapercolor) solid;border-bottom: var(--marginbottom) var(--nonprintareaPapercolor) solid;border-left: var(--marginleft) var(--nonprintareaPapercolor) solid;border-right: var(--marginright) var(--nonprintareaPapercolor) solid;display: block;position: relative;} .docsection.popupmenu,.docsection.popupmenu>.paperpage { /* width: 5cm;*/ min-height: calc( var(--popupmenudocsectionminheight) + var(--virtualrowspacerheight) *2 + 5px); /* padding: 20px; */ } .docsection.popupmenu>.paperpage { /* width: 5cm; */ min-width: 5cm; /* max-width: 5cm;*/ min-height: var(--popupmenudocsectionminheight); /* height: 5cm;*/ /* max-height: 5cm;*/ width: var(--physicalpagewidth); /* min-width: var(--physicalpagewidth); */ /* max-width: var(--physicalpagewidth); */ /* min-height: 5cm;*/ /* height: auto;*/ /* max-height: unset;*/ /* overflow: auto; */ background: white; box-shadow: 2px 8px 12px 0 rgba(0, 0, 0, 0.5), 2px 6px 20px 0 rgba(0, 0, 0, 0.7); padding: 0; margin: 0; /* page-break-after: always;*/ /* page-break-inside: avoid;*/ /* border-top: var(--margintop) var(--nonprintareaPapercolor) solid;*/ /* border-bottom: var(--marginbottom) var(--nonprintareaPapercolor) solid;*/ /* border-left: var(--marginleft) var(--nonprintareaPapercolor) solid;*/ /* border-right: var(--marginright) var(--nonprintareaPapercolor) solid;*/ display: block; /* --physicalpagewidth: 10cm; */ --physicalpageheight: 24cm; } .paperpage:after { background-color:rgba(226,189,151,0.5); height: 2.4mm; width: var(--physicalpagewidth); content: ' '; display: block; position: relative; bottom: 2mm; font-size: 0; left: calc( -1* var(--marginleft)); text-align: center; } .docsection.popupmenu>.paperpage:after { width: auto; left: 0; height: 0; bottom: 0; } /*--Comment: the space where docuemnt printable content goes;*/ .docsection>.paperpage>.onepage { /*:not(.popupmenu)*/ width: 17.4cm; min-width: 17.4cm; max-width: 17.4cm; height: 25cm; width: var(--printareapagewidth); min-width: var(--printareapagewidth); max-width: var(--printareapagewidth); height: var(--printareapagelength); min-height: var(--printareapagelength); max-height: var(--printareapagelength); display: block; } .docsection>.paperpage:not(.landscape)>.onepage { /*:not(.popupmenu)*/ /*--test: only for testing page Print rotation;*/ width: 17.4cm; min-width: 17.4cm; max-width: 17.4cm; height: 25cm; width: var(--printareapagewidth); min-width: var(--printareapagewidth); max-width: var(--printareapagewidth); height: var(--printareapagelength); min-height: var(--printareapagelength); max-height: var(--printareapagelength); } .docsection>.paperpage.landscape>.onepage { /*:not(.popupmenu)*/ /*--test: only for testing page Print rotation;*/ width: var(--printareapagewidth); min-width: var(--printareapagewidth); max-width: var(--printareapagewidth); height: var(--printareapagelength); min-height: var(--printareapagelength); max-height: var(--printareapagelength); /* width: var(--printareapagelength); */ /* min-width: var(--printareapagelength); */ /* max-width: var(--printareapagelength); */ /* min-height: var(--printareapagewidth); */ /* max-height: var(--printareapagewidth); */ /* height: var(--printareapagewidth); */ /* display: block; */ /* --w3: 21cm; */ /* width: var(--w3); */ /* min-width: 5cm; */ /* max-width: var(--w3); */ /* --h3: 29.7; */ /* height: var(--h3); */ /* min-height: 5cm; */ /* max-height: var(--h3); */ } .docsection.popupmenu>.paperpage>.onepage { min-height: 5cm; /* overflow: visible; */ min-width: 5cm; } .onepage,.pageheader,.pagefooter{ position:relative; } .pageheader{ /*--Comment: header layout on a paper page;*/ position: relative; top: calc( ( -1 * var(--margintop) ) + 1px ); display: block; height: 0; --commnet: page header is set to hight 0 so that Pagebody margin is correct. To measure PageHeadersize, add class autoheight temporarily; /* z-index: 999; */ } .pageheader>.row,.pagefooter>.row{ background-color:rgba(255,255,255,0.5); } .pagefooter{ /*--Comment: footer layout on a paper page;*/ display: block; height: var(--marginbottom); } /*--Comment: HeaderFootMsg is used for header and footer to put a flaoting tag in the left margin to indicate items is a header or footer;*/ .headerfootmsg { position: relative; left: -10px; top: 3px; display: block; height: 0; width: 0; transform: rotate(90deg); } .headerfootmsg>div { background: rgba(255,255,0,0.5); font-size: calc(var(--Frac11-12) * var(--systemsfontsize)); display: inline; white-space: nowrap; font-weight: bold; } .pagespace:after { /*--Comment: an empty div between Other page containers purely for screen display of pages;*/ /* background: transparent;*/ /* width: 842px;*/ content: ' '; display: block; height: 40px; } /*--Comment: use to create a full width row of boxes all equally sized works for 1 or more boxes ;*/ /*--Comment: box row wrappers if boxes must be equal sized use .boxrowfixed if boxes can auto size to spread contents (actually white space of first row is equalized) then use .boxrowloose);*/ /* .row and box must have pseudo class to allow format to behave if object is inside a real box noting class row and object box cannot be used inside a document box so div with pseudoclass must be used instead*/ .row, .pseudorow{ position:relative; width: 100%; } .row.f_linkastablecolumns{ position:relative; width: fit-content; } .boxrowfixed { display:table; border-collapse:collapse; border-spacing:0; table-layout: fixed; width: 100%; /* vertical-align: top; Inherited from reportcontainer*/ margin: 0; padding: 0; margin-top: calc(-2 * var(--BorderLines)); max-width: var(--printareapagewidth); /*--Comment: To prevent overflow of one row upsetting other rows;*/ } .boxrowfixed>box { display:table-cell; } .boxrowloose { display: table; border-collapse:collapse; border-spacing:0; table-layout: auto; width: 100%; /* vertical-align: top; Inherited from reportcontainer*/ margin: 0; padding: 0; margin-top: calc(-2 * var(--BorderLines)); max-width: var(--printareapagewidth);/*--Comment: To prevent overflow of one row upsetting other rows;*/ position: relative; /* vertical-align: inherit; */} .boxrowloose>box { display:table-cell; } .boxrowfloat { display: table; border-collapse:collapse; border-spacing:0; table-layout: auto; width: 100%; /* vertical-align: top; Inherited from reportcontainer*/ margin: 0; padding: 0; margin-top: calc(-2 * var(--BorderLines)); max-width: var(--printareapagewidth);/*--Comment: To prevent overflow of one row upsetting other rows;*/ position:relative; /*background-image: url('grid19x24cm.png');*/ /*background-size: 19cm 24cm;*/ } .boxrowfloat>box { display:inline-block; position:absolute; } .boxrowleft { /*--Comment: this class is not really needed as it can be acheived by inserting "empty borderless boxes" ;*/ display: inline-block; /* vertical-align: top; Inherited from reportcontainer*/ white-space: nowrap; width: 100%; max-width: var(--printareapagewidth);/*--Comment: To prevent overflow of one row upsetting other rows;*/ } .boxrowleft>box { display:table-cell; } c_{ /*--Comment: our document comments container;*/ position: absolute; /*left: 99.9%;*/ right: -190px; top: -5px; /* width:0;*/ /* height:0;*/ min-width: 190px; overflow:visible; display:block; z-index:1600; text-align: initial; text-align-last: initial; } cc_ { /*--Comment: Our Document Comment Content - not sub sub content is cb_(body) cr_(response) cs_(status) ;*/ /*background-color: #E6EDE6;*/ background-color: rgb(230,230,230); opacity: 0.75; border: 2px solid LightSteelblue; border-radius: 5px; text-align: left; -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); font-size: calc(var(--Frac12-12) * var(--systemsfontsize)); line-height: 110%; vertical-align: top; width:185px; min-height:20px; display:inline-block; white-space: pre-wrap; min-width: 100px; position:relative; } cc_:hover { opacity: 1; } cb_,cr_,cs_ { display: block; position: relative; border: silver solid 1px; } cb_>o_,cr_>o_,cs_>o_,nc_>o_{ min-height:10px; } c_>cc_>cb_:hover,c_>cc_>cr_:hover,c_>cc_>cs_:hover ,c_.showlabels>cc_>cb_,c_.showlabels>cc_>cr_,c_.showlabels>cc_>cs_{ background: rgba(51,255,153,0.9); } c_>cc_>cb_:hover:before,c_>cc_>cr_:hover:before,c_>cc_>cs_:hover:before,c_.showlabels>cc_>cb_:before,c_.showlabels>cc_>cr_:before,c_.showlabels>cc_>cs_:before { position: absolute; width: 67; left: -67px; background-color: rgba(51,255,153,0.9); border: 2px solid LightSteelblue; border-radius: 5px; display: inline; z-index: -1; top: -2px; font-weight:bold; } c_>cc_>cb_:hover:before,c_.showlabels>cc_>cb_:before{ content: 'Comment:'; } c_>cc_>cr_:hover:before,c_.showlabels>cc_>cr_:before{ content: 'Response:'; } c_>cc_>cs_:hover:before ,c_.showlabels>cc_>cs_:before { content: 'Status:'; } .reportcontainer.printcomments>.printzone>.docsection>.paperpage>div { /*--Comment: rescale to fit comments beside the rows => apply with Class=;*/ transform: matrix(0.85, 0, 0, 1, -48 , 0); /*--Comment: x scale 85%, y scale 100% offset to reallign left page side - note this is for a4 portrait;*/ } n_ { /*--Comment: Our Document Note container ;*/ position: absolute; /*opacity: 0.9;*/ /* height: 0;*/ /* width: auto; */ display: block; top: 10px; left: 50px; z-index:1500; /*--Comment: must be infont of boxes and comments;*/ text-align: initial; text-align-last: initial; } nc_ { /*--Comment: Our Document Note Content;*/ background: rgb(255, 255, 200); opacity: 0.95; min-width: 100px; min-height: 50px; box-shadow: 2px 8px 12px 0 rgba(150, 150, 0, 0.5), 2px 6px 21px 0 rgba(200, 200, 0, 0.7); padding: 0; /*position: relative;*/ display: block; white-space: pre-wrap; padding: 2px; position:relative; z-index:1502; border: rgba(255,255,0,0.9) solid 5px; /* outline-offset: -3px; */ } nc_:hover { opacity: 1; } nc_>o_ { position:relative; z-index:1503; } /* --BOXISHERE: "BOX Definition is here";*/ box, .pseudobox { padding: 0; border: var(--BorderLines) transparent; white-space: normal; /*--Comment: pre-wrap ??-- no => done in subsub object o_ ;*/ display: table-cell; /*--Comment:now set by rowtype to accomodate float;*/ /* vertical-align: top; Inherited from reportcontainer*/ position:relative; width: auto; table-layout: fixed; vertical-align: inherit;} box:hover,box:hover>t_,box:hover>d_ ,t_:hover,d_:hover{ /*--Comment: ensure our desired box is front most to prevent ;*/ /*--Comment: accidental activation of overlapped boxes;*/ /*--Comment: in box float and in animations, overlaps can occur ;*/ /*--Comment: menu m_ is index 2800, box stays behind that;*/ z-index: 2840; } box:active,box:active>.t_,box:active>d_,t_:active,d_:active { z-index: 2780; } c_:hover,n_:hover,.svgtag:hover,m_:hover { z-index: 2850; } c_:active,n_:active,.svgtag:active,m_:active { z-index: 2890; } /*t_:empty:focus, d_:focus:empty,t_>o_:empty:focus, d_t>o_:focus:empty,t_:focus:empty, d_:empty:focus,t_>o_:focus:empty, d_t>o_:empty:focus{ content: "edit me..";*/ /*--Comment: does not work;*/ /*}*/ t_{ /* min-width: var(--TitleWidthControl); */ comment: "set --TitleWidthControl in a box, row,page or section "; comment: "to contol together, MUST be in % default is 6%"; /* width: var(--TitleWidthControl); */ /* min-width: 18%; */ /* width: 6%; */ } d_{ /*min-width: 50%;*/ /* width: 50%; */ /* width:calc(100% - var(--TitleWidthControl)); */ } t_,d_ { margin: 0; padding: 0; border: 0; /*--Comment: dfault to all visible elements os border 1px solid transparent thus only color is needed to make a border;*/ /* vertical-align: top; Inherited from reportcontainer*/ /* padding-left: 1px; */ /* padding-right: 1px; */ background-color: unset; letter-spacing: normal; word-spacing: normal; text-transform: none; text-indent:0; text-shadow: none; /* line-height: var(--docdefaultLineheight); */ display: table-cell; width: auto; /* margin: auto; */ /* min-width: 14%; */ /* display: block; */ } .toptitleblk>t_,.toptitleblk>d_{ display: block; width: 100%; } .toptitleblk>t_>o_,.toptitleblk>d_>o_{ width: 100%; display: inline-block;} o_{ display: block; white-space: pre-line; word-break: break-word; -webkit-line-break: after-white-space; width: auto; margin: auto; position: relative; overflow-wrap: break-word; border: 0; min-width: 15px; } textarea{ /*--comment : Not used text area does not grow with content;*/ font-style:inherit; font-variant-ligatures: inherit; font-variant-caps: inherit; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: inherit; font-stretch: inherit; font-size:inherit ; font-family: inherit; text-rendering: inherit; color:inherit; letter-spacing: inherit; word-spacing: inherit; line-height: inherit; text-transform: inherit; text-indent: inherit; text-shadow: inherit; /* display: inherit; */ text-align: inherit; appearance: inherit; -webkit-rtl-ordering: inherit; cursor: inherit; white-space: inherit; overflow-wrap: inherit; background-color: inherit; column-count: initial !important; margin: inherit; border-width: inherit; border-style: inherit; border-color: inherit; border-image: inherit; padding: inherit; display: inline-block; /* white-space: pre-line; */ word-break: break-word; -webkit-line-break: after-white-space; width: 100%; height: 100%; /* margin: auto; */ position: relative; /* overflow-wrap: break-word; */ border: 0; min-width: inherit; overflow: visible; resize: vertical; } d_>o_{ text-indent: var(--firsttextindent); min-height: 10px; padding-bottom: var(--SpaceBetweenParagraphs); width: 100%; margin: auto; } o_> p, o_ > a, o_> span, o_ > tbody, o_ > blockquote , span{ margin:0; padding:0; border:0; /* vertical-align: text-bottom; */ } /*--Comment:***********t_o_******;*/ /*--Comment:t_>o_:empty:not(:focus), d_>o_:empty:not(:focus), o_:empty:not(:focus), t_:empty:not(:focus);*/ box:not(.dragoverdest):not(.toptitleblk)>t_>o_:empty:not(:focus):not(:hover):not(.thisobjectiseditable):not(.relatedobjectiseditable){ display:none; visibility: hidden; overflow: hidden; width: 0; height: 0; } .row.suppresstitle>div>box>t_{ display:none; height: 0; width: 0; } .row.suppresstitle>div>box>d_{ display: inline-block; width: 100%; height: auto; } .row.suppressdata>div>box>d_{ display:none; height: 0; width: 0; } .row.suppressdata>div>box>t_{ display: inline-block; width: 100%; } .row:not(.suppresstitle)>div>box>t_>o_:empty:focus{ /*display:inline-block;*/ content: ""; min-width:10px; } .row:not(.suppresstitle)>div>box:not(.boxcannotedit)>t_:not(.boxcannotedit)>o_:not(.boxcannotedit):empty:hover:not(focus){ /*display:inline;*/ /* overflow-x: visible;*/ font-style: italic; content: "Click to edit"; } /* more work needed here,on Title spearator visibility and on when the edit title and data messages show */ /* p>box when in the menu!*/ .row:not(.suppresstitle)>div>box:not(.ftja)>t_>o_:not(:empty):after,p>box:not(.ftja)>t_>o_:not(:empty):after{ content: var(--titledefaultSeparator); } /* Space needed after separator when using justification*/ .row:not(.suppresstitle)>div>box.ftja>t_>o_:not(:empty):after,p>box.ftja>t_>o_:not(:empty):after{ content: var(--titledefaultSeparator) " "; } /***********d_o_******;*/ box:hover>d_>o_:empty:not(:focus){ /* display:none;*/ /*visibility: hidden;*/ /*overflow: hidden;*/ /*height:0px;*/ /*width:0px;*/ /*min-height:0px;*/ /*min-width:20px;*/ /*content: " ";*/ /*max-height:0px;*/ /*max-width:0px;*/ /*line-height:0;*/ /*margin0;*/ /*padding0;*/ /*border0;*/ /*letter-spacing: normal;*/ /*word-spacing: normal;*/ /*text-transform: none;*/ /*text-indent:0;*/ /*text-shadow: none;*/ } d_>o_:empty:focus{ /*display:inline-block;*/ xmin-width:20px; } box:not(.dragndrop):hover>d_>o_:empty:not(:focus):before{ /*display:inline;*/ xoverflow-x: visible; xfont-style: italic; xcontent: "Click to edit data"; } box:hover>d_>o_:empty:focus{ /*display:inline;*/ /* overflow-x: visible;*/ xmin-width:30px; } XX.row:not(.suppressdata)>div>box:not(.dragndrop):not(.boxcannotedit):hover>d_:not(.boxcannotedit)>o_:not(.boxcannotedit):empty:not(:focus):after{ /* display:table-row; */ display:inline-block; position:absolute; overflow-x: visible; white-space:nowrap; font-style: italic; top: -1px; content: var(--insertdatamessage); background: whitesmoke; left: 5px; /*--Comment: left arrow double lined;*/ } d_>o_[contenteditable="true"]:empty:not(:focus):after{ display:inline-block; position:absolute; overflow-x: visible; white-space:nowrap; font-style: italic; top: -1px; content: var(--insertdatamessage); background: whitesmoke; left: 5px; /*--Comment: left arrow double lined;*/ } f_:not(.dragndrop):not(.boxcannotedit):hover>d_:not(.boxcannotedit)>o_:not(.boxcannotedit):empty:not(:focus):after{ display:inline-block; position:absolute; overflow-x: visible; white-space:nowrap; font-style: italic; top: -1px; content: var(--insertdatamessage); background: whitesmoke; left: 5px; /*--Comment: left arrow double lined;*/ } f_docvar:not(.dragndrop):hover>d_>o_:not(.boxcannotedit):empty:not(:focus):after{ display:inline-block; position:absolute; overflow-x: visible; white-space:nowrap; font-style: italic; top: -1px; content: var(--insertdatamessage); background: whitesmoke; left: 5px; /*--Comment: left arrow double lined;*/ } .row:not(.suppresstitle)>div>box:not(.dragndrop):not(.boxcannotedit):hover>t_:not(.boxcannotedit)>o_:not(.boxcannotedit):empty:not(:focus):after{ display:inline-block; /*position:absolute;*/ overflow-x: visible; white-space:nowrap; font-style: italic; top: -1px; content: '\21D0 insert title'; background: whitesmoke; left: 5px; /*--Comment: left arrow double lined;*/ } box:hover>d_>o_:empty:focus:after{ /*display:inline;*/ /* overflow-x: visible;*/ /*min-width:30px;*/ content: ''; } box:hover>t_>o_:empty:focus:after{ /*display:inline;*/ /* overflow-x: visible;*/ /*min-width:30px;*/ content: ''; } /*--Comment:new objects to integrate back;*/ bg_ { /*--Comment:button group float right;*/ display: inline-block; /* position: relative; */ vertical-align: middle; margin: 0; padding: 0; right: 1px; top: 1px; /* height: auto; */ /* width: auto; */ /* min-height: 35px; */ } p>bg_,span>bg_{/*--Comment: special adust if inside P or span;*/ } /*--Comment:classes for bg_;*/ .bg_l{/*--Comment:float left ;*/ float: left; } /*--Comment:bg_>x_, bg_>btn_, bg_>span, bg_>div,bg_>au_,bg_>ad_,bg_>ay_,bg_>an_ {;*/ bg_>span, bg_>div{ position: relative; margin:0; padding:0; margin-left: 2px; margin-right: 2px; padding-right: 2px ; padding-left: 2px ; } bg_>input{ display: inline-block; vertical-align: middle; margin: 0; padding: 0; right: 1px; top: 1px; } bg_:not(.bgvert)>span, bg_:not(.bgvert)>div { display: block; } bg_.bgvert>span, bg_.bgvert>div, bg_.bgvert>btn_ { display: block; margin:2px; line-height: 165%; } bg_.bghover>btn_:hover { background-color: #16ED16; } .pseudotable { display: table !important; } .pseudotable>div { display: table-cell !important; } #filemenurightclickid>div>div,#filemenurightclickid>div { /* padding:0; */ margin: auto; /* line-height: 120%; */ border: none; /* width:auto; */ } #filemenurightclickid>div>div>div { /* display: block; */ /* line-height: 95%; */ /* padding:0; */ /* margin:0; */ /* border: solid grey 0.25px; */ } #filemenurightclickid>div>div>div>span, #filemenurightclickid>div>div>bg_ { min-width:80px; /* display:inline-block; */ /* line-height: 95%; */ /* padding:0; */ /* margin:0; */ /* border : none; */ } .displayfilename,.displaydirname,.displayfilenameold,.displayreportname { text-align: left; left: 20px; margin: auto; min-width: 240px; padding:3px; font-weight: normal; border: solid 1px silver; } .displayfilename,.displaydirname,.displayreportname { background-color: var(--filenamecolor); } .displaydirname::before { display:inline-block; content: "Dir Name: "; background-color: rgb(230, 230, 230); font-weight: bold; min-width:70px; white-space: pre-wrap; max-width: 70px;uadj } .displayreportname::before { display:inline-block; content: "Report Name: "; background-color: rgb(230, 230, 230); font-weight: bold; min-width: 90px; white-space: pre-wrap; max-width: 90px; } .displayfilename::before { display:inline-block; content: "File Name: "; background-color: rgb(230, 230, 230); font-weight: bold; min-width:70px; white-space: pre-wrap; max-width: 70px; } .displayfilenameold::before { display:inline-block; content: "Previous File Name:"; background-color: rgb(230, 230, 230); font-weight: bold; min-width:70px; white-space: pre-wrap; max-width: 70px; } .displayfilenumber { background-color: rgb(255, 255, 210); text-align: left; padding:3px; font-weight: normal; } .displayfilenumber::before { content: "File Num : "; background-color: rgb(230, 230, 230); font-weight: bold; } #filemenurightclickid.popupmenu>div.displayfilename[contenteditable="true"],#filemenurightclickid.popupmenu>div.displaydirname[contenteditable="true"],#filemenurightclickid.popupmenu>div.displayfilenumber[contenteditable="true"] { /* border: 1px solid black; */ /* border-radius: 5px; */ outline-style: dashed; outline-color: black; outline-offset: -3px; outline-width: 2px; } .tabdoc>.popupmenu>div.displayfilename[contenteditable="true"]{ outline-style: dashed; outline-color: black; outline-offset: -3px; outline-width: 2px; } btn_ { /*--Comment: a basic control button;*/ position: relative; margin: 0; margin-left: 2px; margin-right: 2px; display: inline-block; background-color: #E6EDE6; /* border: 2px solid LightSteelblue; NOTE no border results in correct vertical alignments when inline;*/ border-radius: 3px; padding: 0; text-align: center; -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0,0.95); -webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); box-shadow: 1px 2px 4px rgba(0, 0, 0, .95); /* line-height: 100%; */ padding-right: 2px; padding-left: 2px; vertical-align: middle; } btn_.state{ border-width:3px; } btn_.state[data-state="in"],btn_.state[data-state="on"],btn_.state[data-state="true"],btn_.state[data-state="1"],btn_.state[data-state="yes"]{ border-style:inset; } btn_.state[data-state="out"],btn_.state[data-state="off"],btn_.state[data-state="false"],btn_.state[data-state="0"],btn_.state[data-state="no"]{ border-style:outset; } x_,au_,ad_,al_,ar_,ay_,an_,i_,s_,u_,clr_, bsp_, re_ {/* --comment: x_ delete, au_ up arrow, ad down arrow, ay is tick, an is cross, i_ is information (question mark) s_ is Setting, u_ is dev user set, clr_ is Clear or delete, bsp_ is a button space re_ is Refresh/recycle;*/position: relative;margin: 0;margin-left: 1px;margin-right: 1px;padding: 0;padding-left: 2px;padding-right: 3px;font-weight: bold;width: auto;display: inline-block;text-align: center;/*font-family: "verdana";*/border-radius: 5px;min-height: 16px;min-width: 15px;font-size: 12px;/*padding-top: 0px;*/height: 15px;line-height:100%;/* top: 0px ;*/vertical-align: middle;padding-top: 2px;/* padding-bottom: 0px;*/max-width: 18px;} x_ { background-color: red; cursor: url(Delete.png) 12 12, auto; } i_ { background-color: #15ff00; cursor: help; } u_ { background-color: deepskyblue; cursor: pointer; } /*--Comment:naming of a html action item axy_ a=action, xy specified _ required;*/ au_,ad_,al_,ar_,ay_,an_,aua_,ada_,s_,clr_,re_ { background-color: gold;/*#ffc174;*/ cursor: pointer; } x_:after { content: "\2716";} i_:after { content: "\2047";} an_:after {content: "\2718";/* top: 0px; *//* position: relative; */}/*--Comment: action NO = cross;*/ ay_:after {content: "\2714";/* top: 0px; *//* position: relative; */}/*--Comment: action Yes = tick;*/ au_:after { content: "\25b2";}/*--Comment: action up triangle;*/ ad_:after {content: "\25bc";}/*--Comment: action down triangle;*/ ar_:after { content: "\25b6";}/*--Comment: action right triangle;*/ al_:after {content: "\25c0";}/*--Comment: action left triangle;*/ aua_:after { content: "\21d1";}/*--Comment: action up arrow (doubleline);*/ ada_:after { content: "\21d3";}/*--Comment: action down arrow (doubleline);*/ s_:after { content: "\1F527";}/*--Comment: wrench;*/ re_:after { content: "\2672";}/*--Comment: recycle;*/ u_:empty:after { content: "-";}/*--Comment: default is -;*/ clr_:after {content: "\2421";font-size: large;top: -3px;position: relative;left: -3px;}/*--Comment: Del key ?;*/ /*--Comment: Special box variant for drop menu display;*/ p>box { font-size: calc(var(--Frac11-12) * var(--systemsfontsize)); vertical-align: top; } p>box >t_>o_ { font-weight: bold; } /*--Comment: tagging classes;*/ /*--Comment: tag container is within doc body loader ;*/ /*--Comment: tagitem1 ;*/ .tagcontainer { position: fixed; top: calc( var(--headerheight) + 60px); z-index: 10; direction: rtl; /*--Comment: add visual indicator that this is scrollable ;*/ /* border-top: #10e99b dotted 5px;*/ /* border-bottom: #10e99b dotted 5px;*/ overflow-y: auto; overflow-x: hidden; height: auto; max-height: calc(100vh - var(--headerheight)- var(--footerheight) - 80px); /*--Comment: should be calc using top and bottom zones subtract from 100vh;*/ margin-left: -8px; display: var(--showtags); } .tagcontainer >div{ direction: ltr; } .tagsetuser{ /*--Comment: user tag set ;*/ } .tagsetall{ /*--Comment: Common tag set , can only be altered by admin;*/ } .taggroup { } /*--Comment: tagset generic set container used by JS;*/ /*--Comment: Structure for tags is: ;*/ /*taggroup : tagcontainer>.tagset.[tagsetuser/tagsetall/tagsetautosection]>.taggroup.f_toggleset>div{.svgtextedit[.tagdeletebutton] [contenteditable=true]}>[svg>[polygon/text] / div>a];*/ /* tag : tagcontainer>.tagset.[tagsetuser/tagsetall/tagsetautosection]>.taggroup.f_toggleset>div{class="svgtextedit[.tagdeletebutton] [contenteditable=true]}>div{f_tgroup}>[svg>[polygon/text] / div>a] ;*/ .tagcontainer>.tagset.tagsetuser>.taggroup ,.tagcontainer>.tagset.tagsetall>.taggroup ,.tagcontainer>.tagset.tagsetauto>.taggroup { } .taggroup>div>div>svg { position: relative; display: block; Border: 1px solid transparent; /* z-index: 999999;*/ width: 131px; height: 34px; } .tagsetuser>.taggroup>div>div>svg>polygon { /*--Comment: points="0,0 10,10 0,20 100,20 110,10 100,0";*/ fill: rgb(0,200,0); opacity:0.85; } .tagsetall>.taggroup>div>div>svg>polygon { /*--Comment: points="0,0 10,10 0,20 100,20 110,10 100,0";*/ fill: rgba(110, 110, 255); opacity:0.85; } .tagsetautosection>.taggroup>div>div>svg>polygon { /*--Comment: points="0,0 10,10 0,20 100,20 110,10 100,0";*/ fill: rgba(200, 110, 0); opacity:0.85; } .taggroup>div>div>svg>text { font-family:"Monotype Corsiva"; font-size:calc(var(--Frac20-12) * var(--systemsfontsize)); } /*--Comment: sub tags;*/ .taggroup>div>div>div>svg { position: relative; display: block; /*Border: 1px solid transparent;*/ width: 126px; height: 24px; left:10px; } /*--Comment: fix box size when showing delete button and color selectors in tag edit mode;*/ .taggroup>.svgtextedit.tagdeletebutton { width: 239px; } .tagsetuser>.taggroup>div>div>div>svg>polygon { /*--Comment: points="0,0 10,10 0,20 100,20 110,10 100,0";*/ fill: rgba(0,200,0); opacity:0.65; } .tagsetall>.taggroup>div>div>div>svg>polygon { /*--Comment: points="0,0 10,10 0,20 100,20 110,10 100,0";*/ fill: rgba(110, 110, 255); opacity:0.65; } .tagsetautosection>.taggroup>div>div>div>svg>polygon { /*--Comment: points="0,0 10,10 0,20 100,20 110,10 100,0";*/ fill: rgba(200, 110, 0); opacity:0.65; } .taggroup>div>div>div>svg>text { font-family:"Monotype Corsiva"; font-size:18px; } /*--Comment: red is only for highlighting what will be deleted, ofther colors are user choices fo the tags ;*/ .taggroup.red>.tagdeletebutton>div>svg>polygon, .taggroup.red>div>.tagdeletebutton>div>svg>polygon, .tagdeletebutton.red>div>svg>polygon { fill: rgba(255,0,0) !important ; } /*--Comment: tag group colors - user selection by adding .color to taggroupclass ;*/ .tagsetuser>.taggroup.pink>.svgtextedit>div>svg>polygon, .tagsetuser>.taggroup.pink>div>.svgtextedit>div>svg>polygon { fill: #FF6EFF ; } .tagsetuser>.taggroup.orange>.svgtextedit>div>svg>polygon, .tagsetuser>.taggroup.orange>div>.svgtextedit>div>svg>polygon { fill: #FFaa00 ; } .tagsetuser>.taggroup.yellow>.svgtextedit>div>svg>polygon, .tagsetuser>.taggroup.yellow>div>.svgtextedit>div>svg>polygon { fill:#FFFF00 ; } .tagsetuser>.taggroup.green>.svgtextedit>div>svg>polygon, .tagsetuser>.taggroup.green>div>.svgtextedit>div>svg>polygon { fill: #66FF66 ; } .tagsetuser>.taggroup.blue>.svgtextedit>div>svg>polygon, .tagsetuser>.taggroup.blue>div>.svgtextedit>div>svg>polygon { fill: #50BFff ; } .tagsetuser>.taggroup.purple>.svgtextedit>div>svg>polygon, .tagsetuser>.taggroup.purple>div>.svgtextedit>div>svg>polygon { fill: #9C51B6 ; } .tagsetuser>.taggroup.brown>.svgtextedit>div>svg>polygon, .tagsetuser>.taggroup.brown>div>.svgtextedit>div>svg>polygon { fill: #A83731 ; } .tagsetuser>.taggroup.grey>.svgtextedit>div>svg>polygon, .tagsetuser>.taggroup.gery>div>.svgtextedit>div>svg>polygon { fill: #AAAAAA ; } /*--Comment: position of X and boxes next to main tag;*/ .taggroup>.tagdeletebutton>div { /* position: relative; */ /* top: 7px; */ /* left: -4px; */ } .tagdeletebutton>div:not(.svgcontainer) {display: block;width: 0;height: 0;/* overflow-x: visible;*//*position: absolute;*//* background: red;*//* left: 2px;*/} .tagdeletebutton>div>a { background: red; font-weight: bold; position: relative; top: 4px; left: 130px; font-size: calc(var(--Frac17-12) * var(--systemsfontsize)); cursor: url(Delete.png) 12 12, auto; width: 16px; display: block; /* vertical-align: middle;*/ margin-top: 3px; margin-left: 3px; } /*--Comment: adjust X position for main tag (larger);*/ .taggroup>.tagdeletebutton>div>a { top: 10px; } .tagdeletebutton>div>a:before{ content:"X"; } /*--Comment: 2026-06-13 up/down tag-reorder arrows (edit mode only). They are a sibling of the delete X inside the zero-size control div, so they never trigger the delete handlers. Positioned absolutely on the tag's line, just to the right of the X (X is at left:130px width:16px);*/ .tagdeletebutton>div:not(.svgcontainer) { position: relative; } .tagdeletebutton>div>.tagmovebox { position: absolute; top: 4px; left: 150px; white-space: nowrap; display: inline-block; } .tagmovebox>.tagmoveup, .tagmovebox>.tagmovedown { cursor: pointer; display: inline-block; padding: 0 4px; font-weight: bold; font-size: calc(var(--Frac17-12) * var(--systemsfontsize)); -webkit-user-select: none; user-select: none; } .taggroup>.svgtextedit>div>div:before{ content: "_"; width: 10px; height:16px; } /*--Comment: layout tag color select boxes;*/ .taggroup>.svgtextedit>div>div { position: relative; top: -5px; left: 151px; font-size: calc(var(--Frac17-12) * var(--systemsfontsize)); cursor: pointer; display: table-cell; } /*--Comment: display colorSlect boxes;*/ .taggroup>.svgtextedit>div>div.pink { background: #FF6EFF; color: #FF6EFF; } .taggroup>.svgtextedit>div>div.orange { background: #FFAA00; color: #FFAA00; } .taggroup>.svgtextedit>div>div.yellow { background: #FFFF00; color: #FFFF00; } .taggroup>.svgtextedit>div>div.green { background: #66FF66; color: #66FF66; } .taggroup>.svgtextedit>div>div.blue { background: #50bfff; color: #50bfff; } .taggroup>.svgtextedit>div>div.purple { background: #9C51B6; color: #9C51B6; } .taggroup>.svgtextedit>div>div.brown { background: #A83731; color: #A83731; } .taggroup>.svgtextedit>div>div.grey { background: #AAAAAA; color: #AAAAAA; } /*--Comment: copy of tag is placed on box;*/ .svgtag { display: inline-block; /*--Comment: necssary to prevent tag affecting box display;*/ width: 0; height: 0; position: absolute; z-index:2000; /*left: -90px;*/ } .svgtag{ opacity:0.65; } .svgtag.pink>div>svg>polygon { fill: #FF6EFF; } .svgtag.orange>div>svg>polygon { fill: #FFAA00; } .svgtag.yellow>div>svg>polygon { fill: #FFFF00; } .svgtag.green>div>svg>polygon { fill: #66FF66; } .svgtag.blue>div>svg>polygon { fill: #50bfff; } .svgtag.purple>div>svg>polygon { fill: #9C51B6; } .svgtag.brown>div>svg>polygon { fill: #A83731; } .svgtag.grey>div>svg>polygon { fill: #AAAAAA; } .svgtag.user>div>svg>polygon { fill: #00C800; } .svgtag.all>div>svg>polygon { fill: #6E6EFF; } .svgtag.auto>div>svg>polygon { fill: #C86E00; } .svgtextedit:not(.tagdeletebutton)>div:not(.svgcontainer) { display:none; } /*--Comment: Special system function xhtmltags;*/ f_pgnum,f_docnumpg,f_secnumpg,f_date,f_time,f_docvar,f_,fmt { display:inline-block; } /*--Comment: all possible sub objects need to be relative to put menu object correctly;*/ f_pgnum, f_docnumpg, f_secnumpg, f_date, f_time, f_docvar, r_, ft_, fmt, ol, ul, li, table, tbody,thead,tfoot, tr, th, td, blockquote, svg, btn_ ,o_>div { position: relative; } .temp { /*--Comment: class for testing only ;*/ } .temp1 { /*--Comment: class for testing only ;*/ } .temp2 { /*--Comment: class for testing only ;*/ } .temp3 { /*--Comment: class for testing only ;*/ } .a4 { size: A4 portrait; width: 21cm; height: 29.7cm; max-width: 21cm; max-height: 29.7cm; --physicalpagewidth: 21.0cm; --physicalpageheight: 29.7cm; } .a4.landscape { size: A4 landscape; width: 29.7cm; height: 21cm; max-width: 29.7cm; max-height: 21cm; --physicalpagewidth: 29.7cm; --physicalpageheight: 21.0cm; } .a3 { size: A3 portrait; max-width: 29.7cm; max-height: 42cm; width: 29.7cm; height: 42.0cm; --physicalpagewidth: 29.7cm; --physicalpageheight: 42.0cm; } .a3.landscape { size: A3 landscape; max-width: 42.0cm; max-height: 29.7cm; width: 42.0cm; height: 29.7cm; --physicalpagewidth: 42.0cm; --physicalpageheight: 29.7cm; } /*--Comment: control widths default is a4;*/ /*:not(.popupmenu)*/ .docsection>.paperpage{ --printareapagelength:calc(var(--physicalpageheight) - (var(--margintop) + var(--marginbottom)) ); --printareapagewidth:calc(var(--physicalpagewidth) - (var(--marginleft) + var(--marginright)) ); } .reportcontainer:not(.popupmenu), .docsection:not(.popupmenu), .displaypage:not(.popupmenu) { /* width: 21cm; */ /* height: unset; */ /* max-width: 21cm; */ /* max-height: unset; */ /* --physicalpagewidth: 21.0cm; */ /* --physicalpageheight: 29.7cm; */ user-select: text; } .reportcontainer.a4, .docsection.a4, .displaypage.a4 { width: 21cm; height: unset; max-width: 21cm; max-height: unset; --physicalpagewidth: 21.0cm; --physicalpageheight: 29.7cm; } .reportcontainer.a4.landscape, .docsection.a4.landscape,.displaypage.a4.landscape { width: 29.7cm; height: unset; max-width: 29.7cm; max-height: unset; --physicalpagewidth: 29.7cm; --physicalpageheight: 21.0cm; } .reportcontainer.a3, .docsection.a3,.displaypage.a3 { max-width: 29.7cm; max-height: unset; width: 29.7cm; height: unset; --physicalpagewidth: 29.7cm; --physicalpageheight: 42.0cm; } .reportcontainer.a3.landscape, .docsection.a3.landscape,.displaypage.a3.landscape { max-width: 42.0cm; max-height: unset; width: 42.0cm; height: unset; --physicalpagewidth: 42.0cm; --physicalpageheight: 29.7cm; } /*--Comment: TestprintMedia;*/ /*fudges : cannot find why 50% 50% center rotate is not correct;*/ @media print{ :root{ --nonprintareaPapercolor: rgba(255,255,255,0); } @page { margin-top: 0; margin-bottom: 0; margin-left: 0; margin-right: 0; } /* --Comment: NONE OF THESE WORK ;*/ /* --Comment: So we force landscape to rotate below this is fine if all pages are same sizebut does not work when we mix a3 and a4 - more to be done to resolve this @page .a4.portrait { size: A4 portrait; } @page .a4.landscape { size: A4 landscape; } @page .a3.portrait { size: A3 portrait; } @page .a3.landscape { size: A3 landscape; } ;*/ /*--Comment: @media print { --------------------------------------------------------------;*/ /*--Comment: .page {};*/ @page { /*size: a4; width: 21cm; height: 29.7cm;*/ margin-top: 0; margin-bottom: 0; margin-left: 0; margin-right: 0; } /*--Comment: special classes for pages to handle size and orientation changes during printing;*/ /*--Comment: web page display already works but these classes had to be added to handle printing ;*/ .a4.portrait { /* size: A4 portrait;*/ } /*--Comment: force page content rotation to portrait for printing;*/ /* original:: .a4.landscape { size:a4; transform: rotate(90deg); transform-origin: 35.3% 35.4%; }*/ .a4.landscape { size: A4 landscape; width: 21cm; height: 21cm; max-width: 21cm; max-height: 29.7cm; --physicalpagewidth: 29.7cm; --physicalpageheight: 21cm; transform-origin: 35.4% 50.0%; transform: rotate(90deg); } .a3.portrait { /*size: A3 portrait;*/ } .a3.landscape { size: A3 landscape; width: 29.7cm ; height: 29.7cm ; max-width: 29.7cm ; max-height: 42cm ; --physicalpagewidth: 42cm; --physicalpageheight: 29.7cm; transform-origin: 35.4% 50%; transform: rotate(90deg); } /*--Comment: when printing we don't want the header, footer and screen navigation bars, only the report page ;*/ .popupmenu , .dockedmenu TestprintMedia{ visibility: hidden; display: none; } body { background: unset; -webkit-background-size: unset; -moz-background-size: unset; -o-background-size: unset; background-size: unset; } .screenheaderbar , TestprintMedia{ visibility: hidden; display: none; position:unset; top: 0; width: 0; height: 0; } .leftsidebar, TestprintMedia { visibility: hidden; display: none; } .rightsidebar, TestprintMedia { visibility: hidden; display: none; } .screenfooterbar, TestprintMedia { visibility: hidden; display: none; } .pagebreak:after , TestprintMedia { visibility: hidden; display: none; outline: unset; content: ''; } .bodywholepage { background: unset; -webkit-background-size: unset; -moz-background-size: unset; -o-background-size: unset; background-size: unset; background-image:unset; } /*--Comment: Border lines are up scaled on the display, for printing we have to force all uses of borderlines to the fixed value ;*/ table, th, tr, td, TestprintMedia { border: var(--BorderLineprintsize) solid; } table , TestprintMedia{ margin-top: calc(-1 * var(--BorderLineprintsize)); } box , TestprintMedia{ border: var(--BorderLineprintsize) transparent; } .stdbdr , TestprintMedia{ border: var(--BorderLineprintsize) solid ; } /* things to hide: ;*/ .tabtitle,.tabsetbuttons,m_,leftsizeop,bottomsizeop { display:none !important; visibility: hidden !important; overflow: hidden; height:0 !important; width:0 !important; max-height:0px; max-width:0px; line-height:0; margin: 0 !important; padding: 0 !important; border: 0 !important; letter-spacing: normal; word-spacing: normal; text-transform: none; text-indent:0; text-shadow: none; } /*--Comment: end of border line fixing for print ;*/ .screenpagezone, TestprintMedia { /*--Comment: nothing required for the print version but still we need to resolve why stupid thing still puts an extra page if we specify page lengths temporary work around is not to specify page length- leave resolution to next development stage when multiple page reports are required;*/ position: unset; top: 0; left: 0; border: 0 transparent; background: transparent; padding: 0; margin: 0; display: block; overflow-y: visible; overflow-x: visible; width: var(--Deskdisplayzonewidth); width:unset; height:unset; background-image: unset; border-image: unset; } .screenpagezone,.tabdoc,.htmldocload,.docbodyloader,.displaypage,.printzone { background: unset; /* display:inline-block; */ margin: 0 auto; width: auto; } /*--Comment: transform back to original scale is critical to remove effect of slider used on screen display BUT for unknown reasons a small reduction and small offsets are necessary to get correct paper alignment;*/ /*width: var(--physicalpagewidth); min-width: var(--physicalpagewidth); max-width: var(--physicalpagewidth);*/ .displaypage , TestprintMedia{ /*--Comment: slider transform does not correctly allow zoom on top of first page, gets worse the more pages there are -< to fix ;*/ margin:0; margin-top: 0; margin-bottom: 0; transform-origin: unset; transform: unset; height:unset; /* position: unset; */ /* width: 21cm; */ /* outline: #50bfff 24px solid; */ /* outline-offset: -25px; */ } .reportcontainer , TestprintMedia{ /*--Comment: used as primary reference for "is this A document?", used for saving Reports and templates;*/ /*height:unset;*/ /* position: unset;*/ background: unset; /* display:inline-block; */ margin: 0 auto; box-shadow: none; /* outline: yellow 35px solid; */ /* outline-offset: -36px; */ } .printzone , TestprintMedia{ /*--Comment: container to set paper width for display and printing and position on display width ways;*/ /*opacity: 1.0;*/ /*width: var(--printareapagewidth);*/ /*min-width: var(--printareapagewidth);*/ /*max-width: var(--printareapagewidth);*/ /*margin: unset;*/ /*height:unset;*/ position: relative; background: unset; box-shadow: none; /* outline: purple 14px solid; */ /* outline-offset: -15px; */ /* width: 0; */ /* height: 0; */ width: var(--physicalpagewidth); /* min-width: var(--physicalpagewidth); */ /* max-width: var(--physicalpagewidth); */ /* min-height: var(--physicalpageheight); */ /* height: var(--physicalpageheight); */ /* max-height: var(--physicalpageheight); */ } .docsection , TestprintMedia{ /* repeatable, three varieties - No data source = text , datasource(Master) = first record and dfines layout, datasourceSlave, = all subsequent reocrds in this section ;*/ /*margin: unset;*/ height:unset; width: unset; /*position: unset;*/ background: unset; box-shadow: none; /* outline: green 15px solid; */ /* outline-offset: -14px; */ } .SecMaster , TestprintMedia{/*--Comment: identifies this DocSection as a master = this is the section used to define and generate the slaves (one for each record key Result);*/ } .SecSlave , TestprintMedia{ /*--Comment: Do not Save when writing a Report/template ONLY use master for templates;*/ } .letterhead, TestprintMedia{ background-image:unset; background-size: unset; /*--Comment: var(--physicalpagewidth) var(--physicalpageheight);};*/ } .docsection:not(.popupmenu)>div.c_virtrowspacer, TestprintMedia{ display:none; visibility: hidden; height: 0; width: 0; padding: 0; } .docsection>.paperpage , TestprintMedia{ /*--Comment: physical Paper space, container for printable area and headers and footers;*/ /* box-shadow: unset; */ /*width: var(--physicalpagewidth);*/ /*min-width: var(--physicalpagewidth);*/ /*max-width: var(--physicalpagewidth);*/ /*min-height: var(--physicalpageheight);*/ /*height: var(--physicalpageheight);*/ /*max-height: var(--physicalpageheight);*/ /* overflow: hidden; */ background: var(--nonprintareaPapercolor) !important; /*--Comment: paper is white;*/ /*--Comment: setting letterhead background with vaiables fails (still after 5 years) in chrome) SO the workaround uses inline style .. CSS cannot differentiate a background for letter head (visual only) and a paperpage background for user Thus for now, paperpage is NOT permitted a printable background. A workaround in .onepage is needed ;*/ box-shadow: none; padding: 0; margin: 0; /*page-break-after: always;*/ /*break-after: always;*/ page-break-inside: avoid; /*--Comment: the "Paper margins show in color => nonprintareaPapercolor;*/ /*--Comment: header and footers DO show in these "non print" araeas;*/ border-top: var(--margintop) var(--nonprintareaPapercolor) solid; border-bottom: var(--marginbottom) var(--nonprintareaPapercolor) solid; border-left: var(--marginleft) var(--nonprintareaPapercolor) solid; border-right: var(--marginright) var(--nonprintareaPapercolor) solid; /* display: block; */ /* position: relative; */ /* outline: red 6px solid; */ /* outline-offset: -7px; */ } .paperpage:after { display:none; visibility: hidden; height: 0mm; background-color: var(--nonprintareaPapercolor); height: 2.5mm; height: 1mm; width: var(--physicalpagewidth); width: 1mm; content: ' '; display: block; position: relative; bottom: 1.5; font-size: 0; left: calc( -1* var(--marginleft)); text-align: center; } .onepage , TestprintMedia{ /*--Comment: the space where docuemnt printable content goes;*/ width: var(--printareapagewidth); min-width: var(--printareapagewidth); max-width: var(--printareapagewidth); /* min-height: calc( var(--printareapagelength) - ( 2 * 20px) );*/ height: var(--printareapagelength); /* max-height: calc( var(--printareapagelength) - ( 2 * 20px) );*/ /*page-break-after: always; page-break-inside: auto;*/ display: block; } /*--Comment: header layout on a paper page;*/ .pageheader, TestprintMedia{ /* position: absolute; */ /* top: calc( -1 * var(--margintop)); */ /* display: block; */ /* height: 0; */ /* outline: cyan 6px solid; */ /* outline-offset: -7px; */ /* z-index: 10000; */ /* background: unset; */ } /*--Comment: footer layout on a paper page;*/ .pagefooter, TestprintMedia{ display: block; height: var(--marginbottom); /*page-break-inside: avoid;*/ /* outline: orange 6px solid; */ /* outline-offset: -7px; */ } .pageheader>.row,.pagefooter>.row{ background-color: rgba(255,255,255,0); } /*--Comment: tag is used for header and footer to put a flaoting tag in the left margin to indicate items is a header or footer;*/ .tag, TestprintMedia { display:none; visibility: hidden; } /*--Comment: tag container holds all elements for the colored flags short cut navigation => never print;*/ .tagcontainer, TestprintMedia { display:none; visibility: hidden; } .pagespace, TestprintMedia { /*--Comment: an empty div between Other page containers purely for screen display of pages;*/ /* background: transparent;*/ /* width: 842px;*/ display:none; visibility: hidden; height: 0; } /*-------------------------------------;*/ .floatingcontrolpanel, TestprintMedia { display: none; visibility: hidden; } .fbord, box:last-child.fbord { outline: unset; } /*DEPRICATED: JS cycles throught the fbr classes Resulting in a moving outline;*/ .fbr0{ outline:unset;} .fbr1{ outline:unset;} .fbr2{ outline:unset;} .fbr3{ outline:unset;} .fbr4{ outline:unset;} .fbr5{ outline:unset;} .fbr6{ outline:unset;} .fbr7{ outline:unset;} .fbr8{ outline:unset;} .fbr9{ outline:unset;} .fbr10{ outline:unset;} .warning:hover{ background-color:unset; } .boxhover { background-color:unset; } .boxcannotedit{ background-color:unset; } .itemisselected{ background-color: unset; outline-style: unset; outline-color: unset; outline:none; outline-width:unset; } .subitemselected{ outline-style: unset; outline-color: unset; outline:none; outline-width:unset; } .objectstoselect{ outline-style: unset; outline-color: unset; outline:none; outline-width:unset; } .userresize{ border:unset; resize: unset; overflow: unset; } .dragndropselect{ background-color: unset; } .dragndrop:hover:not(.dragndropselect):not(.dragndropdest):not(.dragoverdest), .dragndrop:hover:not(.dragndropselect):not(.dragndropdest):not(.dragoverdest)>t_, .dragndrop:hover:not(.dragndropselect):not(.dragndropdest):not(.dragoverdest)>d_, .dragndrop.dragoverdest:hover>t_, .dragndrop.dragoverdest:hover>d_ { background-color:unset ; } box.dragndropdest:hover, .dragndropdest:hover>box, .dragndropdest:hover>div>box, .dragndropdest:hover>div>div>box { background-color: unset; } div>div>box.dragoverdest, div>div.dragoverdest>box{ background-color: unset; } .multiboxselect,.select{ background-color: unset; outline: unset; } .multirowselect{ background-color: unset; outline: unset; } } /*--Comment: ------------------------- end of media@print } ----------------------------;*/ .titlecolumnhead { text-align: left; font-weight: bold; font-size: var(--titlecolumnheadingsize); width: var(--titlecolumnwidth); word-wrap: break-word; } .multicolumnhead { text-align: center; font-weight: bold; font-size: var(--multicolumnheadingsize); word-wrap: break-word; } .datacolumnhead { text-align: center; font-weight: bold; font-size: var(--datacolumnheadingsize); width: 1%; word-wrap: break-word; } .titlecolumn { text-align: left; font-size: var(--titlecolumntextsize); width: 1%; word-wrap: break-word; } .datacolumn { text-align: center; font-size: var(--datacolumntextsize); width: 1%; word-wrap: break-word; } /*--Comment: slide control to zoom page in and out ;*/ .fhbox>div>bg_>btn_{ margin-bottom: 4px; /* height: 17px; */ } .pagezoomslider { width: 269px; background: #efefff; border: 3px solid #1a1a1a; border-radius: 8px; /* margin: 0 auto; */ /* padding-top: 0; */ /* margin-top: 0; */ /* text-align: center; */ font-size: calc(var(--Frac10-12) * var(--systemsfontsize)); /* background-color: var(--virtualDesktopcolor); */ border: 3px solid transparent; display: inline-block; height: 16px; margin-top: 0px; } .pagezoomslider>label,.pagezoomslider>input { display: inline-block; position: relative; top: -3px; height: 6px; } .pagezoomslider>label{ top: -7px; } #docsizer { width: 220px; background: #efefff; /* margin-top: 10px; */ /* margin-bottom: 5px; */ display: inline-block; } #docsizer:-webkit-slider-thumb { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; cursor: pointer; } #docsizer:-moz-range-thumb { border: 0; cursor: pointer; } .f1pt {font-size:1pt ;} .f2pt {font-size:2pt ;} .f3pt {font-size:3pt ;} .f4pt {font-size:4pt ;} .f5pt {font-size:5pt ;} .f6pt {font-size:6pt ;} .f7pt {font-size:7pt ;} .f8pt {font-size:8pt; } .f9pt {font-size:9pt ;} .f10pt {font-size:10pt ;} .f11pt {font-size:11pt ;} .f12pt {font-size:12pt ;} .f13pt {font-size:13pt ;} .f14pt {font-size:14pt ;} .f15pt {font-size:15pt ;} .f16pt {font-size:16pt ;} .f17pt {font-size:17pt ;} .f18pt {font-size:18pt ;} .f19pt {font-size:19pt ;} .f20pt {font-size:20pt ;} .f21pt {font-size:21pt ;} .f22pt {font-size:22pt ;} .f23pt {font-size:23pt ;} .f24pt {font-size:24pt ;} .f25pt {font-size:25pt ;} .f26pt {font-size:26pt ;} .f27pt {font-size:27pt ;} .f28pt {font-size:28pt ;} .f29pt {font-size:29pt ;} .f30pt {font-size:30pt ;} .f31pt {font-size:31pt ;} .f32pt {font-size:32pt ;} .f33pt {font-size:33pt ;} .f34pt {font-size:34pt ;} .f35pt {font-size:35pt ;} .f36pt {font-size:36pt ;} .f37pt {font-size:37pt ;} .f38pt {font-size:38pt ;} .f39pt {font-size:39pt ;} .f40pt {font-size:40pt ;} .f41pt {font-size:41pt ;} .f42pt {font-size:42pt ;} .f43pt {font-size:43pt ;} .f44pt {font-size:44pt ;} .f45pt {font-size:45pt ;} .f46pt {font-size:46pt ;} .f47pt {font-size:47pt ;} .f48pt {font-size:48pt ;} .f49pt {font-size:49pt ;} .f50pt {font-size:50pt ;} .f51pt {font-size:51pt ;} .f52pt {font-size:52pt ;} .f53pt {font-size:53pt ;} .f54pt {font-size:54pt ;} .f55pt {font-size:55pt ;} .f56pt {font-size:56pt ;} .f57pt {font-size:57pt ;} .f58pt {font-size:58pt ;} .f59pt {font-size:59pt ;} .f60pt {font-size:60pt ;} .f61pt {font-size:61pt ;} .f62pt {font-size:62pt ;} .f63pt {font-size:63pt ;} .f64pt {font-size:64pt ;} .f65pt {font-size:65pt ;} .f66pt {font-size:66pt ;} .f67pt {font-size:67pt ;} .f68pt {font-size:68pt ;} .f69pt {font-size:69pt ;} .f70pt {font-size:70pt ;} .f71pt {font-size:71pt ;} .f72pt {font-size:72pt ;} .f73pt {font-size:73pt ;} .f74pt {font-size:74pt ;} .f75pt {font-size:75pt ;} .f76pt {font-size:76pt ;} .f77pt {font-size:77pt ;} .f78pt {font-size:78pt ;} .f79pt {font-size:79pt ;} .f80pt {font-size:80pt ;} .f81pt {font-size:81pt ;} .f82pt {font-size:82pt ;} .f83pt {font-size:83pt ;} .f84pt {font-size:84pt ;} .f85pt {font-size:85pt ;} .f86pt {font-size:86pt ;} .f87pt {font-size:87pt ;} .f88pt {font-size:88pt ;} .f89pt {font-size:89pt ;} .f90pt {font-size:90pt ;} .f91pt {font-size:91pt ;} .f92pt {font-size:92pt ;} .f93pt {font-size:93pt ;} .f94pt {font-size:94pt ;} .f95pt {font-size:95pt ;} .f96pt {font-size:96pt ;} .f97pt {font-size:97pt ;} .f98pt {font-size:98pt ;} .f99pt {font-size:99pt ;} .f100pt {font-size:100pt ;} .ftandalemono ,.ftAndaleMono { font-family:"Andale Mono" ;} .ftarial ,.ftArial { font-family:"Arial";} .ftarialblack ,.ftArialblack { font-family:"Arial Black";} .ftavantgarde ,.ftAvantGarde { font-family:"Avant Garde";} .ftbookman ,.ftBookman { font-family:"Bookman";} .ftcalibri ,.ftCalibri { font-family:"Calibri";} .ftcenturyschoolbook,.ftCenturySchoolbook { font-family:"Century Schoolbook";} .ftcomicsansms ,.ftComicSansMS { font-family:"Comic Sans MS";} .ftcouriernew ,.ftCourierNew { font-family:"Courier New";} .ftarialnarrow ,.ftArialnarrow { font-family:"Arial Narrow";} .ftfreestylescript ,.ftFreestyleScript { font-family:"Freestyle Script";} .ftgaramond ,.ftGaramond { font-family:"Garamond";} .ftgeorgia ,.ftGeorgia { font-family:"Georgia";} .fthelvetica ,.ftHelvetica { font-family:"Helvetica";} .ftimpact ,.ftImpact { font-family:"IMPACT";} .ftmonotypecorsiva ,.ftMonotypeCorsiva { font-family:"Monotype Corsiva";} .ftmvboli ,.ftMVBoli { font-family:"MV Boli";} .ftpalatino ,.ftPalatino { font-family:"Palatino";} .ftstylusbt ,.ftStylusBT { font-family:"Stylus BT";} .fttimesnewroman ,.ftTimesNewRoman { font-family:"Times New Roman";} .fttrebuchetms ,.ftTrebuchetMS { font-family:"Trebuchet MS";} .ftverdana ,.ftVerdana { font-family:"Verdana";} .tab0 { padding-left: 0 ; display:inline-block; } .tab1 { padding-left: var(--tab1) ;display:block;} .tab2 { padding-left: var(--tab2) ;display:block;} .tab3 { padding-left: var(--tab3) ;display:block;} .tab4 { padding-left: var(--tab4) ;display:block;} .tab5 { padding-left: var(--tab5) ;display:block;} .tab6 { padding-left: var(--tab6) ;display:block;} .tab7 { padding-left: var(--tab7) ;display:block;} .tab8 { padding-left: var(--tab8) ;display:block;} .lockon { /*--Comment: used in hideme definition - prevents hideme used to prevent obejects fading and hiding;*/ } .showlabels { /*--Comment: used to prevent comment labels from disapearing ;*/ } /* .checkbox { display: inline-flex; cursor: pointer; position: relative; } .checkbox > span { color: #34495E; padding: 0.5rem 0.25rem; } */ .StandardCheckBox{ /* copy to :root and set your standards */ /* copy this class and adjust for alternate styles*/ /* Does not need to be applied directly to input, can be set on any HTML element*/ /* all sub elements will inherit*/ /* individual vars can be set on an element*/ --checkboxsize: 16px; --checkfontsizeadjust: 1.0; --checkboxbordersize: 1px; --checkboxborderradius: 3px; --checkboxbordercolor: black; --checkboxsymolxoffset:-1px; /* On Status */ --checkboxontextcolor: black; --checkboxonbackcolor: lightgreen; --checkboxonsymbol: '\2713'; --checkboxonhovermsg: "True"; --checkboxonsymbolyoffset: -1px; /* Off Status */ --checkboxofftextcolor: black; --checkboxoffbackcolor: antiquewhite; --checkboxoffsymbol: ' '; --checkboxoffhovermsg: "False"; --checkboxoffsymbolyoffset: 0px; /* Indeterminate Status */ --checkboxindtextcolor: black; --checkboxindbackcolor: orange; --checkboxindsymbol: '-'; --checkboxindhovermsg: "Unknown"; --checkboxindsymbolyoffset: 0px; } .LazyHandCheckBox{ --comment: tick is bigger than box; --checkboxsize: 31px; /*default here, but can individually set on object if differing sizes needed*/ --checkfontsizeadjust: 1.6; --checkboxbordersize: 1px; --checkboxborderradius: 3px; --checkboxbordercolor: black; --checkboxsymolxoffset:calc(-0.18 * var(--checkboxsize)); /* On Status */ --checkboxontextcolor: black; --checkboxonbackcolor: lightgreen; --checkboxonsymbol: '\2714'; --checkboxonhovermsg: ""; --checkboxonsymbolyoffset: -2px; /* Off Status */ --checkboxofftextcolor: black; --checkboxoffbackcolor: antiquewhite; --checkboxoffsymbol: '\2718'; --checkboxoffhovermsg: ""; --checkboxoffsymbolyoffset: -1px; /* Indeterminate Status */ --checkboxindtextcolor: black; --checkboxindbackcolor: orange; --checkboxindsymbol: '\2622'; --checkboxindhovermsg: ""; --checkboxindsymbolyoffset: -2px; } .SmileyCheckBox{ --checkboxsize: 16px; --checkfontsizeadjust: 1.0; --checkboxbordersize: 0px; --checkboxborderradius: 3px; --checkboxbordercolor: transparent; --checkboxsymolxoffset: 0px; /* On Status */ --checkboxontextcolor: black; --checkboxonbackcolor: lightgreen; --checkboxonsymbol: '\263a'; --checkboxonhovermsg: "Happy"; --checkboxonsymbolyoffset: 1px; /* Off Status */ --checkboxofftextcolor: black; --checkboxoffbackcolor: orange; --checkboxoffsymbol: '\2639'; --checkboxoffhovermsg: "Sad"; --checkboxoffsymbolyoffset: -0.5px; /* Indeterminate Status */ --checkboxindtextcolor: black; --checkboxindbackcolor: red; --checkboxindsymbol: '\2620'; --checkboxindhovermsg: "Dead"; --checkboxindsymbolyoffset: -0.5px; } input[type="checkbox"] { --Usage: set --checkboxsize to match your font size in the element or ancestor when you set the font; --rootnote: set all vars in the root to make defaults; margin: auto; padding: 0; height: var(--checkboxsize) !important; width: var(--checkboxsize) !important; max-height: var(--checkboxsize) !important; max-width: var(--checkboxsize) !important; font-size: calc(var(--checkfontsizeadjust) * var(--checkboxsize)) !important; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none; border: var(--checkboxbordersize) solid var(--checkboxbordercolor); border-radius: var(--checkboxborderradius); outline: none; transition-duration: 0.3s; cursor: pointer; position:relative; display: inline-block !important; bottom:1px; vertical-align:middle; line-height: var(--checkboxsize) !important; margin-left: 2px; min-width: var(--checkboxsize) !important; } input[type="checkbox"]::after { /*after is used to hold the symbol*/ display: block; position: absolute; left: var(--checkboxsymolxoffset); bottom: 3px; margin: auto; padding:0; text-align: center; vertical-align:middle; line-height:var(--checkboxsize); height: var(--checkboxsize) !important; width: var(--checkboxsize) !important; max-height: var(--checkboxsize) !important; max-width: var(--checkboxsize) !important; font-size:inherit; font-weight: inherit; /* background: transparent; */ } input[type="checkbox"]::before { /* before is used to hold the Optional hover message default is above, use attribute labelposition="right" to place label after tick box*/ display: block; position: absolute; margin: 0; padding: 0; vertical-align:middle; line-height:var(--checkboxsize); font-size:inherit; font-weight: inherit; white-space:nowrap; overflow: visible; background: rgba(240,240,240,0.85); transition-duration: 0.3s; z-index: 9000; } input[type="checkbox"]:not([labelposition="right"]):not([labelposition="left"])::before { /* before is used to hold the Optional hover message default is above, use attribute labelposition="right" to place label after tick box*/ bottom: var(--checkboxsize); left:0; } input[type="checkbox"][labelposition="right"]::before { /* before is used to hold the Optional hover message default is above, use attribute labelposition="right" to place label after tick box*/ bottom:-1px; left: var(--checkboxsize); } input[type="checkbox"][labelposition="left"]::before { /* before is used to hold the Optional hover message default is above, use attribute labelposition="right" to place label after tick box*/ bottom:-1px; right: var(--checkboxsize); } :not(.warning)>input[type="checkbox"]:not(:indeterminate):checked { color: var(--checkboxontextcolor); background-color: var(--checkboxonbackcolor); } input[type="checkbox"]:not(:indeterminate):checked::after { content: var(--checkboxonsymbol); bottom: var(--checkboxonsymbolyoffset); } input[type="checkbox"]:not(:indeterminate):checked:hover::before { content: var(--checkboxonhovermsg); } input[type="checkbox"]:not(:indeterminate):not(:checked) { color: var(--checkboxofftextcolor); background-color: var(--checkboxoffbackcolor); } input[type="checkbox"]:not(:indeterminate):not(:checked)::after { content: var(--checkboxoffsymbol); bottom: var(--checkboxoffsymbolyoffset); } input[type="checkbox"]:not(:indeterminate):not(:checked):hover::before { content: var(--checkboxoffhovermsg); } input[type="checkbox"]:indeterminate { color: var(--checkboxindtextcolor); background-color: var(--checkboxindbackcolor); } input[type="checkbox"]:indeterminate::after { content: var(--checkboxindsymbol); bottom: var(--checkboxindsymbolyoffset); } input[type="checkbox"]:indeterminate:hover::before { content: var(--checkboxindhovermsg); } .smoothtransition{ transition-duration: var(--smoothtransitiontime); }