/****
*
* PT p5
* images origines set 16
****/


/****
*
* - - - 1 - - - BODY
* Couleur de fond: blanc.
* Couleur police gris un peu sombre. Mettre noir.
* Taille des caracteres augmente un peu
* par rapport a celle par défaut.
* Alignement texte et autre: au centre.
****/

body {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
background-color: #FFFFFF;
font-family: 'Lucida Grande','Lucida Sans Unicode',Verdana,Arial,sans-serif;
color: #000000;
font-size: 105%;
word-spacing: normal;
text-align: center;
}

/****
*
* - - - 2 - - - CONTAINER 
* Le plus grand bloc, la + gd boite.
* Toute la largeur de la page donc tout BODY.
* Fond transparent donc fond blanc de BODY
* si image de fond ne parait pas.
* Repetition de image horizontalement en haut.
* Prolonge la banniere sur les cotes.
*
****/

#container {
background: transparent url("http://static.skynetblogs.be/media/8317/3450199297.jpg") repeat-x;
}

/****
*
* - - - 3 - - - SousBoite 1 de container 
* Largeur 940px.
* Alignement à gauche.
* Image de fond reprise verticalement
* apparaît a gauche et a droite
* et interieur a 940px.
* Sans image, fond transparent 
* donc blanc de BODY.
*
****/

#container .container-decorator1 {
width: 940px;
margin-right: auto;
margin-left: auto;
margin-top: 0px;
text-align: left;
background: transparent url("http://static.skynetblogs.be/media/8321/3986924082.jpg") repeat-y;
}

/****
*
* - - - 4 - - -  SSboite 2 de ssboite1 de container
* Largeur 940px
* Pour le pied de page
* Image de fond mise a gauche en bas 940x33 px.
* Ou fond laisse passer couleur ou image de body.
* Ajouter marge de bas pour avoir un espace blanc
* sous image de bas de page chez firefox.
*
****/

#container .container-decorator1 .container-decorator2 {
width: 940px;
background: transparent url("http://static.skynetblogs.be/media/8321/4008050923.jpg") no-repeat left bottom;
padding-bottom: 33px;
margin-bottom: 10px;
}

/****
*
* - - - 5 - - -  Colonne 2 de droite
* Ce qui depasse sera non visible.
* Largeur de 152 a augmenter.
* Espacement droit de 38px a annuler pr agrandir.
* Espacement droit peut-etre pour laisser visible image origine de 3.
* Flottement a droite.
*
****/

#left {
overflow: hidden;
width: 172px;
line-height: 100%;
padding-right:0px;
padding-left:0px;
float: right;
}

/****
*
* - - - 6 - - -  Colonne 1 au milieu
* Ce qui depasse sera non visible.
* Largeur de 162 a diminuer.
* Espacement droit de 38px.
* Flottement a droite.
*
****/

#right {
overflow: hidden;
width: 152px;
padding-right:38px;
line-height: 100%;
float: right;
}

/****
*
* - - - 7 - - - Colonne des posts
* Largeur de 494 a augmenter.
* Ce qui depasse sera non visible.
* Flottement a gauche.
* Espace gauche 38 px pour laisser visible image de 3 à gauche.
* Si sans image alors gain en diminuant.
*
****/

#center {
width: 550px;
overflow: hidden;
float: left;
padding-left:0px;
}

/****
*
* - - - 8 - - - Boite Banniere 
* Hauteur 115px fixe.
* Image sinon blanc de BODY apparaît.
* Image au centre en haut.
* (Image 940 x 115 px)
* Marge de bas de 40px.
*
****/

#banner {
height: 115px;
background: transparent url("http://static.skynetblogs.be/media/8317/bx03-2751-2972-3005-6845-7062d-thumb.jpg") no-repeat center top;
margin: 0px 0px 40px 0px;
line-height: 100%;
}

/****
*
* - - - 9 - - - Titre du blog ds bloc Banniere
* Format titre de niveau H1.
* Taille fixe 22px a augmenter.
* Gras. ajouter couleur police
* Couleur lien: blanc. Voir 11.
* Espacement 33 40 0 40 a modifier.
*
****/

#banner h1 {
font-size:22px;
font-weight:bold;
padding:3px 40px 0px 5px;
margin:0px;
}

/****
*
* - - - 10 - - - Description du blog
*               dans boite Banniere.
* Format titre de niveau H2.
* Taille fixe 15px (a diminuer ?)
* Gras. A modifier.
* Couleur : blanc.
* Espacement a modifier suivant image banniere.
*
****/

#banner h2 {
font-size:14px;
font-weight:normal;
color:#ffffff;
padding:75px 40px 0px 5px;
margin:0px;
}

/****
*
* - - - 11 - - - Lien dans bloc Banniere 
* Le Titre est 1 lien ds HTML et sera en blanc.
* Suppression du soulignement par defaut du lien titre.
*
****/

#banner a {
color: #ffffff;
text-decoration: none;
}

/****
*
* - - - 12 - - -  
* Cette regle pas tenue en compte
* avec Display None.
*
****/

#banner-img {
background-repeat:no-repeat;
margin-bottom: 10px;
display: none;
}

/****
*
* - - - 13 - - -  
* Lien dans classe img-link.
*
****/

div.img-link a {
display: block;
text-decoration: none;
width: 100%;
}

