source: extensions/sobre/trunk/theme.css @ 7264

/* $ Id: theme.css 2010-04-03 Par Gotcha pour son thème "Sobre" $ */

/* Valide CSS3 http://jigsaw.w3.org/css-validator/validator */
/* Compressé avec http://www.cleancss.com/ (musclé !) */
/* Nom du fichier avant compression : theme.bak.css */
/* Nom du fichier après compression : theme.css*/




/* MERCI DE NE PAS TOUCHER A CE FICHIER */






/* Importation de feuilles de styles additionnelles */
@import "slider.css";

/* Le header */
/* Fonctionne avec l'administration du thème*/
/* Désactivé par défaut */
#theHeader {
        background: transparent url("../../themes/sobre/images/header_bienvenue.png") no-repeat center bottom;
    height: 144px;
        margin: 0 auto;
}
#theHeader H1 {
    margin-top: 0px;
}
#theHeader p {
  margin-top:72px;
}

/* Centrage en une seule colonne */
body {
margin: 0 auto;
max-width: 1190px;
min-width: 980px;
}

/* Couleurs des textes */
BODY, H1, H3,
INPUT.rateButtonSelected  { /* <= why IE doesn't inherit this ? */
        color:#d0d0d0;
}
H2, #menubar DT {
        color: #fff48e;
}
A, INPUT.rateButton {
        color: #fff;
        border: none;
}
A:hover {
        color: #FFF48E;
}
#copyright {
        color: black;
}
#copyright a {
        color: #FF7700;
}

/* Arrières plans */
BODY, H3, #imageBar, #imageToolBar A:hover {
        background: #393737
}
BODY {
background: #EAEAEA url(images/background-0.png) repeat-x top;
}
H2 {
        background-image: url(images/tableh1_bg.png);
        color: #fff48e;
}
#imageHeaderBar H2 {
        background-image: none;
        background-color: transparent;
        border: none;
}
#imageHeaderBar {
        background-image: url(images/tableh2_bg.png);
        background-repeat: repeat-x;
        background-position: center;
        border-top: 1px solid #000;
}
.content, #imageToolBar, .header_notes {
        background-color: black;
}
#imageToolBar {
        background-color:#505050;
}

/* Bordures */
.content{
        border: 1px solid #252525;
        margin: 0;
}
H2, #imageToolBar {
        border-bottom: 1px solid #000;
}
FIELDSET, INPUT, SELECT, TEXTAREA,
.content DIV.thumbnailCategory {
        border: 1px solid gray;
}
.content UL.thumbnails SPAN.wrap2 {
        border: 1px solid #aaaaaa;      /* thumbnails border color and style */
}
.content UL.thumbnails SPAN.wrap2:hover,
.content UL.thumbnailCategories DIV.thumbnailCategory:hover,
.content UL.thumbnailCategories DIV.thumbnailCategory:hover A {
        background-color: #faebd7;
        border-color: yellow;   /* thumbnails border color when mouse cursor is over it */
        color: black;
}
#thePicturePage {
        border:1px solid white;
}

/* Les polices */
h2 {
        font-family:Mon-menu;
        font-size:18px;
        font-style:italic;
        font-weight:normal;
}
.content ul.thumbnails span.thumbLegend {
        height: 100%;
}
.content div.thumbnailCategory div.description div.text p {
  font-family:Trebuchet MS;
}
.stuffs_block {
  font-family:Comic Sans MS;
}

/* Plugin PWG_Stuff, permet d'afficher les derniers commentaires sur 2 colonnes. */
.content #comments ul.thumbnailCategories li {
  width:49.9%;
}

/* Affichage des tags avec le plugin Cumulus cloud tags */
.tagLetter table.tagLetterContent {
  font-size:100%;
}

/* Modifications pour RV Mpas & Earth */
#theImage #mapPicture {
  width: 280px;
}
#theImage #map {
height:600px;
min-height:512px;
position: relative;
background-color: rgb(229, 227, 223);
left: 290px;
right: -290px;
margin-right: 290px;
}

/* Plugin Whois Online */
.Online {
        font-size: 11px;
        color: #444444;
}
.Online a {
        color: black;
}

/* Centrage modifications de la caractéristique de la catégorie. */
.content div.thumbnailCategory div.description div.text p.Nb_images {
  border-top:1px solid #808080;
  color:#FF9960;
  font-style:italic;
  text-align:center;
}

/* Centrage modifications du nom de la catégorie. */
.content div.thumbnailCategory div.description h3 {
  font-weight: bold;
  text-align:center;
}

/* Modifications de la description de la catégorie. */
.content div.thumbnailCategory div.description div.text p {
  color:#996060;
}

/* Correction du centrage de la miniature */
.content div.thumbnailCategory div.illustration {
  text-align: center;
  margin: 2px;
}

