source: extensions/hr_os/theme.css @ 15907

Last change on this file since 15907 was 12674, checked in by flop25, 12 years ago

multi size ok and ie7 friendly

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