/****
*
* - - - 14 - - -  
* On ne tient pas compte
* des espaces blancs ds le codage.
*
****/

.nowrap {
white-space: nowrap;
}

/* CENTRE */

/****
*
* - - - 15 - - -  Boite contenant tous les posts
* Colonne des posts.
* Ds page de 1 post, contient commentaires, formulaire,etc.
* Ce qui depasse sera visible.
* Taille police 12px.
****/

.content {
overflow: visible;
padding: 0px 0px 20px 0px;
font-size: 12px;
}

/****
*
* - - - 16 - - - Titre de niveau H2 dans partie DATE et COMMENTAIRES 
* Si on utilise le niveau H2 dans boite POST.
* Taille 16px, gras, gris sombre.
* Augmenter et changer couleur si fond sombre.
* Bord : traits doubles 3px gris clair.
* Mettre fond gris moyen sombre ds partie commentaire.
* Supprimer fond pour date dans 17.
* Mettre bord en dentelle avec points blancs.
* Augmenter marge du haut.
* Augmenter espacement.
* Peut-etre Mieux de modifier dans 159 et 160?
*
****/

.content h2 {
margin: 10px 0px 0px 0px;
padding: 15px 15px 15px 15px;
font-size: 20px;
font-weight:bold;
color:#5B5D75;
line-height: 100%;
border: 5px dotted #FFFFFF;
background-color:#999999;
color: #FFFFFF;
}

/****
*
* - - - 17 - - - Classe Date du jour ds bloc Posts 
* Niveau titre H2 comme dans partie commentaire.
* Faut neutraliser si choix de couleur de fond pour H2.
* Taille 12px, gras, bleu sombre terne.
* Sans bordure.
*
****/

.content h2.date {
margin: 0px 0px 0px 0px;
padding: 0px 14px 0px 14px;
font-size: 12px;
font-weight:bold;
line-height: 100%;
color:#4a65ac;
border:none;
background-color:#FFFFFF;
}

/****
*
* - - - 18 - - - Titre H3 dans bloc Post. 
* Utilisation pour Titre de post.
* Pour tout titre de niveau H3 ds bloc Post.
* Egalement contenu du billet.
*Taille 15, gras, gris sombre.
* Bord : traits doubles 3px 
* Bord gris clair a assombrir.
* Ajouter un fond de couleur bleue clair ou autre.
*
****/

.content h3 {
margin: 7px 0px 0px 0px;
padding: 8px 11px 8px 11px;
font-size: 15px;
font-weight:bold;
line-height: 100%;
color:#5B5D75;
border: 3px double #5B5D75;
background-color:#D4D2FD;
}

/****
*
* - - - 19 - - - Paragraphe du bloc Post (+ commentaires) 
* + posttext (entre titre et bas de note) 
* Pour tout paragraphe du bloc Post.
* Taille fixe 12px remplacement par taille en %.
* Espacement ds bloc à augmenter.
* Ajouter famille, espacement mots, interligne.
* Remplacement famille de Body par Verdana.
* 
****/

.content .posttext,
.content p {
margin: 10px 0px 10px 0px;
padding: 10px 5px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:104%;
word-spacing:normal;
line-height: 150%;
}

/****
*
* - - - 20 - - - Image en lien ds bloc Posts. 
* Sans bord.
*
****/

.content a img {border:0px;}

/****
*
* - - - 21 - - - Citation dans bloc POST
* Taille 12px a modifier. Voir classe Posttext.
* Bord gauche: trait gris clair de 3px.
*
****/

.content blockquote {
font-size:104%;
padding: 0px 0px 0px 8px;
margin: 0px 0px 10px 0px;
border-left:3px solid #E9EAE8;
}

/****
*
* - - - 22 - - - Lien ds citation du bloc Post 
* Bleu terne moyennement clair.
*
****/

.content blockquote a {
color:#6e8ec9;
}

/****
*
* - - - 23 - - - Liste ds bloc Post 
* Taille 12px. Modifier comme texte.
* Augmenter l’espacement gauche.
*
****/

.content ul {
font-size: 104%;
margin:0px 0px 0px 0px;
padding:0px 0px 0px 8px;
font-family:Verdana, Arial, Helvetica, sans-serif;
word-spacing:normal;
}

/****
*
* - - - 24 - - - Items de liste 
* Image de fond servant de puce.
* Augmenter espacement gauche.
*
****/

.content ul li{
list-style-type:none;
background: url("http://static.skynetblogs.be/backend/graphics/design/preview/set16/42629d/puce1.gif") no-repeat 0px 8px;
padding: 0px 0px 10px 23px;
line-height:150%;
}

/****
*
* - - - 25 - - - Classe du paragraphe de bas de note. 
* Aussi bas de commentaire mais voir 151.
* Heure, blogueur, categorie, etc.
* Taille fixe 11px, gris sombre. 
* Espacement haut de 10px.
* Bord du haut: trait 1px, gris clair.
* A remplacer par pointilles.
* Ou mettre image 3 points roses + espacement gauche.
* Voir 163.
*
****/

.content p.posted {
margin: 10px 0px 30px 17px;
font-size: 11px;
clear: both;
padding-top: 10px;
border-top: 0px dotted #E9EAE8;
color:#6b6d60;
padding-left: 20px;
background: url("http://static.skynetblogs.be/media/8317/318_83triangle.gif.150.150.jpg") no-repeat 0px 0px;
}

