Style CSS "Forêt" par D.Delevoye pour Arviblog.com
![]() |
/*fichier de structure général externe*/
@import url("/css/commonstruct2.css");/*ne pas enlever cette ligne qui permet l'evolution des css personnalisés*/
/***************************************/
/*---------------- elements principaux ---------------*/
/*---------------- les styles ci-dessous affectes l'ensemble des éléments de la page n'ayant pas de style propre ou hérité --------------*/
body {
margin: 0px;
padding: 0px;
background-color: #CCD9E6;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: x-small;
background-image: url(http://idata.blogmaster.fr/0/02/12/78/style/foret/vert01.jpg);
}
h1 { color: #000000; font-size: 20px; } /*titre des pages*/
h2 { color: #000000; font-size: 15px; }
h3 { color: #000000; font-size: 12px; }
a {
text-decoration: underline;
color: #1C3637;
font-size: 110%;
} /* liens des pages */
a:hover { text-decoration:none; color:#000000} /* liens survoles*/
legend { color:#000000; padding-left:5px; padding-right:5px;}
li { list-style-type:none; } /*listes non ordonnees*/
img { border:0px solid #000000; } /* images */
input { border:solid 1px #336699; font-size:100%; background-color:#FFFFFF; color:#000000; } /* boutons, champs texte */
/* --------------- Structure -------------------- */
/* les styles ci dessous definissent l'aspect du blog quelque soit la structure (2-3 colonnes...)*/
#centrePage { width:100%;}/*div contenant la page sert à centrer le blog*/
#global {
margin-left: auto;
margin-right: auto;
position: relative;
border: 3px solid #0F2526;
background-image: url(http://idata.blogmaster.fr/0/02/12/78/style/foret/vert04.jpg);
}/*colonne principale, contient toutes les colonnes du blog*/
#main { margin-bottom:5px; }/*colonne principale contenant les articles*/
#content { overflow:hidden; margin:0px;}/*contenu de la colonne main*/
#rightnav {
background-image: url(http://idata.blogmaster.fr/0/02/12/78/style/foret/vert03.jpg);
}/*colonne de droite*/
#leftnav {
background-image: url(http://idata.blogmaster.fr/0/02/12/78/style/foret/vert03.jpg);
}/*colonne de gauche*/
/********************************************************************************************************/
/* GESTION DU POSITIONNEMENT SELON LES DIFFERENTES STRUCTURES */
/*------------------------------------------------------------------------------------------------------*/
/*/! Attention la modification des informations ci-dessous peut entrainer la déformation de votre blog */
/********************************************************************************************************/
#global {width:800px;}/*definie la taille du blog*/
/*~~~~~~~~~~ structure 1 colonne principale + 1 colonne à droite~~~~~~~~~~*/
#deuxColDroite #main { position:relative; float:left; overflow:hidden; width:595px; }/*colonne principale*/
#deuxColDroite #rightnav { position:relative; float:right; margin-bottom:5px; width:195px;}/*colonne de droite*/
/*~~~~~~~~~~ structure 1 colonne principale + 1 colonne à gauche~~~~~~~~~~*/
#deuxColGauche #main { position:relative; float:right; overflow:hidden; width:595px; }/*colonne principale*/
#deuxColGauche #leftnav { position:relative; float:left; margin-bottom:5px; width:195px;}/*colonne de gauche*/
/*~~~~~~~~~~ structure 1colonne à droite + 1 colonne principale + 1 colonne à gauche~~~~~~~~~~*/
#troisCol #main { position:relative; float:left; overflow:hidden; width:400px; margin-left:5px;}/*colonne principale*/
#troisCol #rightnav { position:relative; float:right; margin-bottom:5px; width:195px;}/*colonne de droite*/
#troisCol #leftnav { position:relative; float:left; margin-bottom:5px; width:195px;}/*colonne de gauche*/
/**************************************************************************************************************/
/* ------------------- Box -------------------- */
/*definie le style des modules*/
.box { background-color:transparent; position:relative; margin:0px; padding:0px; margin-bottom:10px;}
.box h2 { color:#000000; margin-left:10px; margin-right:10px; margin-top:0px; margin-bottom:0px; background: url(http://idata.blogmaster.fr/0/02/12/78/style/foret/vert02.jpg);} /*titre de la boite*/
.box-titre { position:relative; padding:0px; text-align:center; }/*div contenant le titre*/
.box-content { overflow:auto; padding:2px 5px; color:#000000; }/*contenu du module*/
.box-content p { margin:5px 0px 5px 15px; padding:0px; }/*paragraphe*/
.box-content ul { margin:5px 0px 5px 15px; padding:0px; }/*liste*/
.box-content li { list-style:square; color:#000000; margin:5px; padding:0px; }/*element d'une liste*/
/* ------------------entete ---------------------*/
#header {
text-align: left;
border: 0px none;
margin-bottom: 5px;
position: relative;
}/*div contenant l'entete du blog*/#top {
padding: 27px;
background-color: #074F17;
color: #FFFFFF;
background: url(http://idata.blogmaster.fr/0/02/12/78/style/foret/ent-foret.jpg);
}/*entete du blog*/
#top a {color: #A3F9B5;}
#top h1 { padding:0px; margin:0px; color:#FFFFFF;}/*titre du blog /! modifiable*/
.topLien{text-decoration:none;}/*lien de l'entête vers la home du blog /! modifiable*/
.topLien:hover {text-decoration:underline;}/*lien de l'entete vers la home du blog survolé /! modifiable*/
/* ---------------------Bas de page----------------*/
#footer { margin-top:10px; background-color:#336699; position:relative; border:0px none; }/*pied de page du blog*/
#footer p { margin:0px; padding: 10px; }/*paragraphes du pied de page*/
#footer a {color: #FFF;}
.basLien{ text-decoration:underline;}
.basLien:hover { text-decoration:underline; }
/* ---------- Recherche ----------------------- */
#Recherche { padding:0px; }
#WForm { margin:0px; border:0px none; padding:10px; }
#WForm input { border:solid 1px #668CB2; font-size:100%; color:#000000; text-align:center;}
#WForm input:hover { border:solid 1px #668CB2; background:#FFFFFF; }
.RNum { font-weight:bold; }/*numero du resultat*/
.RDesc { padding:10px; }/*resume du resultat (premieres lignes de l'article)*/
.ROut { font-style:italic; color:#000000; }/*domaine auquel appartient le resultat*/
.RSize { color:#BFBFBF; }
a.RTitle { text-decoration:none; color:#336699; }/*titre du resultat*/
a.RTitle:hover { text-decoration:none; color:#000000; }/*titre du resultat survole*/
#GGResults { text-align:left; margin:0px; color:#000000; }/*nombre de resultats de la recherche*/
.Result1 { padding:4px; background:#668CB2; }/*resultat style 1*/
.Result2 { padding:4px; background:#FFFFFF; }/*resultat style 2*/
/*------------------- Articles ----------------------------------*/
.article { margin-top:0px; padding:0px; margin-bottom:5px; }/*style general d'un article (entete texte et pied)*/
.article p { padding:0px 0px 5px 5px ;margin:0px; }/*tous les paragraphes composant un article*/
.contenuArticle { margin:1px;}/*style du texte d'un article*/
.Date { margin-right:10px;}/*style de la date affichee dans l'entete de l'article*/
.Option { padding:3px 0px; border-top:1px solid #808080; width:100%; text-align:right; font-size:85%; color:#808080; clear:both;}/*style du pied de l'article (publie par, categorie, commentaire,recommander)*/
.barreHautArticle {padding:0px 0px 5px 0px; margin:0px; width:100%;}/*entete du blog contient la date*/
.categorieArticle {} /*categorie de l'article*/
.categorieArticle a { text-transform:lowercase;}/*lien sur la categorie de larticle*/
.categorieArticle a:hover { text-transform:lowercase;}/*lien survole sur la categorie de larticle*/
.titreArticle { text-decoration:none;}/*lien sur le titre de l'article*/
.titreArticle:hover { text-decoration:underline;}/*lien survole sur le titre de l'article*/
#articleSeul {} /*style d'un article lors de l'affichage de l'article avec commentaires/trackbacks*/
.GcheTexte{float:left; margin:3px;}
.DrteTexte{float:right; margin:3px; }
.CtreTexte{margin:3px auto; display:block;}
.hitcitation {font-style:italic;text-align:justify;padding:5px 20px;background-color:#eee;}
.hitencart {border:1px solid black;text-align:justify;font-weight:bold;margin:5px 0px;padding:5px 5px;}
.hitimportant {font-weight:bold;color:red;font-weight:bold;font-size:120%;}
.hitperso1 {font-style:italic;}
.hitperso2 {font-weight:bold;}
/*--------------------Liste des articles-------------------------*/
.listArticles { margin-top:0px; margin-bottom:10px; border:1px solid #FFFFFF;}/*style d'un article*/
.resumeArticle {}/*style du resume d'un article*/
/*--------------------Commentaires---------------------------- */
.h2commentMessage {color:#336699;}
.comment { }
.comment hr { }
.linkcomment { font-size:130%; color:#336699;}/*lien d'ajout d'un commentaire*/
.commentMessage { padding:5px; border:1px dotted #000000; background-color:#CCD9E6; margin:0px;}/*texte d'un commentaire*/
.commentOption { text-align:right; font-size:85%; color:#000000; margin-bottom:10px;}/*infos sur le commentaire auteur site...*/
/*---------------formulaire de saisie d'un commentaire--------------*/
#formComment {background-color:#FFF;border:1px solid #336699;}
#formComment label { width:70px; } /*texte associé aux champs de sasie*/
#formComment input { background-color:transparent; border:1px solid #000000;}/* boutons, champs texte */
#formComment textarea { background-color:transparent; border:1px solid #000000;}/*zone de saisie de texte*/
/*-------------------trackback----------------------------------*/
#addTrackback { border:1px dotted #000000; background:#CCD9E6; padding:5px;} /* cadre donnant l'adresse de trackback*/
.affTrackback { padding:5px; border:1px dotted #000000; background-color:#CCD9E6; margin-bottom:10px;}/**/
.affTrackback h2 { color:#000000;}/**/
.linkTrackback { font-size:130%; color:#336699;}/*lien vers la fenetre d'ajout de trackback */
.h2Trackback { color:#000000;}/**/
/*-----------------fenetre d'ajout d'un trackback---------------------*/
#divTrackBack {background-color:#FFF;border:1px solid #336699;}/*style general*/
#divTrackBack input { background-color:transparent; border:1px solid #000000;}/*champs de texte bouton*/
#divTrackBack textarea { background-color:transparent; border:1px solid #000000;}/*zone de saisie de texte*/
/*-------------------fenetre de recommandation---------------------------*/
#divRecommander {background:#FFF; border:1px solid #336699;}/*style general*/
#divRecommander span { font-size:larger; color:#FFCCCC;}
#divRecommander legend { font-size:larger; color:#000000;}/*texte du cadre*/
#divRecommander fieldset { padding:3px; margin:5px; background:#FFFFFF;}/*conteneur des champs*/
#divRecommander input { background-color:transparent; border:1px solid #000000;}/*champs de texte bouton*/
#divRecommander textarea { background-color:transparent; border:1px solid #000000;}/*zone de saisie de texte*/
/*-----------------Newsletter-----------------------------------*/
#divNewsletter h2 { text-align:center; font-size:12pt;}/*titre de la page*/
#divNewsletter input { background-color:transparent; border:1px solid #000000;}/*champs de texte checkbox*/
#divNewsletter {background:#FFF; border:1px solid #336699; }/*texte des checbox*/
/* ---------------------Calendrier--------------------------------- */
.calendarTop1 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-style: normal; color:#000000; font-weight: bold; background-color:transparent;} /*entete*/
.calendarToday1 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; color:#CCD9E6; background-color:#668CB2;} /* Aujourd'hui */
.calendarDays1 { width:50px; height:15px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-style: normal; color:#000000; text-align:center;}
.calendarHeader1{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color:#000000;} /* lettre de la semaine */
.calendarTable1 { border:0px none;} /* contour du calendrier */
/*-----------------------Pagination-------------------------*/
.pagination { color:#000000; }
.pagination a {} /*Liens*/
.pagination b{ } /*Page courante*/
/*------------------------Divers-----------------------------*/
.cleaner {clear:both;}
/*-----------------------elements commun a l'accueil et aux pages d'un album------------------------------*/
#bodyAlbum{ background-color:#FFFFFF;}/*style general de la page de l'album*/
#generalAbum{width:100%;}/*div contenant tout l'album peut etre utilise à la place de bodyAlbum*/
.topAlbum{}/*entete de l'album contient l'entete du blog*/
#enteteAlbum{ width:100%; border:1px solid #FFFFFF; font-size:130%; color:#FFFFFF; background-color:#CCD9E6;}/*ligne sous l'entete du blog contient les liens vers les albums*/
#enteteAlbum a {color:#336699; text-decoration:none;}
#enteteAlbum a:hover {color:#000000; text-decoration:underline;}
.lienAlbum {text-decoration:none;}
.lienAlbum:hover{text-decoration:underline;}
#piedAlbum{ width:100%; text-align:center; margin-top:5px; background-color:#CCD9E6;}/*pied de page de l'album*/
.h2Album { text-align:center; font-size:12pt; color:#000000;}/*titre de l'album/la photo*/
.topLienAlbum{text-decoration:none;}/*lien vers un album*/
.topLienAlbum:hover{}/*lien survole*/
/*-------------------------------Accueil album------------------------*/
#centreAccAlbum{}/*contient les thumbnails de l'accueil de l'album (non utilise)*/
.AccAlbum{ text-align:center;}/*contient les thumbnails de l'accueil de l'album*/
.thumbAccAlbum { display:inline; margin:5px;}/*div contenant une miniature*/
.thumbAccAlbumimg { padding:5px 0px;}/*miniature*/
/*-----------------------Album photo--------------------------*/
.nomPhotoAlbum { font-size:large; color:#000000; text-align:center;}/*nom de la photo affichée*/
.quickNavAlbum{margin:0px; padding:0px; border:1px solid #668CB2; width:100%; text-align:center;}/*liens de navigation rapide (precedent suivant retour)*/
.quickNavAlbum a {text-decoration:none;} /*liens de la navigation rapide*/
.quickNavAlbum a:hover {text-decoration:underline;}/*liens survole de navigation rapide*/
.precAlbum{ float:left; text-decoration:none; position:relative; padding:0px; margin:0px;}/*liens et titre photo precedente*/
.suivAlbum{ float:right; text-decoration:none; position:relative; padding:0px; margin:0px;}/*liens et titre photo suivante*/
.retourAlbum{ position:relative; text-decoration:none; padding:0px; margin:0px auto; width:6em;}/*liens de retour album photo*/
#centrethumbsAlbum{ background-color: #FFFFFF;}/*contient les miniatures de l'accueil de l'album (non utilise)*/
.thumbsAlbum { padding:2px; width:650px; margin-right:auto; margin-left:auto;}/*miniatures de l'album contient toutes les miniautures*/
.thumbAlbum { display:inline; margin:3px;}/*div contenant une miniature*/
.thumbAlbum img { border:1px solid #FFFFFF;}/*miniature*/
.thumbCouranteAlbum { display:inline; margin:3px;}/*div contenant la miniature de la photo courante*/
.thumbCouranteAlbum img { border:3px dashed #000000;}/*miniature de la photo courante*/
#photo{ text-align:center; }/*div contenant la photo courante*/
#photo img {margin: 2px auto; border:1px solid #000000;}/*photo courante*/



