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