/****
*
* - - - 26 - - - Liens en bas de note 
* Bleu terne moyen clair.
*
****/

.content p.posted a {
color:#6e8ec9;
}

/****
*
* - - - 27 - - - Survol lien de bas de note 
* Survol = qd on passe rapidement par-dessus un lien.
* De bleu moyen clair devient gris sombre.
* Voir 31.
* 
****/

.content p.posted a:hover {
color: #42629d;
text-decoration:none;
}

/****
*
* - - - 28 - - - Lien dans bloc Post + autres liens 
* Pas de soulignement.
* couleur bleu sombre.
*
****/

a, .content a{
text-decoration: none;
color:#42629d;
}

/****
*
* - - - 29 - - - Tout lien sans cliquer 
* Bleu sombre.
* idem que 28
*
****/

a:link {
color:#42629d;
}

/****
*
* - - - 30 - - - Tout lien avec visite 
* Garde la couleur bleue sombre.
*
****/

a:visited {
color:#42629d;
}

/****
*
* - - - 31 - - - Survol de tout lien 
* Voir 27.
* Survol = pointeur passe rapidement au-dessus de un lien?
* De bleu sombre devient un autre bleu sombre.
*
****/

a:hover {
color:#5772a5;
}

/****
*
* - - - 32 - - - Tout lien actif 
* Lien en cours de selection par le visiteur.
* Signifie peut-être qd le pointeur reste fixe au-dessus du lien.
* Reste en bleu sombre.
*
****/

a:active {
color:#42629d;
}


/* Sidebar */


/****
*
* - - - 33 - - - Les 2 Blocs colonnes permanentes
* Bord blanc invisible sur fond blanc.
* (si mis en rouge alors apparition de 2 cadres rouges)
* Taille police:12px pour textes et tags populaires.
* Blogspirit aligne textes au centre. A corriger ds modele de colonne.
* Voir 49 pour colonne 2.
* 
****/

.sidebar {
padding: 0px;
margin:0px;
font-size:12px;
border:1px solid #ffffff;
}

/****
*
* - - - 34 - - -  
*
****/

.decorator1, .decorator2 {
padding: 0px;
margin: 0px;
}

/****
*
* - - - 35 - - -  
*
****/

.sidebar .boxcontent-decorator3 {
margin: 0px 0px 30px 0px;
}

/****
*
* - - - 36 - - - Image dans colonne fixe 
* Bordure bleue terne clair.
* Voir 72: pas de bordure.
*
****/

.sidebar img {
border:1px solid #6e8ec9;
margin:0px;
padding:3px;
}

/****
*
* - - - 37 - - - A L B U M dans colonnes fixes 
*
****/

#right .sidebar li.album, #left .sidebar li.album {
list-style-type: none;
background: none;
border:0px;
padding:0px 0px 0px 0px;
margin:10px 0px 15px 0px;
text-align:center;
border:0px;
}

/****
*
* - - - 38 - - -  
*
****/

#right .sidebar li.album.cover, #left .sidebar li.album.cover {
list-style-type: none;
border:0px;
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
text-align:center;
border:0px;
}

/****
*
* - - - 39 - - -  
*
****/

#right .sidebar li.album a, #left .sidebar li.album a{
font-size:11px;
color:#6e8ec9;
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
border:0px;
}

/****
*
* - - - 40 - - -  
*
****/

#left .sidebar li.album a:hover{
color:#6d6d6d;
}

/****
*
* - - - 41 - - -  
*
****/

#right .sidebar li.album a:hover{
color:#6d6d6d;
}

/****
*
* - - - 42 - - -  
*
****/

.sidebar li.link img {
border: 0px;
padding: 0px;
margin: 0px;
vertical-align: -4px;
}

/****
*
* - - - 43 - - - Liens ds colonnes + liens visites 
* Bleu sombre.
* Voir 54.
*
****/

.sidebar a:link, .sidebar a:visited {
color:#42629d;
}

/****
*
* - - - 44 - - - Survol de liens + liens actifs 
* Reste bleu sombre.
* Avec soulignement.
* Je ne vois pas de soulignement.
* En touchant lien (lien actif ?) lien bleu clair.
*
****/

.sidebar a:hover, .sidebar a:active {
color:#42629d;
text-decoration: underline;
}


/* LEFT */


/****
*
* - - - 45 - - - Bloc Titre de colonne fixe 2
* Trait gris clair sous chaque titre a distance de 10px.
* Avec 46 le trait est double.
****/

#left .decorator1{
border-bottom:1px solid #E9EAE8;
margin-bottom:10px;
}

/****
*
* - - - 46 - - - Bloc Titre de colonne fixe 2 
* Trait gris clair sous chaque titre a distance de 2px.
* Avec 45 le trait est double.
*
****/

#left .decorator2{
border-bottom:1px solid #E9EAE8;
margin-bottom:2px;
}

/****
*
* - - - 47 - - - Balise FORM dans colonnes fixes.
* Introduit un formulaire avec boutons, etc.
* Voir 85.
*
****/

#right .sidebar form, #left .sidebar form {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

/****
*
* - - - 48 - - - Liste de formulaire ds colonne 2 
*
****/

#left .sidebar form ul li{
background:none;
text-align:left;
margin: 0px 0px 5px 0px;
padding: 0px 0px 0px 0px;
}