/* Plus de place pour le texte des catégories */
.content ul.thumbnails span.wrap2, .content div.thumbnailCategory div.description  {
        height: 190px;
}
.content div.thumbnailCategory div.description .text {
        text-align: justify;
        padding-right:5px;
}
.content div.thumbnailCategory div.description {
        height:100%;
}

/* Correction de l'affichage de la liste des tags */
ul.tagSelection {
        width:100%;
}
ul.tagSelection li{
        float:left;
        width:150px!important;
        overflow:hidden;
}

/* Tips pour picture.tpl */
#theImage img {
        margin-top: 10px;
}
#theImage p {
        color: #000;
        font-style:italic;
        margin:10px auto auto;
        position:relative;
        width:800px;
}
#linkPrev, #linkNext {
        display: none;
}
/* Mise en page du tableau */
TABLE.infoTable {
  width:920px;
  background: #505050;
  border: solid 1px;
  margin-top: 6px;
}
TABLE.infoTable .label {
  background-color: #2F0000;
  font-weight: bold;
  text-align: left;
  padding-right: 0.5em;
  padding-left: 3px;
  width: 100px;
}
TABLE.infoTable .value p {
  width: 320px;
  margin: 0px;
}
TABLE.infoTable .value {
  max-width: 320px;
}
TABLE.infoTable .value p a, input.rateButton {
border-width:0;
color:#FF7700;
}
/* Modification de zone de commentaires */
#comments fieldset {
    width: 910px;
        margin: auto;
        padding: 0;
        background-color: #F0F0F0;
        color: black;
}
#comments fieldset legend {
        margin-left: 10px;
        background: #F0F0F0;
}
#thePicturePage form.filter fieldset ul, #thePicturePage form.filter fieldset label {
        display:block;
        float:none;
        margin-right:0;
        padding:0;
}
table.commentr {
        margin-top: -20px;
        margin-bottom: -10px;
}
table.commentr td.center {
        height: 138px;
}
#outils {
        padding-top: 17px;
}
form.filter input[type="submit"] {
        margin-top:0;
}
form fieldset p {
        margin-top:0;
}
#comments  {
        border-width:0;
        padding:5px;
    padding-bottom: 13px;
        width: 910px;
        margin: 0 auto;
        background-color: #505050;
}
#theImage table {
        background-color: #D3D3D3;
        border:1px solid #000;
        width: 800px;
        margin:10px auto 0;
}
#comments h3 {
        margin:14px -5px;
        padding:0 7px;
}
#comments table tbody tr td  select {
        width: 95px;
}
#comments SPAN.author {
        font-weight:bold;
}
#comments blockquote {
        border-color:black;
        border-style:solid;
        border-width:0 0 0 2px;
        padding-left:5px;
        font-style:italic;
}
form.filter fieldset ul, form.filter fieldset label {
        padding-top: 5px;
        padding-left: 5px;
}

/* Tip pour la page d'accueil */
/* Concerne PWG_Stuffs */
/* A adapter */
#stuffs_block_3 #comments {
        width: 100%;
}

/*
Petite bidouille pour le panneau de connection en haut du site avec PWG_Stuffs
#stuffs_block_2 form.properties span.property {
  width: 150px;
  text-align: left;
}
*/

/* Modification pûrement visuel et esthétique modifiant l'affichage de l'enveloppe sous une miniature nouvelle */
.content ul.thumbnails span.thumbLegend img {
  position:relative; top:-3px;
}

/* Tip personnel pour un bloc */
/* Utilisez PWG_Stuffs */
/* Bloc privé */
#stuffs_block_10 div.personal_block{
display:none;
}
#stuffs_block_10:hover div.personal_block{
display:block;
}

/* Pour IE et Chrome surtout */
.content ul.thumbnailCategories {
width: 99%; /* Peut être à 100% */
padding-left: 4px; /* Correction du centrage du cadre de la catégorie */
}





/* Modifications de la tailles des miniatures. L'expemple ci-dessous suppose une taille de 200px de coté pour les miniatures.*/
/* A vous d'adapter en fonction de vos propres miniatures et choix esthétique.*/

.content DIV.thumbnailCategory DIV.description {
        padding-left: 0px                    /* For Sylvia theme only */
}
.content div.thumbnailCategory div.illustration {
        text-align:center;
}
.content div.thumbnailCategory div.illustration { 
        width:170px;                      /* Usable range 162px-360px , optimal : Thumbnail width + 10px */
        margin-top:19px;
}
.content div.thumbnailCategory { 
        height: 200px;                    /* Usable range 172px-250px , optimal : Thumbnail height + 10px */ /* For Slyvia theme, Thumbnail height + 40px */
}
.content div.thumbnailCategory div.description .text { 
        height: 110px;                   /* Optimal : Thumbnail height - 50px */ 
}
#comments div.thumbnailCategory div.illustration { 
        width: 255px;                    /* Usable range 219px-360px , optimal : Thumbnail width + 95px */ 
}
.content ul.thumbnails span,
.content ul.thumbnails span.wrap2 a,
.content ul.thumbnails label {
        width: 170px;                        /* Optimal : Thumbnail width + 10px */ 
}
.content ul.thumbnails span.wrap2, .content div.thumbnailCategory div.description  {
height:198px;
}

