]> git.plutz.net Git - cgilite/blob - common.css
user passphrase update, improved username form
[cgilite] / common.css
1 /* ======= GENERIC HTML STYLES ======= */
2
3 * {
4   box-sizing: border-box;
5   position: relative;
6   font: inherit;
7   text-decoration: inherit;
8   color: inherit; background: transparent;
9   max-width: 100%;
10   margin: 0; padding: 0;
11   border: none;
12 }
13
14 body {
15   font: normal normal normal medium/1.5em sans-serif;
16   color: #000; background: #FFF;
17 }
18
19 ul, ol, dl, table, p { margin-bottom: .5em; }
20
21 a {
22   font-style: italic;
23   text-decoration: underline;
24   color: #068;
25 }
26 a.button {
27   font-style: inherit;
28   text-decoration: inherit;
29   color: inherit;
30 }
31
32 sup { vertical-align: super; }
33 sub { vertical-align: sub; }
34 small { font-size: .75em; }
35 big   { font-size: 1.25em; }
36 strike, del, s { text-decoration: line-through; }
37 u {text-decoration: underline; }
38 i, em { font-style: italic; }
39 b, strong { font-weight: bolder; }
40 tt, code, var, samp, kbd { font-family: monospace; }
41 kbd { font-style: italic; }
42
43 ul, ol { margin-left: 1.125em; }
44 dl dt { font-weight: bolder; }
45 table th { font-weight: bold; }
46
47 hr { border-bottom: 1pt solid; }
48
49 h1, h2, h3 {
50   font-weight: bold;
51   margin-top: .75em;
52   margin-bottom: .5em;
53 }
54
55 h4, h5, h6, form legend {
56   font-weight: bolder;
57   margin-bottom: .25em;
58 }
59
60 h1 { font-size: 1.5em; }
61 h2 { font-size: 1.125em; }
62
63 select, input, button, textarea, a.button {
64   display: inline-block;
65   color: #000; background-color: #FFF;
66   border: .5pt solid;
67   padding: .25em .75em;
68   vertical-align: text-bottom;
69   border: .5pt solid #000;
70   border-radius: 2pt;
71 }
72 select { padding: .375em 0; }
73 textarea { min-height: 7em; }
74
75 input[type=radio], input[type=checkbox] {
76   vertical-align: baseline;
77 }
78 input[type=number] { text-align: right; padding-right: 0; }
79
80 button, input[type=button], a.button {
81   box-shadow: .125em .125em .25em;
82   cursor: pointer;
83 }
84 input[type=radio], input[type=checkbox], label[for] {
85   cursor: pointer;
86 }
87
88 label { margin-right: .75em; }
89 input + label {
90   margin-left: .375em;
91 }
92
93 @media print {
94   @page { margin: 20mm; }
95
96   h1 { text-align: center; }
97
98   h1, h2, h3, h4, h5, h6, form legend {
99     page-break-inside: avoid;
100     page-break-after: avoid;
101     page-break-before: auto;
102   }
103   li { page-break-inside: avoid; }
104   th, dt { page-break-after: avoid; }
105 }
106
107 /* ======= End Generic Styles ======= */
108
109 /* ======= Common Styles ======= */
110
111 *[tooltip]:hover:after {
112   display: block;
113   position: absolute;
114   min-width: 12em;
115   bottom: 100%; left: 50%; transform: translate(-50%, 0);
116   content: attr(tooltip);
117   padding: .5em;
118   color: #000; background-color: #FFC;
119   border: .5pt solid;
120   z-index: 1;
121 }
122
123 input[type=radio].tab { display: none; }
124 input[type=radio].tab + label {
125   display: table-cell;
126   padding: .5em 1em;
127   color: #000; background-color: #EEE;
128   border: .5pt solid;
129 }
130 input[type=radio].tab:checked + label {
131   background-color: #FFF;
132   border-bottom: none;
133   box-shadow: .125em -.125em .125em #888;
134   z-index: 1;
135 }
136 input[type=radio].tab ~ *.tab {
137   display: none;
138   width: 100%;
139   margin-top: -.5pt; padding: .25em .75em;
140   border: .5pt solid;
141   border-radius: 0;
142   box-shadow: .125em .125em .125em #888;
143 }
144
145 /* ======= End Common Styles ======= */