/****
*
* - - - 49 - - -  
*
****/

#left .sidebar {
padding: 0px 0px 0px 0px;
}

/****
*
* - - - 50 - - - Titres ds colonne 2 
* Taille police 15px (+ gd que ds colonne 1).
* Gras, bleu sombre terne.
* Interligne pour longs titres.
* (Peut-etre mieux choisir en EM ?)
* Voir colonne 1 en 59.
*
****/

#left .sidebar h2 {
margin: 0px 0px 3px 0px;
padding: 0px;
font-size: 15px;
font-weight: bold;
color:#4a65ac;
line-height:130%;
}

/****
*
* - - - 51 - - - Liste de colonne 2 
*
****/

#left .sidebar ul {
padding: 0px;
margin: 0px 0px 20px 0px;
}

/****
*
* - - - 52 - - - Liste Items ds colonne 2 
* Image de fond servant de puce.
****/

#left .sidebar li {
margin: 0px 0px 5px 0px;
padding: 0px 0px 0px 20px;
list-style-type: none;
background: url("http://static.skynetblogs.be/backend/graphics/design/preview/set16/42629d/puce1.gif") no-repeat 0px 1px;

}

/****
*
* - - - 53 - - -  
*
****/

#left .sidebar li.description {
font-size:12px;
text-align: left;
margin: 0px;
padding: 0px 0px 15px 0px;
list-style-type: none;
background: none;
line-height:150%;
}

/****
*
* - - - 54 - - - Liens de colonne 2 
* Police 12px, bleu sombre autre que ds colonne 1.
* Idem que dans 43.
*
****/

#left .sidebar a {
text-decoration: none;
font-size:12px;
color:#42629d;
}

/****
*
* - - - 55 - - - Liste de tags ds colonne 2 
*
****/

#left ul.popular-tags {
margin:0px 0px 22px 0px;
padding:0px;
}

/****
*
* - - - 56 - - - Items de tags populaires
* INLINE = se suivent en ligne
*
****/

#left ul.popular-tags li {
display: inline;
margin:0px 10px 0px 0px;
padding:0px;
background:none;
}


/* RIGHT */

/****
*
* - - - 57 - - - Liste de formulaire ds colonne 1 
*
****/

#right .sidebar form ul li{
background:none;
text-align:left;
margin: 0px 0px 5px 0px;
padding: 0px 0px 0px 0px;
border:none;
}

/****
*
* - - - 58 - - -  
*
****/

#right .sidebar {
padding: 0px 0px 0px 0px;
}

/****
*
* - - - 59 - - - Titres ds colonne 1 
* (Voir colonne 2 en 50) 
* Taille police 14px (+ pt que ds colonne 2).
* Gras, bleu sombre terne.
* Interligne pour longs titres.
* (Peut-etre mieux choisir en EM ?)
* Couleur de fond: bleu tres clair presque blanc.
* A remplacer par exemple par jaune.
*
****/

#right .sidebar h2 {
margin: 0px 0px 12px 0px;
font-size: 14px;
font-weight: bold;
color:#4a65ac;
background-color:#D4D2FD;
padding: 7px 10px 7px 10px;
line-height:130%;
}

/****
*
* - - - 60 - - -  
*
****/

#right .sidebar ul {
padding: 0px;
margin: 0px 0px 20px 0px;
}

/****
*
* - - - 61 - - - Liste Items colonne 1 
*
****/

#right .sidebar li {
margin: 0px 0px 5px 0px;
padding: 0px 0px 0px 18px;
list-style-type: none;
background: url("http://static.skynetblogs.be/backend/graphics/design/preview/set16/42629d/puce2.gif") no-repeat 0px 3px;
}

/****
*
* - - - 62 - - - Liens dans colonne 1 
*
****/

#right .sidebar a {
text-decoration: none;
font-size:12px;
color:#42629d;
}

/****
*
* - - - 63 - - -  
*
****/

#right .sidebar li.description {
margin: 0px 0px 10px 0px;
padding: 0px 0px 0px 0px;
list-style-type: none;
background:none;
border:none;
line-height:150%;
}

/****
*
* - - - 64 - - - Liste tags populaires 
*
****/

#right ul.popular-tags {
margin:0px 0px 20px 0px;
padding:0px;
background: none;
}

/****
*
* - - - 65 - - - Items de tags populaires
* INLINE = se suivent en ligne
 
*
****/

#right ul.popular-tags li {
display: inline;
margin:0px 10px 0px 0px;
padding:0px;
background: none;
}

/* rollover des liens gauche droite*/

/****
*
* - - - 66 - - -  
*
****/

#right a:hover, #right a:active {
color:#6e8ec9;
text-decoration: none;
}

/****
*
* - - - 67 - - -  
*
****/

#right li a:hover, #right li a:active, #right .calendar a:hover, #right .calendar a:active {
color:#6e8ec9;
text-decoration: none;
}

/****
*
* - - - 68 - - -  
*
****/

#left a:hover, #left a:active {
color:#6e8ec9;
text-decoration: none;
}

/****
*
* - - - 69 - - -  
*
****/

#left li a:hover, #left li a:active, #left .calendar a:hover, #left .calendar a:active {
color:#6e8ec9;
text-decoration: none;
}

