source: extensions/hr_os_xl/theme.css @ 22443

Last change on this file since 22443 was 20153, checked in by flop25, 12 years ago

optimal size
switchlanguage style

todo lang file to spread

File size: 14.1 KB
Line 
1/* ---------------------------------------------------------------------------
2Theme hr_os_xl
3
4child-theme of hr_os_xl
5
6by flop25 http://www.planete-flop.fr/
7------------------------------------------------------------------------------ */
8
9@import "menu.css";
10@import "iconset.css";
11
12* { margin: 0; padding: 0; border: 0; }
13
14body {
15        background-image: url(img/background.bg3.1.jpg);
16        background-repeat: repeat-y;
17        background-position: center center;
18        background-color:#7f7f7f;
19        font-size:0.7em;
20        font-family: Verdana,Arial,Helvetica,sans-serif;
21}
22/*
23*********-> autre possibilté :
24body {
25        background-image: url(img/background.bg3.jpg);
26        background-repeat: repeat-y;
27        background-position: center center;
28        background-color:#a19fa0;
29        font-size:0.7em;
30        font-family: Verdana,Arial,Helvetica,sans-serif;
31}
32*/
33
34* { outline: none }
35
36/* Common styles
37-------------------------------------------------------- */
38h2, h3 { color:#696969; }
39ul { list-style: none; }
40ul li { list-style: none; }
41
42a, a:link { color:#0066CC; text-decoration: none; border:0; }
43a:hover { text-decoration: none; border-bottom:1px solid #0066CC;}
44/*a:visited { color:#333333;}*/
45
46pre { overflow: auto; width: 100%; height: auto; }
47.left { float: left; }
48.right { float: right; }
49
50img{ border: 0; }
51#comments H2, .titrePage h2 {
52background-image: url(img/fondMenu2_2.jpg);
53background-repeat:repeat-x;
54background-color:#000000;
55        color: #FFF;
56        border: 0;
57}
58.titrePage a, .categoryActions, .calendarViews {
59        color: #FFF;
60}
61#languageSwitchBox, #derivativeSwitchBox, #sortOrderBox {
62        font-size: 11px;
63        color: #000033;
64        text-shadow: 0 0 2px #ccc;
65        padding: 4px 8px;
66        border: 1px solid rgba(255,255,255,0.25);
67        background-color: rgb(255,255,255);
68        background-color: rgba(255,255,255,0.92);
69        background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), to(#fff));
70        border-radius: 3px;
71        -webkit-border-radius: 3px;
72        -moz-border-radius: 3px;
73        box-shadow: 0 0 5px #555;
74        -webkit-box-shadow: 0 0 5px #555;
75        -moz-box-shadow: 0 0 5px #555;
76}
77#languageSwitchBox{
78        font-size: 11px;
79        color: #000033 !important;
80        text-shadow: 0 0 2px #ccc;
81        padding: 4px 8px;
82        border: 1px solid rgba(255,255,255,0.25);
83        background-color: rgb(255,255,255) !important;
84        background-color: rgba(255,255,255,0.92)!important;
85        background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), to(#fff));
86        border-radius: 3px;
87        -webkit-border-radius: 3px;
88        -moz-border-radius: 3px;
89        box-shadow: 0 0 5px #555;
90        -webkit-box-shadow: 0 0 5px #555;
91        -moz-box-shadow: 0 0 5px #555;
92}
93#derivativeSwitchBox A, #sortOrderBox A {
94        color: #000;
95}
96
97#derivativeSwitchBox A:hover, #sortOrderBox A:hover {
98        text-shadow: 0 0 2px #000;
99}
100#languageSwitchBox A {
101        color: #000 !important;
102}
103
104#languageSwitchBox A:hover {
105        text-shadow: 0 0 2px #000 !important;
106}
107
108/* Page
109-------------------------------------------------------- */
110BODY#thePicturePage,BODY#theCategoryPage, BODY#theTagsPage {}
111
112#the_page {
113        width: 940px;
114        margin: 0 auto;
115        background: transparent url(img/back.jpg) repeat-y top center;
116}
117
118#content div.titrePage { padding: 10px 3px; }
119
120/* Header
121-------------------------------------------------------- */
122#theHeader {
123        background: transparent url(img/header_b.jpg) no-repeat center bottom;
124        height: 210px;
125        margin: 0 auto;
126}
127        #theHeader h1 { 
128                font-size: 2em; 
129                margin: 0;
130        /*      padding: 170px 34px 0 34px; */
131                color: #fff; 
132                text-align: left; 
133                position: absolute;
134                left: 30px;
135                top: 170px;
136        }
137        #theHeader p {display:none;}
138/*      #theHeader a:link, #theHeader a:visited, #theHeader a:hover { color: #FFF; text-decoration: none; }*/
139
140body#theCommentsPage .content, body#theUploadPage .content, body#theRegisterPage .content, body#theIdentificationPage .content, body#theProfilePage .content, body#theSearchPage .content, body#theAboutPage .content, body#thePopuphelpPage .content, body#thePasswordPage .content, body#theNotificationPage .content, body#theTagsPage .content, body#theNBMPage .content, #content, BODY#theAdminPage #content, BODY#theTagsPage #content, #theCategoryPage .content {
141        width: 898px;
142        margin: 0 auto;
143}
144
145
146.row1 { background-color: #999;}
147.throw { background-color: #999;}
148
149/*      Page Catégories
150-----------------------------------------------------------------------------------------------*/
151#content div.thumbnailCategory { 
152        padding: 2px; 
153/*      text-align: center;    */
154}
155#content div.thumbnailCategory:hover {
156        border:1px solid #0066cc;
157        background-color: #eee;
158}
159#content ul.thumbnailCategories li { width:49.9%; }
160
161/*      Page Image
162-----------------------------------------------------------------------------------------------*/
163#linkNext {
164    float: right;
165    margin-left: 10px;
166    margin-right: 15px;
167}
168#linkPrev {
169    float: left;
170    margin-left: 15px;
171    margin-right: 10px;
172}
173#imageToolBar, #imageHeaderBar {
174        width: 860px;
175        margin: 10px auto;
176}
177#imageHeaderBar{
178        background: #F5F5F5;
179        border: 1px solid #CDCDCD;
180        border-width: 1px 0;
181        padding: 5px 8px;
182}
183#imageToolBar .imageNumber {
184    float: right;
185    margin: -30px 9px 0 0;
186}
187#theImage IMG {
188  padding: 5px;
189  border: 1px solid #aaa;
190}
191#theMainImage {max-width:880px}
192
193#imageHeaderBar H2 { 
194        border: none;
195        clear: both;
196        padding: 0;
197        text-align: center;
198        padding: 0.5em 0 0 0;
199}
200#imageHeaderBar .browsePath a { color:#0066CC; text-decoration: none; }
201#imageHeaderBar .browsePath a:hover { color:#333333; }
202
203/*#imageToolBar A:hover { background-color: #a0a0a0; }*/
204
205.infoTable{ margin: 20px auto; }
206#thumbPrev{ margin: 20px 0 0 20px; }
207#thumbNext{ margin: 20px 20px 0 0;}
208a#thumbPrev, a#thumbNext { text-decoration: none; border:0; }
209
210/*      commentaires
211-----------------------------------------------------------------------------------------------*/
212
213#comments{ width: 860px; margin: 20px auto; }
214#comments DIV.comment BLOCKQUOTE { border: 1px solid #5f5f5f; border-left: 2px solid #696969; }
215
216FIELDSET, INPUT, SELECT, TEXTAREA, TABLE.table2, #infos,
217#content DIV.comment  A.illustration IMG, #content DIV.thumbnailCategory { border: 1px solid gray; }
218
219textarea { width:80%; }
220
221/*      miniatures
222-----------------------------------------------------------------------------------------------*/
223.thumbnails SPAN, .thumbnails .wrap2 A, .thumbnails LABEL, .thumbnailCategory DIV.illustration {width:auto;}
224
225/*#content ul.thumbnails span.wrap1 { margin: 0 10px; }*/
226#content UL.thumbnails SPAN.wrap2 img { padding: 5px; border: 1px solid #ccc; }
227#content UL.thumbnails SPAN.wrap2 img:hover { border-color: #06c; }
228
229#content UL.thumbnails LI.thumbCat SPAN.wrap2 { border-style: hidden; background-color: #ccccaa; }
230#content UL.thumbnails LI.thumbCat SPAN.wrap2:hover { border-style: solid; }
231
232#content ul.thumbnails span.thumbLegend {
233    margin: 0 auto;
234    padding: 0.5em 0;
235}
236.zero { display: none }
237.nb-hits { color: #69c; }
238.nb-comments { color: #f92; }
239
240
241/* links */
242/*.rateButton, A { color: #FFFFFF; }
243.rateButton:hover, A:hover { color: #FFF48E; }*/
244
245/*      Menu
246-----------------------------------------------------------------------------------------------*/
247
248.pwg-icon-filter {
249left:95%;
250position:absolute;
251}
252
253#menubar { position: relative; }
254#theHeader { position: relative; }
255
256#content div.thumbnailCategory div.description {
257        overflow: hidden; /* bug in FF 1.0 (not 1.5) */
258}
259/*#content div.thumbnailCategory>div.description:hover {
260  overflow: visible;
261}*/
262
263/* horizontal menubar */
264#menubar, BODY#theAdminPage #menubar {
265        float: none;
266        width: 898px;
267        margin: 5px auto;
268        border: none;
269        /*overflow: hidden;*/   /* bothers FF so we rather set height below */
270        display: block;
271}
272
273/* set menubar height (not for IE) */
274#the_page > #menubar, BODY#theAdminPage #the_page > #menubar {
275  height: 2.1em;
276  padding: 0;
277}
278#menubar DL > DT {
279    padding: 0.2em 0.4em 0;
280}
281/* general UL formating */
282#menubar UL, #menubar DL, #menubar UL#menuTagCloud {
283  list-style: none;
284  margin: 0;
285  padding: 0;
286  float: left;
287}
288#menubar DL { display: inline; padding: 0 2.1em; }
289BODY#theAdminPage #the_page > #menubar DL { padding: 0 0.5em;}
290
291#menubar UL {  width: 20em; }
292#menubar ul li a {  padding-right: 3em; }
293
294#menubar P, #menubar P.totalImages, FORM#quickconnect {
295  clear: both;
296  margin: 0;
297  text-align: center;
298  padding: 0.2em;
299}
300
301/* titles and links */
302#menubar A, #menubar DT { display: block; }
303
304/* positioning */
305#menubar LI { position: relative;}
306#menubar DD { position: absolute; z-index: 500;}
307#menubar DD UL UL {
308  position: absolute;
309  top: 0px;
310  left: 100%;
311  z-index: 500;
312}
313#menubar LI SPAN,#menubar LI IMG { position: absolute; top: 0;}
314#menubar LI SPAN { right: 7px;}
315#menubar LI IMG { right: 3em;}
316
317/* hiding and revealing up to 6 menu levels */
318DIV#menubar DD,
319DIV#menubar UL UL,
320DIV#menubar UL LI:hover UL UL,
321DIV#menubar UL UL LI:hover UL UL,
322DIV#menubar UL UL UL LI:hover UL UL,
323DIV#menubar UL UL UL UL LI:hover UL UL { display: none; }
324
325DIV#menubar DL:hover DD,
326DIV#menubar UL LI:hover UL,
327DIV#menubar UL UL LI:hover UL,
328DIV#menubar UL UL UL LI:hover UL,
329DIV#menubar UL UL UL UL LI:hover UL,
330DIV#menubar UL UL UL UL UL LI:hover UL { display: block; }
331
332/* styles */
333#menubar, #menubar DT {
334background-image: url(img/fondMenu2.gif);
335background-repeat:repeat-x;
336background-color:#000000;
337        color: #FFF;
338        border: 0;
339}
340#menubar a, #menubar DT a { 
341        color: #fff; 
342        display: block; 
343        text-decoration: none; 
344        border: 0;
345
346}
347#menubar DD, #menubar UL  {
348        color: #000000;
349        border: 0;
350        background-image: url(img/back_menu.png);
351}
352#menubar DD {
353    border-right: 2px solid #777;
354    border-bottom: 2px solid #777;
355   -moz-border-radius: 4px;   
356    border-radius: 4px 4px;   
357    }
358
359#menubar DD A { padding: 0.5em; }
360#menubar DD a {
361        color: #000000;
362        display: block;
363        text-decoration: none;
364        border: 0;
365}
366/********************/
367#menubar A:hover, #menubar dt:hover { /* liens survolés */
368color: #fff; 
369background-image: url(img/fondMenuSurvol.gif);
370background-repeat:repeat-x;
371background-position:center;
372background-color:#CCCCCC,
373}
374/********************/
375#menubar A:hover { color: #fff; }
376#menubar DD A { padding: 0.5em; }
377#menubar DD A:hover { background-color: #999; }
378
379/*      quickconnect (still to be fixed for IE)
380-----------------------------------------------------------------------------------------------*/
381FORM#quickconnect FIELDSET { width: 220px; }
382FORM#quickconnect LABEL { clear: left; /*margin: 0;*/ text-align: left; }
383FORM#quickconnect LABEL INPUT { font-size: 1em; /*width: 15em;*/ }
384FORM#quickconnect P, FORM#quickconnect A { border: none; padding: 0; }
385/*FORM#quickconnect A { display: inline; }*/
386FORM#quickconnect ul.actions { width: auto; }
387/*FORM#quickconnect ul.actions img { position: static; }*/
388FORM#quickconnect ul.actions li { display: inline; float: right; }
389
390
391
392/*      menuTagCloud
393-----------------------------------------------------------------------------------------------*/
394
395#menubar UL#menuTagCloud A { padding-left: 2px; }
396#menubar UL#menuTagCloud LI { display: block; }
397
398UL#menuTagCloud A IMG { position: static; }
399UL#menuTagCloud A {
400  position: absolute;
401  left: 7px;
402  top: 0.2em;
403  padding-right: 0;
404  display: inline;
405  border-width: 0;
406}
407
408#menubar UL#menuTagCloud A.tagLevel1,
409#menubar UL#menuTagCloud A.tagLevel2,
410#menubar UL#menuTagCloud A.tagLevel3,
411#menubar UL#menuTagCloud A.tagLevel4,
412#menubar UL#menuTagCloud A.tagLevel5,
413#menubar UL#menuTagCloud A.tagLevel6,
414#menubar UL#menuTagCloud A.tagLevel7,
415#menubar UL#menuTagCloud A.tagLevel8,
416#menubar UL#menuTagCloud A.tagLevel9,
417#menubar UL#menuTagCloud A.tagLevel10 {
418  /*font-size: 100%;*/
419  /*padding-left: 1.5em;*/
420  padding-left: 18px;
421  position: static;
422  display: block;
423}
424
425/* Tags - Page des tags
426-------------------------------------------------------- */
427
428ul#fullTagCloud {
429        position: relative;
430        border: 1px solid #E8E8E8;
431        border-width: 1px 0;
432        background: #FBFBFB;
433        padding: 5px;
434        margin: 8px 0 20px 0;
435        overflow: hidden;
436        height: 100%;
437        font-size: 120%;
438}
439        ul#fullTagCloud li {
440                /* display: inline; */
441                display: block;
442                float: left;
443                margin: 4px;
444                padding: 1px 5px;
445                height: 18px;
446                line-height: 18px;
447                background: none;
448        }
449        ul#fullTagCloud li a:link, ul#fullTagCloud li a:visited {
450                color: #005D99;
451                text-decoration: none;
452                white-space: nowrap;
453        }
454        ul#fullTagCloud li a:hover { text-decoration: underline; border: 0; }
455        ul#fullTagCloud li a:focus, ul#fullTagCloud li a:active { background: #005D99; color: #FFF; }
456
457.tagLevel5 { font-size:160%; }
458.tagLevel4 { font-size:140%; }
459.tagLevel3 { font-size:120%; }
460.tagLevel2 { font-size:100%; }
461.tagLevel1 { font-size:80%; }
462
463/*.tagLevel1 { font-size: 80%; }
464.tagLevel2 { font-size: 90%; }
465.tagLevel3 { font-size: 100%; }
466.tagLevel4 { font-size: 110%; }
467.tagLevel5 { font-size: 120%; }
468.tagLevel6 { font-size: 130%; }
469.tagLevel7 { font-size: 140%; }
470.tagLevel8 { font-size: 150%; }
471.tagLevel9 { font-size: 160%; }
472.tagLevel10 { font-size: 170%; }*/
473
474/*====== */
475
476/* others */
477.pleaseNote {
478        margin: 20px auto;
479        width: 700px;
480    background: #eee;
481    color: #ff9b00;
482        border: 1px solid #ff9b00;
483    padding: 1ex;
484    font-weight: bold;
485}
486
487.header_notes { background-position:left center; padding: 5px 0px; }
488
489li.categoryLi {
490        float:left;
491        margin:2px;
492        width:46%;
493}
494
495input.rateButton { color: #369; }
496input.rateButtonSelected { color:#696969; }
497INPUT.rateButton:hover { color: #858460;}
498
499.tabsheet li,
500.tabsheet li a { color: #FFFFFF;}
501.tabsheet li a:hover { color: #484848; }
502.tabsheet li { background-color: #807d76; }
503.selected_tab { background-color: #9e9c96!important; }
504ul.tabsheet { border-color: #807d76; }
505.tabsheet li { border: 1px solid #696969; }
506.tabsheet li:hover { border-color: #484848 !important; }
507
508
509/*      calendar
510-----------------------------------------------------------------------------------------------*/
511
512DIV.calendarViews {
513  padding-top: 5px;
514  padding-right: 6px;
515}
516
517/*calendar elements*/
518SPAN.calItemEmpty { color: silver; }
519
520SPAN.calItem, SPAN.calItemEmpty { border: 1px solid gray; }
521
522/* nice looking month calendar*/
523TD.calDayCellEmpty, TD.calDayCellFull { border: 1px solid gray;}
524
525TD.calDayCellEmpty { color: silver; }
526
527.calBackDate { color: #000; }
528.calForeDate { color: #fff; }
529
530/* Footer
531-------------------------------------------------------- */
532#copyright {
533        background: /*transparent*/ url(img/footer.jpg) no-repeat center bottom;
534        clear: both;
535        margin: 0 auto;
536        padding: 10px 0;
537        text-align: center;
538        font-weight: bold;
539        height:40px;
540}
541#copyright a:link, #copyright a:visited { text-decoration: underline; color: #000; }
542#copyright a:hover { text-decoration: none; color: #000; border: 0; }
Note: See TracBrowser for help on using the repository browser.