1 | /* backgrounds */ |
---|
2 | |
---|
3 | html, body { background-color: #111;} |
---|
4 | |
---|
5 | #content, .content { background-color: #222;} |
---|
6 | .content .titrePage { background-color: #111;} |
---|
7 | |
---|
8 | #menubar, #the_page #menuSwitcher.menuhidden { background-color: #222;} |
---|
9 | |
---|
10 | #thePicturePage, #imageHeaderBar { background-color: #111;} |
---|
11 | #imageInfos, #infoSwitcher.infohidden { background-color: #333;} |
---|
12 | #thePicturePage #comments { background-color: #333;} |
---|
13 | #pictureCommentList li { background-color: #444;} |
---|
14 | |
---|
15 | .calendarTitle { background-color: #222;} |
---|
16 | |
---|
17 | .switchBox, .header_notes { background-color: #555;} |
---|
18 | .thumbnailCategory , .commentElement { background-color: #333;} |
---|
19 | .message { background-color: #666;} |
---|
20 | |
---|
21 | INPUT[type="text"], INPUT[type="password"], |
---|
22 | INPUT[type="button"], INPUT[type="submit"], |
---|
23 | INPUT[type="reset"], INPUT[type="file"], |
---|
24 | SELECT, TEXTAREA { background-color: #555;} |
---|
25 | INPUT:focus, SELECT:focus, TEXTAREA:focus { background-color: #666;} |
---|
26 | |
---|
27 | |
---|
28 | /* font colors */ |
---|
29 | |
---|
30 | body, legend { color: #aaa;} |
---|
31 | a { color: #ccc;} |
---|
32 | a:hover { color: #fff;} |
---|
33 | INPUT.rateButton { color: #fff;} |
---|
34 | H1, H3, INPUT.rateButtonSelected { color: #ccc;} |
---|
35 | .message { color: #fff;} |
---|
36 | .commentContent .comments_toggle:hover { color: #fff;} |
---|
37 | INPUT[type="text"], INPUT[type="password"], |
---|
38 | INPUT[type="button"], INPUT[type="submit"], |
---|
39 | INPUT[type="reset"], INPUT[type="file"], |
---|
40 | SELECT, TEXTAREA { color: #ccc;} |
---|
41 | INPUT:focus, SELECT:focus, TEXTAREA:focus { color: #fff;} |
---|
42 | |
---|
43 | |
---|
44 | /* borders */ |
---|
45 | |
---|
46 | #content,.content, .content .titrePage { border-bottom: 2px solid #444;} |
---|
47 | #imageHeaderBar { border: solid 0 #444; border-bottom-width:2px;} |
---|
48 | #copyright { border-top-width:2px;} |
---|
49 | #content .calendarTitleBar { border-bottom: none;} |
---|
50 | .calendarTitle { border-top: 2px solid #444;} |
---|
51 | .switchBox { border: 1px solid #000;} |
---|
52 | .switchBoxTitle { border-bottom: 1px solid #444;} |
---|
53 | INPUT, SELECT, TEXTAREA { border: 1px solid #666;} |
---|
54 | FIELDSET {border: 2px solid #444;} |
---|
55 | |
---|
56 | /* form */ |
---|
57 | legend {font-style:normal;} |
---|
58 | #qsearchInput {margin-left:-20px} |
---|
59 | |
---|
60 | /* icons */ |
---|
61 | |
---|
62 | .pwg-icon { background-image: url(../default/s26/outline_808080.png);} |
---|
63 | A:hover .pwg-icon { background-image: url(../default/s26/outline_ffffff.png);} |
---|
64 | |
---|
65 | |
---|
66 | /* general rules */ |
---|
67 | |
---|
68 | body { margin: 5px 0;} |
---|
69 | a:hover { border-bottom: none;} |
---|
70 | #copyright { padding:0 4px 0 0; text-align:right;} |
---|
71 | |
---|
72 | |
---|
73 | /* content */ |
---|
74 | |
---|
75 | #the_page #content.menushown, #the_page > .content.menushown, .contentWithMenu { margin-left: 240px;} |
---|
76 | #the_page #content.menuhidden, #the_page > .content.menuhidden { margin-left: 35px;} |
---|
77 | #the_page #content, #the_page > .content { margin-right: 0;} |
---|
78 | |
---|
79 | #content,.content { margin-bottom: 4px; padding-bottom: 4px;} |
---|
80 | #thePicturePage #content { padding-bottom: 0;} |
---|
81 | .content .titrePage { padding:0; margin-bottom:4px;} |
---|
82 | .content .titrePage H2 { line-height: 20px; margin: 0; padding: 8px 0 0 2px;} |
---|
83 | |
---|
84 | |
---|
85 | /* menubar */ |
---|
86 | |
---|
87 | #menubar { |
---|
88 | display: inline; |
---|
89 | width: 230px; |
---|
90 | float: left; |
---|
91 | margin: 28px 8px 10px 0; |
---|
92 | padding: 0; |
---|
93 | } |
---|
94 | #menubar DT { text-align: left;} |
---|
95 | #menubar dd { padding: 0 0 1em 1em;} |
---|
96 | #menubar .pwg-icon-filter { display: none;} |
---|
97 | |
---|
98 | #quickconnect FIELDSET { |
---|
99 | margin: 0 10px 0 -10px; |
---|
100 | border: 2px solid #444444; |
---|
101 | } |
---|
102 | |
---|
103 | /* switchers */ |
---|
104 | |
---|
105 | #menuSwitcher { |
---|
106 | display: block; |
---|
107 | text-align: center; |
---|
108 | height: 32px; |
---|
109 | cursor: pointer; |
---|
110 | float: left; |
---|
111 | margin: 28px 0 0 -34px; |
---|
112 | } |
---|
113 | |
---|
114 | |
---|
115 | #imageInfos, #infoSwitcher.infohidden { border-radius: 10px 0 0 10px;} |
---|
116 | #menubar, #the_page #menuSwitcher.menuhidden { border-radius: 0 10px 10px 0;} |
---|
117 | #the_page #menuSwitcher.menuhidden { width: 25px; margin-left: 0;} |
---|
118 | |
---|
119 | #infoSwitcher { |
---|
120 | display: block; |
---|
121 | text-align: center; |
---|
122 | height: 32px; |
---|
123 | cursor: pointer; |
---|
124 | position:absolute; |
---|
125 | left:75%; |
---|
126 | top:0; |
---|
127 | margin: 10px 0 0 7px; |
---|
128 | z-index:99; |
---|
129 | } |
---|
130 | |
---|
131 | #infoSwitcher.infohidden { |
---|
132 | width:25px; |
---|
133 | top:10px; |
---|
134 | right:0; |
---|
135 | left:auto; |
---|
136 | margin:0; |
---|
137 | } |
---|
138 | |
---|
139 | #slideshow #theImage { width: 100%; margin: auto; overflow: visible;} |
---|
140 | #theImage.infohidden { width: 100%;} |
---|
141 | |
---|
142 | #commentsSwitcher { float: left; margin: 2px 0; cursor:pointer;} |
---|
143 | .noCommentContent #commentsSwitcher { display: none;} |
---|
144 | |
---|
145 | .switchArrow { width: 16px; height: 16px; margin: 8px 5px 8px 4px;} |
---|
146 | .switchArrow { background: transparent url("icon/arrows_ccc.png");} |
---|
147 | .switchArrow:hover { background: transparent url("icon/arrows_fff.png");} |
---|
148 | .menuhidden .switchArrow { background-position: 0 0;} |
---|
149 | .menushown .switchArrow { background-position: -16px 0;} |
---|
150 | .infohidden .switchArrow { background-position: -16px 0;} |
---|
151 | .infoshown .switchArrow { background-position: 0 0;} |
---|
152 | .commentshidden .switchArrow { background-position: -48px 0;} |
---|
153 | .commentsshown .switchArrow { background-position: -32px 0;} |
---|
154 | |
---|
155 | |
---|
156 | /* switchboxes */ |
---|
157 | |
---|
158 | .switchBox { |
---|
159 | border-radius: 4px 4px 4px 4px; |
---|
160 | padding: 0.5em 10px; |
---|
161 | text-align: left; |
---|
162 | z-index: 100; |
---|
163 | } |
---|
164 | .derivativeSizeDetails { display: none;} |
---|
165 | |
---|
166 | /* thumbnails */ |
---|
167 | |
---|
168 | #thumbnails { padding-top: 5px;} |
---|
169 | .thumbnailCategory .illustration, |
---|
170 | .commentElement .illustration { margin: 2px; text-align: center;} |
---|
171 | |
---|
172 | |
---|
173 | /* picture page */ |
---|
174 | |
---|
175 | .contentWithMenu #imageHeaderBar { padding: 0;} |
---|
176 | #imageHeaderBar { padding: 0 0 0 10px;} |
---|
177 | #imageHeaderBar { width: auto;} |
---|
178 | #imageHeaderBar h2 { font-size: 100%; font-weight: inherit;} |
---|
179 | #imageHeaderBar .browsePath { |
---|
180 | display:inline-block; |
---|
181 | float:left; |
---|
182 | font-size:120%; |
---|
183 | line-height:20px; |
---|
184 | padding: 8px 0 0 2px; |
---|
185 | font-weight:bold; |
---|
186 | margin:0; |
---|
187 | } |
---|
188 | #imageToolBar .imageNumber { display: inline-block; float: right; line-height: 26px; margin: 0 2px 0 0; min-width: 40px; text-align: center;} |
---|
189 | #imageToolBar { margin-top: -28px; margin-bottom: 0; float: right;} |
---|
190 | #thePicturePage .pwg-button { width: 26px;} |
---|
191 | #thePicturePage .actionButtons { margin-right: 26px;} |
---|
192 | |
---|
193 | #theImageAndInfos { |
---|
194 | display: block; |
---|
195 | width: 100%; |
---|
196 | position: relative; |
---|
197 | } |
---|
198 | #theImage { |
---|
199 | display: inline-block; |
---|
200 | width: 75%; |
---|
201 | vertical-align: top; |
---|
202 | overflow: auto; |
---|
203 | padding: 10px 0 5px 0; |
---|
204 | } |
---|
205 | |
---|
206 | .rateButtonStarFull { background: url('icon/rating-stars.png') no-repeat -16px center; width:16px;} |
---|
207 | .rateButtonStarEmpty { background: url('icon/rating-stars.png') no-repeat 0 center; width:16px;} |
---|
208 | |
---|
209 | |
---|
210 | /* image infos */ |
---|
211 | |
---|
212 | #imageInfos { |
---|
213 | display: inline-block; |
---|
214 | width: 24.5%; |
---|
215 | vertical-align: top; |
---|
216 | padding-top: 35px; |
---|
217 | padding-bottom: 5px; |
---|
218 | margin: 10px 0 10px 0.5%; |
---|
219 | word-wrap:break-word; |
---|
220 | } |
---|
221 | |
---|
222 | #imageInfos .navThumbs { width: 250px; height: 130px; margin: auto; padding: 0 5px;} |
---|
223 | #imageInfos .navThumb { position: relative; width: 120px; height: 120px; margin: 0; overflow: hidden;} |
---|
224 | #imageInfos #linkPrev { float: left;} |
---|
225 | #imageInfos #linkNext { float: right;} |
---|
226 | #imageInfos .thumbHover { position: absolute; width: 100%; height: 100%;} |
---|
227 | #imageInfos .prevThumbHover { background: transparent url(icon/none.png) no-repeat center center;} |
---|
228 | #imageInfos .prevThumbHover:hover { background: transparent url(icon/img_prev.png) no-repeat center center;} |
---|
229 | #imageInfos .nextThumbHover { background: transparent url(icon/none.png) no-repeat center center;} |
---|
230 | #imageInfos .nextThumbHover:hover { background: transparent url(icon/img_next.png) no-repeat center center;} |
---|
231 | |
---|
232 | #imageInfos dl.imageInfoTable { display: block; padding: 0 15px; margin: 12px auto;} |
---|
233 | #imageInfos .imageInfo { display: block; line-height: 16px;} |
---|
234 | #imageInfos .imageInfo dt { display: block; font-weight: bold; text-align: left; padding: 0;} |
---|
235 | #imageInfos .imageInfo dd { display: block; text-align: left; margin: 0 0 5px 20px;} |
---|
236 | #imageInfos h3 { margin: 20px 0 10px;} |
---|
237 | |
---|
238 | |
---|
239 | /* image comments */ |
---|
240 | |
---|
241 | #thePicturePage #comments { padding: 2px 5px;} |
---|
242 | #thePicturePage #comments h3 { margin: 10px 0;} |
---|
243 | #thePicturePage #comments form { margin: 10px 0;} |
---|
244 | #thePicturePage #comments fieldset { margin: 0 1em;} |
---|
245 | |
---|
246 | .commentshidden #pictureComments { display: none;} |
---|
247 | .commentContent .comments_toggle { cursor: pointer;} |
---|
248 | |
---|
249 | #commentAdd, #pictureCommentList { width: 48%; padding: 0 1%;} |
---|
250 | #commentAdd { float: left; } |
---|
251 | #pictureCommentList { float: right; } |
---|
252 | |
---|
253 | #commentAdd input[type="text"], |
---|
254 | #commentAdd textarea { |
---|
255 | width: 95%; |
---|
256 | font-family: Arial,Helvetica,sans-serif; |
---|
257 | font-size: 100%; |
---|
258 | } |
---|
259 | |
---|
260 | #pictureCommentList .commentsOrder { float: left; margin-bottom: 5px;} |
---|
261 | #pictureCommentList .navigationBar { float: right; margin-bottom: 5px;} |
---|
262 | #pictureComments h4 { margin: 0;} |
---|
263 | #pictureComments form p { margin: 5px 0;} |
---|
264 | #pictureComments form p textarea { margin: 10px 0;} |
---|
265 | #pictureComments INPUT { margin: 10px;} |
---|
266 | #pictureComments INPUT[type=submit] { margin: 0;} |
---|
267 | .commentElement .description { padding: 5px;} |
---|
268 | |
---|
269 | |
---|
270 | /* calendar */ |
---|
271 | |
---|
272 | .calendarViews { margin-top: 4px;} |
---|
273 | |
---|
274 | /* plugins */ |
---|
275 | |
---|
276 | #the_page .content .stuffs { margin: 0!important} |
---|
277 | .categoryActions .theme_menuf { display: none;} |
---|