/****
*
* - - - 70 - - - Survol des cellules du calendrier
* Police reste blanche. Voir 75.
*
****/

#left TD.day a:hover, #right TD.day a:hover {
color:#ffffff;
}

/* fin rollover des lien gauche centre droite*/

/****
*
* - - - 71 - - - Utilisation de LINK-NOTE 
* Pour expression ME CONTACTER.
* Pour les 2 images RSS.
* Pour images de colonnes avec ou sans lien.
* Pour le compteur.
* Ailleurs?
*
****/

.link-note {
font-size: 100%;
text-align: center;
line-height: 100%;
margin: 15px 0px 15px 0px;
}

/****
*
* - - - 72 - - - Pour image avec link-note 
* Pas de bordure.
* Voir 36.
* Peut-etre concerne uniquement image
* que blogueur envoie.
*
****/

.link-note img {
border:none;
margin:0px;
padding:1px;
}

/****
*
* - - - 73 - - -  
*
****/

.photo {
margin-bottom: 20px;
}

/****
*
* - - - 74 - - - Titre H1 H2 H3 
* Non-gras.
* Voir dans CENTER et SIDEBAR, gras.
*
****/

h1, h2, h3 {
margin: 0px;
padding: 0px;
font-weight: normal;
}



/* Calendar */


/****
*
* - - - 75 - - - Liens dans calendrier 
* Police tjs blanche si est un lien.
* Voir 70.
****/


.calendar a:link, .calendar a:visited {
color: #ffffff;
}

/****
*
* - - - 76 - - - Tableau Calendrier 
* Bordure en blanc donc invisible.
* Collapse = Suppression de espace entre bordures de cellules.
* (Ne fonctionne pas avec IE6)
* Couleur du fond: blanc.
* QQ bordures invisibles avec IE8 (pas firefox)
* car colonne 1 pas large.
* Inutile de diminuer width
* pas de changement avec 80%!
*
****/

#right TABLE.calendar {
border:1px solid #ffffff;
border-collapse:collapse;
background-color: #ffffff;
margin: 0px 0px 20px 1px;
padding: 0px;
text-align: left;
width: 99%;
}

/****
*
* - - - 77 - - - Tableau Calendrier ds colonne 2 
* Bordure gris clair mais invisible avec 0px.
* Largeur fixe (colonne + large).
*
****/

#left TABLE.calendar {
border:0px solid #E9EAE8;
border-collapse:collapse;
background-color: #ffffff;
margin: 0px 0px 20px 1px;
padding: 0px;
text-align: left;
width: 149px;
}

/****
*
* - - - 78 - - - Cellules de la ligne Titre du calendrier 
* Police 10px.
*
****/

TH.day-of-week {
font-size: 10px;
text-align: center;
line-height: 100%;
margin-top: 10px;
list-style-type: none;
}

/****
*
* - - - 79 - - - Cellules de la ligne Titre du calendrier 
* Couleur de fond: blanc :
* Police : gris sombre.
*
****/

#left TH.day-of-week, #right TH.day-of-week{
background:#ffffff;
color: #5B5D75;
padding:3px;
}

/****
*
* - - - 80 - - - Cellule indiquant envoi de note 
* Police 10px.
* Couleur de fond: bleu sombre.
* Voir 82.
*
****/

TD.selected-day {
font-size: 10px;
text-align: center;
line-height: 100%;
margin-top: 10px;
list-style-type: none;
background:#425E93;
}

/****
*
* - - - 81 - - - Cellule des jours du calendrier 
* Bordures des cellules: gris clair.
* 
****/

#left TD.day, #right TD.day {
font-size: 10px;
text-align: center;
line-height: 100%;
margin-top: 10px;
list-style-type: none;
border:1px solid #E1E1E1;
padding:3px;
}

/****
*
* - - - 82 - - - Cellules avec lien 
* Couleur police: blanc.
* Couleur de fond : bleu sombre.
* Voir 80. Difference?
* 
****/

#left TD.day a, #right TD.day a {
font-size: 10px;
text-align: center;
line-height: 100%;
margin: 0px;
padding:0px 3px 0px 3px;
background:#425E93;
color:#ffffff;
}

/* Comments */

/****
*
* - - - 83 - - - INPUT 
* Sert à saisir du texte.
* Bordure gris clair.
*
****/

input {
font-size: 12px;
border:1px solid #E9EAE8;
border-width: expression(this.type=="radio"||this.type=="checkbox"?'0px':'');
}

/****
*
* - - - 84 - - - TEXTAREA 
* text area = zone de texte
* Pour taper plusieurs lignes
* et ascenseur vertical si necessaire.
* Police 12 px. A agrandir.
* Bordure gris clair.
*
****/

textarea {
clear: both;
width: 99%;
font-size: 12px;
border:1px solid #E9EAE8;
}

/****
*
* - - - 85 - - - Balise FORM dans colonnes fixes.
* Introduit un formulaire avec boutons, etc.
* Voir 47.
 
*
****/

form {
padding: 0px;
margin:0px;
}

/****
*
* - - - 86 - - - Classe pour plusieurs 7 blocs 
* Les 7 parties du formulaire pour envoyer un commentaire.
* Pour nom, email, url, commenter, retenir coordonnees, etc.
*
****/

form .formelement {
clear: both;
padding-bottom: 10px;
font-size: 12px;
background: transparent;
width: 99%;
margin-top: 10px;
}

