source: extensions/hr_os_xl/theme.css @ 17475

Last change on this file since 17475 was 16380, checked in by flop25, 12 years ago

drop down menu styled and successfully placed (relative positions changed)
custom size for the picture page :
pattern added
concatenation of the 'define derivative'
css to center the picture

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