source: extensions/hr_glass_xl/theme.css @ 24373

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

optimal size
switchlanguage style

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