/****
*
* - - - 87 - - -  
*
****/

form .formelement .name {
float: left;
width: auto;
font-size:12px;
}

/****
*
* - - - 88 - - -  
*
****/

form .formelement .value {
float: right;
width: 70%;
}

/****
*
* - - - 89 - - - Indication erreur 
* Oubli du nom ou email ou commentaire.
* chez Blogspirit pas asterique pour signaler obligation!
* Police : 12px, rouge. A agrandir et choisir gras.
*
****/

form .formelement .error {
color:#f90000;
font-size: 16px;
font-weight:bold;
}

/* APPS */


/****
*
* - - - 90 - - - APPS 
* Uniquement APPS pour Me Contacter et email.
* Sert a quoi?
*
****/

.apps-container .content h2 {
border:3px double #E9EAE8;
color:#5B5D75;
font-size:15px;
font-weight:bold;
margin:7px 38px;
padding:8px 38px;
text-align:center;
}

/****
* - - - 91 - - -  
****/

.apps-container .content p {
text-align: left;
margin:7px 38px;
padding:8px 38px;
}

/****
* - - - 92 - - -  
****/

.apps-container #banner {
text-align: left;
line-height: 100%;
}

/****
* - - - 93 - - -  
****/

.apps-container .wide {
float: left;
width: 500px;
margin-left:78px;
text-align: left;
}

/* Albums */

/****
** - - - 94 - - -  
*****/

.album-container #banner h1 {
font-size:22px;
font-weight:bold;
padding:28px 40px 0px 40px;
margin:0px;
}

/****
** - - - 95 - - -  
*****/

.album-container #banner h2 {
font-size:15px;
font-weight:bold;
color:#ffffff;
padding:34px 40px 0px 40px;
margin:0px;
}

/****
*
* - - - 96 - - -  
*
****/

.album-container {
background: transparent url("http://static.skynetblogs.be/media/8317/3450199297.jpg") repeat-x;
text-align:left;
}

/****
*
* - - - 97 - - -  
*
****/

.container-decorator3 {
margin: 0px auto 0px auto;
width: 940px;
background: transparent url("http://static.skynetblogs.be/media/8321/3986924082.jpg") repeat-y;
}

/*****
* - - - 98 - - -  
*****/

.container-decorator4 {
width: 100%;
padding-bottom:30px;
background: transparent url("http://static.skynetblogs.be/media/8321/4008050923.jpg") no-repeat 100% bottom;
}

/*****
* - - - 99 - - -  
*****/

.album-container h3 {
text-align:center;
margin: 7px 38px 7px 38px;
padding: 8px 38px 8px 38px;
font-size: 15px;
font-weight:bold;
color:#5B5D75;
border: 3px double #E9EAE8;
}

/****
** - - - 100 - - -  
*****/

.album-container a img {
padding: 3px;
border: 1px solid #000;
background: #fff;
}

/****
** - - - 101 - - -  
*****/

.album-container p {
font-size: 70% ! important;
line-height: 150% ! important;
margin: 10px 0px 10px 0px;
padding: 0px 0px 0px 0px;
}

/****
** - - - 102 - - -  
*****/

.album-container #gallery,
.album-container #cover-intro {
text-align: center;
margin: 0px 0px 0px 0px;
padding:0px 0px 0px 0px;
width: 940px;
}

/****
** - - - 103 - - -  
*****/

* html .album-container #gallery,
* html .album-container #cover-intro {
width: 940px;
}

/****
** - - - 104 - - -  
*****/

.album-container #cover-intro p {
font-size:12px;
color:#5B5D75;
text-align: center;
line-height: 130%;
margin: 10px 0px 10px 0px;
padding: 0px 0px 0px 0px;
}

/****
** - - - 105 - - -  
*****/

.album-container #cover-intro p a {
font-size:14px;
font-weight: bold;
color:#5772a5;
}

/****
** - - - 106 - - -  
*****/

.album-container #cover-intro p a:hover {
color:#6e8ec9;
}

/****
** - - - 107 - - -  
*****/

.album-container #cover-intro img {
margin: 10px 0px 10px 0px;
padding: 3px;
border: 1px solid #A0B0CE;
background:#fff;
}

/****
** - - - 108 - - -  
*****/

.album-container .nav {
text-align: right;
font-size:10px;
color: #3D3D3D;
margin: 22px 38px 0px 0px;
}

/****
** - - - 109 - - -  
*****/

.album-container .nav a {
color:#42629d;
text-decoration:none;
}

/****
** - - - 110 - - -  
*****/

.album-container .nav a:hover {
color:#5772a5;
text-decoration:none;
}

/****
** - - - 111 - - -  
*****/

.album-container #photo-detail {
margin: 0px 0px 9px 0px;
padding: 0;
}

/****
** - - - 112 - - -  
*****/

.album-container #photo-detail .photo-container {
padding: 25px 30px 0px 30px;
text-align: center;
}

/****
** - - - 113 - - -  
*****/

.album-container #photo-detail .photo-container h4 {
font-size: 14px;
color:#5772a5;
margin: 10px 0 0 0;
}

/****
** - - - 114 - - -  
*****/

.album-container #photo-detail .photo-container img {
margin: 0 auto 0 auto;
padding: 3px;
border: 1px solid #A0B0CE;
}

