source: extensions/luciano/theme.css @ 16052

Last change on this file since 16052 was 16052, checked in by plg, 12 years ago

force width to 150px (auto doesn't work on IE8)
File size: 20.0 KB
Line 
1html, body, div, span, applet, object, iframe, h2, h1, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
2del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset,
3form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
4        { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; }
5
6body                                            { line-height: 1; }
7ol, ul                                          { list-style: none }
8blockquote, q           { quotes: none }
9blockquote:before,
10blockquote:after,
11q:before,
12q:after                                 { content: ''; content: none }
13:focus                                  { outline: 0 }/* remember to define focus styles! */
14ins                                                     { text-decoration: none }/* remember to highlight inserts somehow! */
15del                                                     { text-decoration: line-through }
16table                                           { border-collapse: collapse; border-spacing: 0 }/* tables still need 'cellspacing="0"' in the markup */
17
18/* FORM */
19fieldset, form, label, legend   { margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;        vertical-align:baseline; }
20fieldset                                                                                { margin: 0; padding-right: 2em; }
21legend { padding: 0; }
22textarea, input, select, label, button, optgroup        { margin-top:5px; }
23input[type="checkbox"] ,input[type="radio"]     { margin-bottom:7px; }
24
25fieldset                { border:0px; }
26legend                  { display: none; }
27label                           { color:#999; }
28textarea                { border: 1px solid #666; }
29textarea:focus
30input:focus, #menubar input:focus       { border: 1px solid #666; }
31select                  { background-color: #222; color: #666; }
32input, #menubar input { border: 1px solid #444; background-color: #222; color: #666; }
33input[type="submit"], #menubar input[type="submit"] { background-color: #666; color: #222; }
34input[type="submit"]:hover, #menubar input[type="submit"]:hover { background-color: #222; color: #666; cursor: hand; }
35input[type="checkbox"]                  { color: #000; border: 0 none; vertical-align: middle; }
36input[type="radio"]                                     { background-color: transparent; border:0 none; color: #000; }
37option, optgroup                                                { background-color:#222; color:#666; }
38
39FORM.properties fieldset { border: 1px solid; margin: 15px; padding: 1em;}
40FORM.properties legend { display: block; padding:5px;}
41FORM.properties li { clear:left; line-height:1.8em; margin-bottom:0.5em; padding:0; }
42FORM.properties span.property { float:left; font-weight:bold; margin:0; padding:0 0.5em 0 0; text-align:right; width:50%; }
43FORM.properties span.property label { float:left; width:98%; display:block; clear:left; text-align:right; margin-top:0; }
44FORM #themeSelect, form #languageSelect  { float: left; line-height:0.8em; padding:0.3em 0 0.7em 0; cursor:pointer;}
45
46/***** STYLE ****/
47html, body      {
48 background-color: #111;
49 color: #666;
50 font-family: Corbel, Lucida Grande, Lucida Sans Unicode, Lucida Sans, DejaVu Sans, Bitstream Vera Sans, Liberation Sans, Verdana, sans-serif;
51}
52
53p                                               { margin: 10px;}
54a, a:visited    { color: #ddd; text-decoration: none; }
55a:hover                         { color: #fff; text-decoration:none; border:none; }
56h2 a                                    { margin-left: 3px; }
57
58#the_page                                                                       { /* position: relative; */ width: 1024px; margin: 0 auto; text-align: center }
59#thePicturePage #the_page {position:relative;}
60#theHeader,.content                     { text-align: left }
61
62#theHeader                                                      { padding-top: 20px; margin-bottom: 20px; }
63#theHeader h1                                           { color: #fff; font-size: 1.4em; text-align:left;}
64#theHeader h1,
65#theHeader h1 a,
66#theHeader h1 a:visited,
67#theHeader h1 a:hover                   {color: #fff; border: none }
68
69#theHeader p                                                    { margin-left: 20px; margin-top: -4px; margin: -4px 0 10px 20px; color: #666; border: none }
70
71#headerMenu                                                     { position: absolute; top: 40px; right: 0  }
72#headerMenu li                                          { float: left; margin-left: 40px }
73
74#imagerotator                                           {position: relative; margin-top: 0px; height: 100px }
75#imagerotator img                               {position: absolute; top: 0; left: 0 }
76
77#copyright                                              { clear: both; margin: 20px 0 5px 0; padding-top: 5px; border-top: 2px solid #222; text-align: left; text-align: right; line-height: 1.2em }
78#copyright span                         { color: #444; }
79#copyright a,
80#copyright a:visited,
81#copyright a:hover                      { color: #444; }
82#copyright a:hover                      { color: #666; }
83#copyright .cName                       { color: #555; font-weight: bold }
84
85/***** LAYOUT GALLERY ****/
86
87#rss            { position: absolute; top: 10px; right: 0;  }
88#rss a          { display: block; width: 28px; height: 28px; text-indent: -2000px; border: 0;   background: transparent url('icon/rss.png'); }
89
90.content {
91/*
92  float: right;
93*/
94  width: 750px;
95  margin-bottom: 10px;
96  padding-bottom: 10px;
97  /* position: relative; */
98  background: transparent url(skin/750darkBottom.png) bottom left;
99}
100.content .titrePage {
101 background: transparent url(skin/750darkTop.png) no-repeat;
102}
103
104/* special for PWG Stuff blocks on picture.php with menubar available on picture.php but disabled - starts here */
105#thePicturePage .content {
106  width: 1024px;
107  background: transparent url(skin/1024darkBottom.png) bottom left;
108}
109
110#thePicturePage .content .titrePage {
111  background: transparent url(skin/1024darkTop.png) no-repeat;
112}
113/* special for PWG Stuff blocks on picture.php with menubar available on picture.php but disabled - stops here */
114
115.content dl {margin: 25px;}
116
117
118#menubar { float: left; width: 264px; margin: 0 0 20px 0; text-align: left; color: #888; }
119#menubar dl     { width: 264px; background: transparent url(skin/264grey3.png); margin-bottom: 10px; }
120#menubar dt     { margin-left: 10px; padding-top: 10px; margin-bottom: 10px; font-size: 1.2em; font-weight: 700; text-align:left; }
121
122#menubar dd                                             { width: 264px; background: transparent url(skin/264grey3.png) bottom left; }
123#menubar dd a,
124#menubar dd a:visited   { color: #eee; }
125#menubar dd a:hover             { color: #f70; }
126
127#menubar dt a,
128#menubar dt a:visited           { color: #f70; }
129#menubar dt a:hover                     { color: #eee;}
130
131#menubar ul { list-style: none outside none;}
132#menubar dd ul { padding: 0 5px 10px 30px; }
133#menubar form { padding: 0 5px 5px 5px; margin-top:-20px;}
134#menubar #quicksearch {margin-top:-10px}
135
136#menubar #menuTagCloud                  { padding: 0 10px 10px 15px; }
137#menubar #menuTagCloud span { margin-right:5px; white-space:nowrap; }
138
139#menubar dd ul ul { padding-left: 15px; }
140
141#menubar #quickconnect div { margin-bottom: 3px; }
142
143#menubar .totalImages   { margin:0 10px; padding-bottom:10px; }
144#menubar .actions                       { padding:0; }
145#menubar .button                        { float:right; margin-right:10px; }
146
147/* ELEMENTS */
148
149.content .titrePage                                             { padding: 10px 0 5px 10px; height: 30px; }
150.titrePage h1                                   { float: left; }
151.content .additional_info {padding: 10px; text-indent: 20px; color: #666; text-align:justify;font-size:100%; }
152.thumbnailCategories    { margin-left: 10px; margin-bottom:10px;}
153
154.thumbnailCategories li                         { background: transparent url(skin/catBg.png) 0 0; width: 355px; height: 170px; float: left; margin-right: 15px; margin-top: 10px }
155.thumbnailCategories li:hover   { background: transparent url(skin/catBg.png) 0 -170px; }
156
157.thumbnailCategory .illustration                { float: left; width: 150px !important; margin: 0; }
158.thumbnailCategory .illustration img {max-width:150px;max-height:150px;}
159.thumbnailCategory .description                 { float: right; width: 180px; margin-top: 0; height: 160px !important; overflow:hidden; }
160.thumbnailCategory .description h3      { margin-bottom: 10px; font-weight: 700; color: #f70; }
161.thumbnailCategory .Nb_images                   { font-size: 0.8em; margin-bottom: 10px; }
162.thumbnailCategory .desc                                                { font-size: 0.9em; }
163
164.thumbnails                                                             { margin-left: 10px; min-height: 540px; height: auto !important; height: 540px; text-align: center;}
165.thumbnails li                                          { float: left; display: inline; width: 170px; height: 170px; margin-left: 10px; margin-bottom: 10px; background: transparent url(skin/thumbBg.png) 0 0;}
166.thumbnails li:hover                    { background: transparent url(skin/thumbBg.png) 0 -170px; }
167.thumbnails li .wrap2           { width:170px; height:172px; display:table-cell; vertical-align:middle;}
168.thumbnails SPAN, .thumbnails .wrap2 A, .thumbnails LABEL { width: 150px !important; } /* todo remove this and manage smart dimensions for multisize */
169.thumbnails li img                              { border: 1px solid #222; border-left: 1px solid #444; border-bottom: 1px solid #444; max-height:150px;max-width:150px;} /* todo remove max-* and manage smart dimensions for multisize */
170.thumbnails li:hover img        { border: 1px solid #111; border-left: 1px solid #222; border-bottom: 1px solid #222; }
171
172.thumbnails .thumbLegend { display:none; }
173
174.categoryActions                { float:right; margin-right: 10px; }
175.categoryActions li     { float: left; margin-left:5px; display: inline; }
176#order                                                  { float: left; margin: 2px 5px 0 0;}
177#orderText                                      { float: left; margin: 2px 8px 0 0; }
178#playSlideshow                  { width: 200px; float: left; margin-left: 20px; margin-top: 10px; }
179#playSlideshow a                { color: #666; }
180
181.content .navigationBar                                                 { clear: both; color:#444; text-align: right; padding: 10px 30px }
182.content .navigationBar span,
183.content .navigationBar a                                       { border: 1px solid; padding: 0px 5px; }
184.content .navigationBar a,
185.content .navigationBar a:visited       { color: #999}
186.content .navigationBar a:hover         { color: #eee}
187
188.navigationBarSimple                                                    { color:#666; text-align: center; position:relative;}
189.navigationBarSimple span,
190.navigationBarSimple a                                          { height: 150px; width: 20px; border: 0; padding: 0; text-indent: -3000px; }
191.navigationBarSimple .prew                              { position: absolute; top: -350px; left: 0px; background: transparent url(icon/prew.png) no-repeat scroll; }
192.navigationBarSimple .next                              { position: absolute; top: -350px; right: 0px; background: transparent url(icon/next.png) no-repeat scroll;  }
193.navigationBarSimple a.prew:hover { background: transparent url(icon/prew.png) 0 -150px no-repeat scroll; }
194.navigationBarSimple a.next:hover { background: transparent url(icon/next.png) 0 -150px no-repeat scroll; }
195
196/****** CALENDAR => Not fixed yet */
197
198table.calMonth tbody td,
199table.calMonth tbody td div.calImg { height:80px; padding:1px 2px; width:80px; }
200
201.content DIV.calendarViews                      { display: block; float: right; margin: -20px 0 0; }
202.content DIV.calendarCalBar                     { margin: 10px 10px; text-align: left; }
203SPAN.calItem, SPAN.calItemEmpty { font-weight: bold; margin: 0 1px; }
204SPAN.calItem A                                                                  { border:0 }
205SPAN.calCalHead                                                                 { font-weight: bold; font-size: 110%; margin: 0 2px; }
206SPAN.calCal                                                                                     { margin: 0 2px; }
207
208.calendarBar                            { margin:15px; }
209TABLE.calMonth                  { border: none; margin:10px auto; }
210TD.calDayCellFull,
211TD.calDayCellEmpty,
212TD.calDayCellBlank      { vertical-align: top; font-weight: bold; font-size: 18px; }
213TD.calDayHead                           { font-weight: bold; font-size: 12px; text-align: center; padding:10px; }
214DIV.calImg                                      { overflow: hidden; vertical-align: bottom; z-index: 1; position: relative; }
215.calImg img                                     {       position: relative;     border: 0; }
216.calBackDate                            { padding-left: 4px;    padding-top: 0px;       z-index: 2;     position: absolute;     vertical-align: top; color: #000; }
217.calForeDate                            { padding-left: 5px;    padding-top: 1px;       z-index: 3;     position: absolute;     vertical-align: top; color: #fff; }
218
219/****** TAGS */
220#fullTagCloud                           { font-size:120%; margin:1em 2em; padding:0; text-align:justify; }
221#fullTagCloud span      { margin:0 2px; white-space:nowrap; }
222
223.tagLevel5 { font-size: 150% !important; }
224.tagLevel4 { font-size: 140% !important; }
225.tagLevel3 { font-size: 120% !important; }
226.tagLevel2 { font-size: 100% !important; }
227.tagLevel1 { font-size: 80%  !important; }
228
229#theTagsPage TABLE { width:100%; }
230#theTagsPage TD { vertical-align: top; }
231
232FIELDSET.tagLetter                      { border: 1px solid #444; margin: 0.5em; padding: 10px; }
233LEGEND.tagLetterLegend  { display:block; border: 1px solid #444;        font-size:120%; font-weight: bold; padding: 0 5px; font-style: normal; }
234TABLE.tagLetterContent  { width:100%;   border-collapse:collapse; }
235
236/****** SEARCH PAGE */
237FORM.filter FIELDSET    { border: 1px solid; padding: 1em;      margin: 1em; overflow: hidden; }
238FORM.filter legend              { display: block; padding:5px;}
239FORM.filter label                       { width:auto; clear:none; margin-top:0; }
240
241FORM.filter FIELDSET UL { margin: 0; }
242FORM.filter FIELDSET UL,
243FORM.filter FIELDSET LABEL { display: block; float: left;       margin-right: 1em; padding: 0; }
244FORM.filter FIELDSET LI {       list-style: none;       margin-bottom: 0.5em; }
245FORM.filter FIELDSET LI LABEL { display: inline; float: none; }
246FORM.filter FIELDSET UL.tagSelection LABEL { display: inline;   float: none; margin-right:0.5em; }
247
248FORM.filter FIELDSET LABEL INPUT,
249FORM.filter FIELDSET LABEL SELECT,
250FORM.filter FIELDSET LABEL SPAN,
251FORM.filter FIELDSET LABEL TEXTAREA { display: block; margin: 0.5em 0; }
252
253FORM.filter FIELDSET * LABEL INPUT,
254FORM.filter FIELDSET * LABEL SELECT,
255FORM.filter FIELDSET * LABEL TEXTAREA,
256FORM.filter FIELDSET LABEL SPAN INPUT,
257FORM.filter FIELDSET LABEL SPAN SELECT,
258FORM.filter FIELDSET LABEL SPAN TEXTAREA { display: inline;     vertical-align: top; margin: 0 0.5em 0 0; }
259
260FORM.filter FIELDSET UL.tagSelection LI LABEL INPUT {   margin-right:0; }
261FORM.filter FIELDSET LABEL SPAN SELECT { margin: 0; }
262FORM.filter FIELDSET P { clear: left;   display: block; }
263FORM.filter INPUT[type="submit"] { margin-top: 1em; }
264
265FORM.filter select.categoryList { height:20em; width:500px;}
266
267/****** PHOTO */
268#imageHeaderBar         { height: 30px;}
269
270#slidshowToolBar        { position: absolute; top: 60px; margin-left: 400px; height: 33px;  }
271
272#imageHeaderBar .imageNumber { width: 70px; font-size: 3em; font-style: italic; color: #222; position: absolute; top: 20px; right:0; }
273#imageHeaderBar .browsePath     { float: left; }
274.randomButtons  { float: right; }
275.randomButtons li       { float: left; margin-left: 15px;}
276
277#theImage                               { clear: left; text-align: left; margin-top: 20px; }
278#imageContainer { position: relative; width: 1024px; height: 600px; }
279#theImg                                 { display: block; margin: 0 auto; border: none; text-align: center; }
280
281#linkThumbs                     { position: absolute; top: 0; left: 400px; width: 224px; height: 600px; }
282#linkPrev                               { position: absolute; top: 0; left: 0; width: 150px; height: 600px; text-align: left; background: transparent url(icon/thumbPrev.png) center left no-repeat; }
283#linkNext                               { position: absolute; top: 0; left: 874px; width: 150px; height: 600px; text-align: right; background: transparent url(icon/thumbNext.png) center right no-repeat; }
284#linkPrev img           { margin-left: 0; margin-top: 225px; border: 1px solid #f70; }
285#linkNext img           { margin-right: 0; margin-top: 225px; border: 1px solid #f70; }
286
287#imageInfo                      { margin-top: 10px; }
288#imageInfoLeft  { float: left; width: 500px; text-align: left; margin-bottom: 10px; }
289#imageInfoRight { float: right; width: 350px; height: 40px; text-align: right; margin-bottom: 10px; }
290
291#imageTags                      { margin-top:5px; }
292#ratingSummary  { margin-bottom: 3px; }
293
294#rateForm input         { height: 25px; margin: 0}
295
296.rateButtonEmpty,                               
297.rateButtonReset,                               
298.rateButtonHalf,                               
299.rateButtonFull,                               
300.rateButtonUserFull,                           
301.rateButtonUserEmpty,                   
302.rateButtonUserHalf             { padding:0; border:0; cursor: pointer;}
303
304.rateButtonSelected             { font-weight:bold; font-size:120%; }
305.rateButtonEmpty                        { width:25px; background: url('icon/star.png') 0 0 no-repeat scroll; }
306.rateButtonReset                        { width:25px; background: url('icon/star.png') 0 -25px no-repeat scroll; }
307.rateButtonHalf                                 { width:25px; background: url('icon/star.png') 0 -50px no-repeat scroll; }
308.rateButtonFull                                 { width:25px; background: url('icon/star.png') 0 -75px no-repeat scroll; }
309.rateButtonUserFull             { width:25px; background: url('icon/star.png') 0 -100px no-repeat scroll; }
310.rateButtonUserEmpty    { width:25px; background: url('icon/star.png') 0 -125px no-repeat scroll; }
311.rateButtonUserHalf             { width:25px; background: url('icon/star.png') 0 -150px no-repeat scroll; }
312
313.rateButtonEmpty2                       { width:25px; background: url('icon/star.png') 0 0 no-repeat scroll; }
314.rateButtonHalf2                        { width:25px; background: url('icon/star.png') 0 -50px no-repeat scroll; }
315.rateButtonFull2                        { width:25px; background: url('icon/star.png') 0 -75px no-repeat scroll; }
316.rateButtonUserFull2    { width:25px; background: url('icon/star.png') 0 -100px no-repeat scroll; }
317.rateButtonUserEmpty2   { width:25px; background: url('icon/star.png') 0 -125px no-repeat scroll; }
318.rateButtonUserHalf2    { width:25px; background: url('icon/star.png') 0 -150px no-repeat scroll; }
319
320.rateShow                                                       { float: right; width: 125px; height: 25px; background: url('icon/star.png') repeat-x scroll;}
321.rateFull1                                              { display: block; float: left; width: 25px; height: 25px; background: url('icon/star.png') 0 -75px repeat-x scroll;}
322.rateFull2                                              { display: block; float: left; width: 50px; height: 25px; background: url('icon/star.png') 0 -75px repeat-x scroll;}
323.rateFull3                                              { display: block; float: left; width: 75px; height: 25px; background: url('icon/star.png') 0 -75px repeat-x scroll;}
324.rateFull4                                              { display: block; float: left; width: 100px; height: 25px; background: url('icon/star.png') 0 -75px repeat-x scroll;}
325.rateFull5                                              { display: block; float: left; width: 125px; height: 25px; background: url('icon/star.png') 0 -75px repeat-x scroll;}
326.rateHalf                                                       { display: block; float: left; width: 25px; height: 25px; background: url('icon/star.png') 0 -50px repeat-x scroll;}
327
328/****** Lost Password Page */
329#lostPassword label {float:none;}
330
331/* OTHERS */
332
333.content form   { margin: 10px; }
334
335.errors,
336.infos                          { margin: 10px; color: #fff; font-weight: 700; }
337.errors p,
338.infos p                                { margin: 30px 0 10px ; color: #900; }
339.errors li,
340.infos li                               { list-style: decimal; margin-left: 30px;}
341
342.idLink                         { margin-top: 20px; }
343
344/* MOOTOOLS PLUGIN */
345
346.elSelect                                                               { width: 160px; height: 20px; background: transparent url(elSelect/select_bg.png) no-repeat 0 0; }
347.elSelect .clear                                { clear: both; }
348
349.elSelect .selected                             { color: #333 !important; background-color: #999 !important; }
350.elSelect .selectedOption       { color: #222; float: left; padding: 4px 0 0 6px; width: 87px; font-weight: bold; font-size: 12px; overflow: hidden; cursor:pointer; }
351.elSelect .option                                       { color: #555; background-color: #bbb; border-left: solid 1px #555; border-right: solid 1px #555; padding: 4px 0 5px 5px; text-align: left; font-weight: bold; font-size: 12px; }
352.elSelect .disabled                             { color:#999; background-color: #333; border-left: solid 1px #555; border-right: solid 1px #555; }
353.elSelect .dropDown                             { width: 23px; height: 20px; float: right; background: url(elSelect/select_arrow.png) no-repeat 0% 0%; cursor:pointer;}
354.elSelect .optionsContainerTop                          { background: url(elSelect/top_center.gif) repeat-x 0% 0%; position: absolute; width: 100%; height: 5px; }
355.elSelect .optionsContainerTop div                      { background: url(elSelect/top_left.gif) no-repeat 0% 0%; width: 100%; height: 5px; }
356.elSelect .optionsContainerTop div div          { background: url(elSelect/top_right.gif) no-repeat 100% 0%; width: 100%; height: 5px; }
357.elSelect .optionsContainerBottom                       { position: absolute; margin: -5px 0 0 0; width: 100%; height: 5px; background: url(elSelect/bottom_center.gif) repeat-x 0% 0%;}
358.elSelect .optionsContainerBottom div   { background: url(elSelect/bottom_left.gif) no-repeat 0% 0%; width: 100%; height: 5px; }
359.elSelect .optionsContainerBottom div div { background: url(elSelect/bottom_right.gif) no-repeat 100% 0%; width: 100%; height: 5px; }
360.elSelect .optionsContainer                                             { position: absolute; display: none; z-index: 1; }
361.icon_1         { background: url(elSelect/icon_1.gif) no-repeat 4px 50%; padding-left: 20px !important; }
362.icon_2         { background: url(elSelect/icon_2.gif) no-repeat 4px 50%; padding-left: 20px !important; }
363
364/* LanguageSwitch */
365/*
366#languageSwitchLink .pwg-button-text {display:none;}
367
368#languageSwitchLink .pwg-icon {
369  display: inline-block;
370  height: 26px;
371  overflow: hidden;
372  text-indent: -9999px;
373  vertical-align: bottom;
374  width: 26px;
375}
376*/
377
378/* icons */ 
379.pwg-icon { background-image: url(../default/s26/outline_808080.png);}
380A:hover .pwg-icon { background-image: url(../default/s26/outline_ffffff.png);}
381
382.contentWithMenu {
383  margin-left: 275px;
384}
385
386.switchBox {
387  border: 1px solid #000000;
388  background-color: #555;
389  color:#aaa;
390  font-size:14px;
391}
392
393.switchBoxTitle {
394  border-bottom: 1px solid #444444;
395}
396
397#derivativeSwitchLink {display:none;}
Note: See TracBrowser for help on using the repository browser.