1 * { position: static; }
3 .trailbtn:checked + fieldset.trailbox { display: block;}
5 .trailbtn:checked + .trailbox + .trailbtn {
7 height: 2.25em; padding: 0 3ex;
8 font-size: 1em; font-weight: normal;
9 color: #000; background-color: #FDD;
10 border: 1px solid #000;
13 .trailbtn:checked + .trailbox + .trailbtn[type=submit]:before {content: none;}
19 margin: 0; padding: 0;
23 form > button[type=submit] {
24 position: fixed; display: block;
26 height: 2.25em; padding: 0 3ex;
27 font-size: 1em; font-weight: bold;
28 color: #000; background-color: #FDD;
29 border-width: 1px; border-color: #000;
30 border-style: none solid solid solid;
31 border-radius: 0 0 4px 4px;
34 form > button[type=submit]:hover {
35 background-color: #FEE;
45 form#report button#backbutton {
48 top: 1.75em; left: 2%;
50 background: transparent;
52 border: none; box-shadow: none;
55 input.tab { display: none; }
56 input.tab + label.tab { display: block; }
57 input.tab + label.tab::before { content: '\25b8 \00a0'; float: left;}
58 input.tab:checked + label.tab::before { content: '\25be \00a0'; }
59 input.tab + label.tab + div.tab { display: none; }
60 input.tab:checked + label.tab + div.tab { display: block; }
62 input.color { display: none }
64 display: inline-block;
65 width: 1em; height: 1em;
66 border: 1px solid black;
68 input.color:checked + label{ border-width: 3px;}
69 input.color[value="#000"] + label,
70 input.color[value="#888"] + label { background-color: #888;}
71 input.color[value="#00A"] + label { background-color: #00F;}
72 input.color[value="#0A0"] + label { background-color: #0F0;}
73 input.color[value="#0AA"] + label { background-color: #0FF;}
74 input.color[value="#A00"] + label { background-color: #F00;}
75 input.color[value="#A0A"] + label { background-color: #F0F;}
76 input.color[value="#AA0"] + label { background-color: #FF0;}
77 input.color[value="#FFF"] + label { background-color: #FFF;}
79 h1, label.tab, div.tab, fieldset.tab,
80 div.patient, div.prescription, div.therapies {
87 text-decoration: none; color: #000;
91 display: inline-block;
92 text-decoration: none;
93 border: 1px solid black;
94 margin-top: .5em; padding: .25em .5em;
95 background-color: #DDF;
98 div.therapies > a.current {
99 background-color: #AAF;
103 background-color: #CFF;
105 div.prescription h3 {
109 div.prescription span {
110 display: inline-block;
112 margin-right: -.75ex;
115 div.prescription span label { font-weight: bold; margin-right: 1ex;}
116 div.prescription span.prescno,
117 div.prescription span.catalogue {
124 div.prescription ul {
129 div.prescription label.checkbox,
130 div.prescription label.radio {
132 padding-left: 1.25em;
137 div.prescription label.checkbox:before,
138 div.prescription label.radio:before {
139 display: inline-block;
141 background-color: #FFF;
142 height: 1.375em; width: 1.125em;
143 padding: .125em 0 0 .375em;
144 margin: 0 .5em .25em -1.25em;
145 border: 1px solid #000;
146 vertical-align: middle;
149 div.prescription label.radio:before { border-radius: .5em;}
150 div.prescription label.checkbox.checked:before,
151 div.prescription label.radio.checked:before { content: "\2713";}
153 div.prescription label[for=prescreviewed] {
156 text-decoration: underline;
157 background-color: #FCC;
159 div.prescription label[for=prescreviewed].checked {
161 text-decoration: none;
162 background-color: transparent;
165 div.prescription label.tab {width: 96%; border: none; border-bottom: 1px dotted;}
166 div.prescription div.tab { width: 96%; background-color: #DDD;}
168 input.stickynote { display:none; }
169 input.stickynote + .stickynote {
171 background-color: #FF8;
172 top: 4em; bottom: 4em;
173 left: -4.5em; width: 5em;
178 input.stickynote + .stickynote:nth-of-type(2n) {
179 background-color: #8FF;
183 input.stickynote + .stickynote > * { display: none; }
184 input.stickynote + .stickynote > textarea {
187 left; 0; right: 0; bottom: 0; top: 0;
188 width: 100%; height: 100%;
189 background-color: #FF8;
192 input.stickynote + .stickynote > label {
194 top: 0; bottom: 0; right: .5ex; left: 0;
200 input.stickynote + .stickynote:hover {
201 width: auto; left: 0em; right: 2em;
203 input.stickynote:checked + .stickynote {
204 width: auto; left: 1em; right: 1em;
206 input.stickynote:checked + .stickynote > * { display: block; }
207 input.stickynote:checked + .stickynote > button[type="submit"] {
210 right: .5ex; bottom: .5ex;
213 input.stickynote:checked + .stickynote > label {
218 input.stickynote:checked + .stickynote > label:before {
223 top: .5ex; right: .5ex;
224 padding: .125ex .75ex;
225 background-color: #000;
234 right: 0; width: 2em;
235 margin: .5em .5em .125em 2%;
239 fieldset.penwidth { bottom: 19em; }
240 fieldset.penwidth > input {display: none;}
241 fieldset.penwidth > input + label { display: none;}
242 fieldset.penwidth > input:checked + label {
244 width: 2em; height: 2em;
245 background-color: #000;
246 border: 1em solid #FFF;
249 fieldset.penwidth > input[value="4"] + label { border-width: .75em; }
250 fieldset.penwidth > input[value="12"] + label { border-width: .5em; }
251 fieldset.penwidth > input[value="36"] + label { border-width: .25em; }
253 fieldset.color { bottom: 0; }
254 fieldset.color > input.color + label {
255 width: 2em; height: 2em;
259 margin: .5em 1em .125em 2%; padding: 0;
261 border: 1px solid black;
265 left: 0; bottom: .25em;
269 @media(min-width: 800px){
270 h1, label.tab, div.tab, fieldset.tab,
271 div.patient, div.prescription, div.therapies {
275 input.stickynote + .stickynote:hover { right: calc(50% + 1em); }
276 input.stickynote:checked + .stickynote { right: 50%; }
278 fieldset.color { position: fixed; }
283 right: 2em; bottom: .25em;
287 right: 2em; left: auto;
293 div.patient, div.prescription, div.therapies { margin-top: .5em; }
294 div.prescription, div.therapies {
295 border: 1px solid black;
296 padding: .125em 1.25ex .5em 1.25ex;
298 div > h2 { margin: 0; border-bottom: 1px solid black; }
300 div:nth-child(n+2) > a:first-of-type {
302 margin: .125em 0 .5em 0;
303 text-decoration: none;
307 #report fieldset.tab,
311 padding: .125em 1ex .25em 1ex;
313 background-color: #333;
318 #report label.heading {
319 background-color: #FFF;
321 border: 2px solid black;
322 border-bottom-width: 1px;
325 #report label.heading > span {
326 text-decoration: underline;
329 #report fieldset.tab > *,
330 #report label > input,
331 #report label > span {
332 display: inline-block;
336 width: 10%; float: left;
337 border: solid 1px #FFF;
338 background-color: #555;
343 #report label.heading > span.no {
344 background-color: inherit;
347 #report .tab > .date { width: 30%; }
348 #report .tab > .therapist { width: 30%; }
349 #report .tab > .signature { width: 20%; }
350 #report label.tab > .signature { font-size: .75em; }
352 #report .signature > input[type=checkbox] {
357 #report .signature > input[type=checkbox]:before {
358 display: block; width: 1.25em;
359 margin: -.125em 0 0 -.5ex;
360 background-color: #FFF;
362 content: "\00a0 \00a0 \00a0";
364 #report .signature > input[type=checkbox]:checked::before {
368 #report input.tab + label.tab > input.date,
369 #report input.tab + label.tab > input.therapist {
372 #report input.tab:checked + label.tab > input.date,
373 #report input.tab:checked + label.tab > input.therapist {
376 #report input.tab:checked + label.tab > span.date,
377 #report input.tab:checked + label.tab > span.therapist {
382 border: 2px solid #333;
383 border-top-width: 1px;
385 padding: .25em .5ex 1em .5ex;
387 #report div.tab > fieldset.note {
389 margin: 0; padding: 0;
391 #report div.tab > fieldset.note > textarea {
393 width: 93%; height: 8em;
394 margin: -8em 0 .5em 2em;
395 font: normal 1em sans-serif;
397 div.tab > fieldset.note > input.color + label { margin: 0; display: block; }
398 div.tab > fieldset.note > input.color[value="#888"]:checked ~ textarea { background-color: #AAA; }
399 div.tab > fieldset.note > input.color[value="#00A"]:checked ~ textarea { background-color: #88F; }
400 div.tab > fieldset.note > input.color[value="#0A0"]:checked ~ textarea { background-color: #8F8; }
401 div.tab > fieldset.note > input.color[value="#0AA"]:checked ~ textarea { background-color: #8FF; }
402 div.tab > fieldset.note > input.color[value="#A00"]:checked ~ textarea { background-color: #F88; }
403 div.tab > fieldset.note > input.color[value="#A0A"]:checked ~ textarea { background-color: #F8F; }
404 div.tab > fieldset.note > input.color[value="#AA0"]:checked ~ textarea { background-color: #FF8; }
405 div.tab > fieldset.note > input.color[value="#FFF"]:checked ~ textarea { background-color: #FFF; }
407 div.tab > button.delete {float: right; display: inline-block; margin-top: -1em; display: none;}