/****
** - - - 115 - - -  
*****/

.album-container #photo-detail .photo-container-no-thumb {
text-align:left;
padding: 25px 38px 0px 30px;
}

/****
** - - - 116 - - -  
*****/

.album-container #photo-detail .photo-container-no-thumb h4 {
margin: 10px 0 0 0;
font-size: 14px;
color:#5772a5;
}

/****
** - - - 117 - - -  
*****/

.album-container #photo-detail .photo-container-no-thumb img {
float: left;
margin: 0 25px 25px 0;
padding: 3px;
border: 1px solid #A0B0CE;
}

/****
** - - - 118 - - -  
*****/

.album-container .thumblist {
clear: both;
margin: 0px;
padding:0px 38px 0px 38px;
}

/****
** - - - 119 - - -  
*****/

.album-container .thumblist img {
float: left;
margin: 10px;
padding: 3px;
border: 1px solid #A0B0CE;
}

/****
** - - - 120 - - -  
*****/

.album-container .thumblist-nofloat {
padding-top: 15px;
}

/****
** - - - 121 - - -  
*****/

.album-container .thumblist-nofloat img {
margin: 10px;
padding: 3px;
border: 1px solid #A0B0CE;
}

/****
** - - - 122 - - -  
*****/

.album-container .thumblist-with-detail {
clear: both;
text-align: left;
width: 95%;
margin: 0px 20px 0px 10px;
}

/****
** - - - 123 - - -  
*****/

.album-container .thumblist-with-detail .thumb-container {
float: left;
padding: 5px 0 0 20px;
width: 870px;
}

/****
** - - - 124 - - -  
*****/

.album-container .thumblist-with-detail a {
float: left;
font-size: 11px;
}

/****
** - - - 125 - - -  
*****/

.album-container .thumblist-with-detail img {
margin: 10px;
padding: 3px;
border: 1px solid #A0B0CE;
}

/****
** - - - 126 - - -  
*****/

.album-container .thumblist-with-detail h4 {
margin: 0;
padding: 10px 0 0 0;
font-size: 14px;
color:#5772a5;
}

/****
** - - - 127 - - -  
*****/

.album-container .thumblist-with-detail a.view-details {
float: right;
}

/****
** - - - 128 - - -  
*****/

.spacer {
clear: both;
}

/* Diapo */

/****
** - - - 129 - - -  
*****/

body.diapo {
margin: 0px 0px 0px 0px;
padding: 0px;
background-color: #AAAAAA;
}

/****
** - - - 130 - - -  
*****/

#diapo-container {
margin: 0px;
padding: 0px;
text-align: center;
width: 95%;
}

/****
** - - - 131 - - -  
*****/

#diapo-container .content {
width: 100%;
position: relative;
text-align: center;
padding: 0px;
margin: 20px 0px 0px 0px;
overflow: auto;
height: 500px;
}

/****
** - - - 132 - - -  
*****/

#diapo-container .content img {
margin: 0 auto 0 auto;
border: 5px solid #dcdcdc;
}

/****
** - - - 133 - - -  
*****/

#diapo-container .content p {
font-size: 12px;
color: #ffffff;
margin: 25px auto 0 auto;
}

/****
** - - - 134 - - -  
*****/

#diapo-container .nav {
color: #ffffff;
font-size: 12px;
margin: 0px;
width: 100%;
}

/****
** - - - 135 - - -  
*****/

#diapo-container .top {
position: relative;
height: 30px;
}

/****
** - - - 136 - - -  
*****/

#diapo-container .bottom {
position: relative;
height: 80px;
text-align: center;
float: left;
padding-top: 1px;
}

/****
** - - - 137 - - -  
*****/

#diapo-container .nav .menu {
text-align: center;
width: 100%;
}

/****
** - - - 138 - - -  
*****/

#diapo-container .nav .menu select {
background-color: #ffffff;
padding: 0px;
margin: 0px 0px 0px 0px;
color: #231F20;
vertical-align: middle;
}

/****
** - - - 139 - - -  
*****/

#diapo-container .nav .close {
text-align: right;
float: right;
line-height: 200%;
}

/****
** - - - 140 - - -  
*****/

#diapo-container .nav a {
color: #ffffff;
text-decoration: underline;
}

/****
*
* - - - 141 - - -  
*
****/

#diapo-container .nav a:hover, #diapo-container .nav a:active {
text-decoration: underline;
}

/* Archives */

/****
*
* - - - 142 - - -  
*
****/

ul.category-list {
font-size: 11px;
margin:10px 12px 0px 12px;
padding:0px;
}

/****
*
* - - - 143 - - -  
*
****/

ul.archive-list {
font-size: 11px;
margin:10px 12px 0px 12px;
padding:0px;
}

/****
*
* - - - 144 - - -  
*
****/

ul.category-list li, ul.archive-list li {
list-style-type:none;
background: url("http://static.skynetblogs.be/backend/graphics/design/preview/set16/42629d/puce1.gif") no-repeat 0px 3px;
padding: 0px 0px 10px 18px;
line-height:150%;
color:#3D3D3D;
}

/****
*
* - - - 145 - - -  
*
****/

ul.popular-tags li {
display: inline;
margin: 0px 10px 0px 0px;
background: none;
}

/****
*
* - - - 146 - - -  
*
****/