/* Set defaults for thumbnails legend ( modifie le nbre de ligne sous les vignettes)*/
#content UL.thumbnails SPAN.thumbLegend {
  display: block;    /* display: none; if you don't want legend */
  height: 5em;        /* legend height (don't set auto to be Gecko friendly)*/
}

.content ul.categoryActions img {
margin:2px 0 0;
}


















#menubar {
height:2.1em;
margin:-2px auto 3px;
position:relative;
width:980px;
z-index:2;
padding-bottom:25px;
display:block;
float:none;
}

#menubar #menuTagCloud a {
display:inline;
}

#menubar #menuTagCloud span {
display:block;
padding:0.5em 0;
text-align:left;
}

#menubar .button {
border:medium none;
float:right;
left:95%;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:-2px 2px 2px;
padding:0;
position:absolute;
text-align:center;
text-indent:0;
width:auto;
}

#menubar a,#menubar dt a,#menubar dd a {
border:0;
color:#fff;
display:block;
text-decoration:none;
}

#menubar a,#menubar dt,div#menubar dl:hover dd,div#menubar ul li:hover ul,div#menubar ul ul li:hover ul,div#menubar ul ul ul li:hover ul,div#menubar ul ul ul ul li:hover ul,div#menubar ul ul ul ul ul li:hover ul {
display:block;
}

#menubar a:hover,#menubar dt:hover {
color:#fff;
}

#menubar dd {
background:#333;
border:1px solid #8c8c8c;
position:absolute;
text-align:left;
z-index:500;
margin-top: -5px;
width:25%;
}

#menubar dd a {
padding:0.5em;
border:1px solid #3F3F3F;
}

#menubar dd a:hover {
background-color:#333;
border:1px solid #8c8c8c;
color:#FFF;
font-style:italic;
}

#menubar dd ul ul {
background-color:#fff;
border:1px solid #8c8c8c;
left:100%;
position:absolute;
top:0;
z-index:500;
}

#menubar dl {
display:inline;
height:25px;
text-align:center;
width:25%;
}

#menubar dl dd p {
margin: 0;
padding:0 0 10px;
}

#menubar dt {
background-image:url("images/tableh1_bg.png");
border:0;
color:#fff48e;
}

#menubar li {
position:relative;
}

#menubar li a {
background:#3f3f3f none repeat scroll 0 0;
}

#menubar li span {
right:7px;
}

#menubar li span,#menubar li IMG {
padding-left:4px;
position:absolute;
top:7px;
}

#menubar img.button {
margin-right:17px;
display:none;
}

#menubar li span.bullet,div#menubar dd,div#menubar ul ul,div#menubar ul li:hover ul ul,div#menubar ul ul li:hover ul ul,div#menubar ul ul ul li:hover ul ul,div#menubar ul ul ul ul li:hover ul ul {
display:none;
}

#menubar li:hover {
background:#3f3f3f;
}

#menubar p,#menubar p.totalimages,#menubar p,#menubar p.totalimages,form#quickconnect {
clear:both;
margin:0;
padding:0.2em;
text-align:center;
}

#menubar ul {
width:20em;
}

#menubar ul li a {
margin-left:25px;
padding-right:3em;
}

#menubar ul,#menubar dl,#menubar ul#menuTagCloud {
float:left;
list-style:none;
margin:0;
padding:0;
}

#menubar ul,#menubar li {
background:#333 none repeat scroll 0 0;
}

#menubar ul.rvTree ul {
padding-left:0 !important;
}

body#theadminpage #menubar {
border:none;
display:block;
float:none;
margin:5px auto;
width:898px;
}

form#quickconnect .button {
left:50px;
position:relative;
top:-20px;
}

form#quickconnect fieldset {
padding-top:5px;
text-align:left;
width:19em;
}

form#quickconnect label {
clear:left;
}

form#quickconnect label input {
font-size:1em;
}

form#quickconnect p,form#quickconnect a {
border:none;
padding:0;
}

form#quicksearch {
border-bottom:1px solid #000;
padding:0 0 0 15px;
}




/* Scroll to top */
#scrolltotop {
  bottom:14px;
  position:fixed;
  right:0;
  z-index:1000;
  opacity:0;
  outline:none;
}
#scrolltotop a {
  background-color:transparent;
  background-image: url("images/top.gif");
  background-position:left top; background-repeat:no-repeat; display:block;
  height:50px; text-indent:-9999px; width:44px;
}
#scrolltotop a:hover {
  border-bottom:none;
}