ul.tag-list {
padding:0;
margin: 10px 12px 0px 12px;
}

/****
*
* - - - 147 - - -  
*
****/

ul.tag-list li {
display: inline;
margin: 0px 10px 0px 0px;
padding:0px;
background:none;
}

/****
*
* - - - 148 - - -  
*
****/

h3.total {
padding: 0;
font-size: 13px;
background : none;
border: none;
margin-top : 10px;
font-weight:bold;
line-height:140%;
}

/****
*
* - - - 149 - - -  
*
****/

h3.total a {
text-decoration : none;
}



/* C O M M E N T A I R E S */


/****
*
* - - - 150 - - - Bloc de 1 commentaire 
* Espacement nul. A augmenter.
* Bord inferieur gris clair comme ligne de separation.
* Bord a modifier. Points blancs pour bord dentelle.
* Mettre fond gris du blogueur et bord en points.
* Ajouter font comme ds contenu post.
*
****/

.commentparent, .commentchild {
line-height:150%;
margin: 10px 0px;
padding:20px;
-moz-border-radius: 1% 1% 1% 1%;
-webkit-border-radius: 1% 1% 1% 1%;
border: 5px dotted #FFFFFF;
background-color:#edeff3;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:104%;
}

/****
*
* - - - 151 - - - GRAVATAR 
* Augmenter marges.
*
****/

.commentparent .gravatar, .commentchild .gravatar {
float: left;
margin: 0px 10px 10px 0px;
}

/****
*
* - - - 152 - - - Bas de commentaire 
* Augmenter espacement gauche pour image de fond ajoutee.
* Voir 25 et 163.
*
****/

.commentparent p.posted, .commentchild p.posted {
border: none;
margin:5px 5px 5px 0px;
padding:3px 3px 5px 20px;
}

/****
*
* - - - 153 - - - Paragraphe de commentaires 
* Ajouter espace gauche..
*
****/

.commentparent p, .commentchild p {
margin-top:0px;
margin-bottom:0px;
padding-left: 20px;
}

/****
*
* - - - 154 - - - Commentaire du blogueur 
* Couleur de fond: gris clair. En jaune clair FFFFCC?
* Espace gauche pour decaler.
* A changer.
* Bord a changer en points pour effet dentelle.
*
****/

.commentchild.author, .commentparent.author {
background-color:#ffFFCC;
padding:7px 0px 0px 30px;
border: 5px dotted #FFFFFF;
}

/****
*
* - - - 155 - - -  
*
****/

.commentparent {
padding:3px;
}

/****
*
* - - - 156 - - - En reponse a commentaire 
* Espacement gauche 40px pour decalage.
*
****/

.commentchild {
margin:4px 0px 4px 40px;
padding:3px;
}

/****
*
* - - - 157 - - - BOX-SEARCH 
* Rien ds page source de page commentaire.
*
****/

#box-search form input.search_button {
width:40px;
}

/****
*
* - - - 158 - - -  
*
****/

#box-search form input {
width:100px;
}

/****
*
* - - - 159 - - - ECRIRE un commentaire 
* Marge de la boite relative a ce titre.
* Voir 160 et 16.
* Peut-etre mieux ici ajouter fond et bord?
*
****/

.content h2#postcomment {
margin:20px 0px;
}

/****
*
* - - - 160 - - - Titre COMMENTAIRES 
* Voir 159 et 16.
* Peut-etre mieux ici ajouter fond et bord?
*
****/

.content .commentlist h2 {
margin-bottom:20px;
}

/****
*
* - - - 161 - - - Lien titre H3 
* Lien de niveau H3 dans bloc colonne Posts et commentaires.
* Gris sombre
* 
****/

.content h3 a, .content h3 a:hover, .content h3 a:active, .content h3 a:visited {
color:#5B5D75;
}

/****
*
* - - - 162 - - - LIEN 
* Lien de niveau H3 dans bloc Posts.
* Avec soulignement qd pointeur survole lien.
*
****/

.content h3 a:hover {
text-decoration:underline;
}

/****
*
* - - - 163 - - - PIED de NOTES 
* Pas pied de commentaires.
* Voir 25 et 152.
*
****/

.postbottom {
line-height:150%;
}

/****
*
* - - - 164 - - - Classe TEXTLABEL 
* Rien dans page commentaires.
*
****/

.textlabel, form td {
line-height:150%;
font-size:12px;
}

/****
* - - - 165 - - - Classe Emailthis 
****/

.emailthis {
line-height:150%;
}

/****
* - - - 166 - - - Rien ds page commentaires 
****/

.validation-advice {
display:inline;
color: #f00;
}


/* S I D E B A R */

/****
*
* - - - 167 - - -  
*
****/

.sidebar ul.album_layout {
padding: 5px 0px;
}

/****
*
* - - - 168 - - -  
*
****/

.sidebar ul.album_layout li.cover {
display: inline;
}

/****
*
* - - - 169 - - -  
*
****/

.sidebar ul.album_layout li.cover img {
width: 65px;
}


/* - - - 203 (pour LIRE la SUITE) - - - */
p.readmore {
text-align: center;
margin: 0px;
padding:0px 100px 10px 5px;
background-color: white;
line-height:100%;
}
/* - - - 204 (pour le lien LIRE la SUITE) - - - */
p.readmore a {
color: #FF0099;
font-weight: bold;
}