/* -----------------------------------------------------------------
*	CREDITS
*		Thème RoseBud 1.1 by jibHaine
*		Icones du Crystal_project 
* 		Structure du css par Kozlika  
*  ------------------------------------------------------------- */


/* ------------------------------------------------------------
	BALISES HTML PAR DEFAUT
------------------------------------------------------------- */
*{margin:0;padding:0;border:none;font-family:Arial,Verdana,Helvetica, sans-serif;font-weight:400;font-size:12px;}
body,html { background:#333;height:100%;}
 
h1 { font-size:24px;}
h2,.post-title a { font-size:18px;}
h3 { font-size:16px;}
h4 { font-size:14px;}
h5 { font-size:13px;}
h6 { font-size:12px;}
h1,h2,h3,h4,h5,h6, .post-title a{font-family:Century Gothic, BitStream Vera Sans, monospace;font-weight:300;text-transform:uppercase;}

p { }
img { }
sup { }
abbr, acronym { }

blockquote {background:#EEE;border:1px solid #999;} 
pre{ background:#000;}

ul ,dl{ list-style-type:none;}
ol{}

form { }
fieldset { }
input { }
label { }

a,a:link {color:#C3C;text-decoration:none;}
a:visited {color:#939;}
a:hover {color:#F3F;text-decoration:underline;}
a:focus { }
a[hreflang]:after { }
a img { }
 
code, pre { font-family:system;letter-spacing:1px;}
pre{background:#000;color:#FFF;overflow:auto;}
 
hr { }
 
/* ------------------------------------------------------------
	2b. STYLES COMMUNS
------------------------------------------------------------- */
blockquote, pre {width:280px;margin:10px auto;padding:10px;}
.pagination, #navlinks, .post-info-co, .navigation{text-align:center;margin:10px auto;}
.dd, .post-excerpt,
.post-content {text-align:justify; }
.read-it, .tags p{text-align:right; }
.post-tags li { display:inline; }


/* ------------------------------------------------------------
	3. PAGE
------------------------------------------------------------- */
 
#page {
	width:710px;height:auto;position:relative;
	margin:0 auto;
	background :#333 url(img/page.gif) repeat-y center;
}

 
/* ------------------------------------------------------------
	4. HAUT DE PAGE
------------------------------------------------------------- */

#top {
	width:698px;margin:0px 6px;height:147px;
	background :#FFF url(img/header.jpg) no-repeat left top;
}
#top h1 {position:absolute;top:110px;left:15px;}
#top h1 a {color:#F3F;text-decoration:none;text-transform:uppercase;font-size:24px;}

#prelude {position:absolute;top:5px;right:15px;color:#F3F;}
#prelude a {color:#F3F;}

#menu{height:22px;width:698px;margin:0px 6px;
	background : #333 url(img/menu.gif) repeat-x;padding:5px 0px;}
#menu ul{margin:0px 5px;}
#menu li{display:inline;padding:0 5px;}
#menu a {color:#999;}
#menu a:hover {color:#CCC;}
/* ------------------------------------------------------------
	5. WRAPPER MAIN CONTENT
------------------------------------------------------------- */
#wrapper{padding:0 6px;}
#aewrapper {width:698px;margin:0px 6px;}
#main {width:445px;float:left;margin-left:15px;}
#sidebar {width:206px;float:right;margin:60px 15px 10px 0px;}
#content { }

/* ------------------------------------------------------------
	6. BILLETS
------------------------------------------------------------- */

.post {margin-bottom:30px; }
.post.first {margin-top:10px }
.post.odd { }

.day-date { }
.post-title {padding-top:5px; }
.post-info,
.post-tags  {height:20px; }
.post-excerpt,
.post-content {margin:10px 0px; }

.post-excerpt ul li, .post-excerpt dl li,
.post-content ul li, .dc-archive #content ul li{ padding-left:12px;background:url(ico/li.gif) no-repeat left center; }
.post-excerpt ol li,
.post-content ol li { margin-left:20px;}


/** POST ICONES **/
.post-tags li a{padding:3px 2px 3px 20px;background:url(ico/tag.gif) no-repeat left center; }
.post-info .author{padding:3px 2px 3px 20px;background:url(ico/user.gif) no-repeat left center; }
.post-info .time{padding:3px 2px 3px 20px;background:url(ico/time.gif) no-repeat left center; }
.post-info .category{padding:2px 2px 2px 12px;background:url(ico/li.gif) no-repeat left center; }
.post-tags{}
.post-info-co a { padding:2px 2px 2px 20px;}
.comment_count {background:url(ico/comment.gif) no-repeat left center; }
.ping_count {background:url(ico/ping.gif) no-repeat left center; }
.attach_count { background:url(ico/attach.gif) no-repeat left center; }


/** DAY DATE **/
.day-date{
	float:left;margin-right:5px;
	width:47px;height:48px;
	padding:11px 6px 7px 7px;
	background:url(img/date.gif) no-repeat top left;}
.day-month,.day-number{display:block;text-align:center; overflow:hidden}
.day-month{font-size:10px;color:#FFF;}
.day-number{font-size:28px;font-weight:100;}

/** TITRES **/
#comments h3, 
#comment-form h3,
.footnotes h4, #pings h3, #pr h3,
#attachments h3 , .message , .error, #content-info h2{padding:10px 40px; }

#comments h3{background:url(img/titre_comment.gif) no-repeat left center;}
#comment-form h3{background:url(img/titre_comment_add.gif) no-repeat left center;}
.footnotes h4{background:url(img/titre_note.gif) no-repeat left center;}
#pings h3{background:url(img/titre_ping.gif) no-repeat left center;}
#pr h3{background:url(img/titre_comment_preview.gif) no-repeat left center;}

#attachments h3 {background:url(img/titre_attach.gif) no-repeat left center;}
.message{background:url(img/titre_comment.gif) no-repeat left center;}
.error{background:url(img/titre_error.gif) no-repeat left center;}

.dc-tag #content-info h2,
.dc-tags #content-info h2{background:url(img/titre_tags.gif) no-repeat left center;}
.dc-archive #content-info h2{background:url(img/titre_archive.gif) no-repeat left center;}
.dc-search #content-info h2{background:url(img/titre_recherche.gif) no-repeat left center;}
.dc-category #content-info h2{background:url(img/titre_bug.gif) no-repeat left center;}
.dc-404 #content-info h2{background:url(img/titre_error.gif) no-repeat left center;}
#attachments { }
#attachments ul li a{margin: auto auto; }
#attachments ul li {
	width:250px;min-height:32px;
	padding:5px 10px 5px 42px;
	margin:15px auto;
   	background:#DDD url(ico/misc.png) no-repeat 5px 5px;
}
   
#attachments li.audio {	background:#DDD url(ico/midi.png) no-repeat 5px 5px;}
#attachments li.package {background:#DDD url(ico/zip.png) no-repeat 5px 5px;}
#attachments li.text {	background:#DDD url(ico/doc.png) no-repeat 5px 5px;}
#attachments li.image{	background:#DDD url(ico/img.png) no-repeat 5px 5px;}


/* ------------------------------------------------------------
	7. COMMENTAIRES, PINGS
------------------------------------------------------------- */

#comments { }
#pings { }
#pr { }
#comment-form { }

#comments h3 { }
#pings h3 { }
#pr h3 { }
#comment-form h3 { }

/*carde des commentaires*/
#comments .dl ,#pings .dl,#pr .dl {
	width:300px;margin:10px auto;
	background:#CCC url(img/com_fond.gif) repeat-y top left; 
	}
#comments .dt ,#pings .dt ,#pr .dt { 
	padding:20px 8px 0px 8px;height:70px;position:relative;
	background:#fff url(img/com_haut.gif) no-repeat left 20px;
}
#comments .dd ,#pings .dd ,#pr .dd{ 
min-height:15px;padding:0px 15px 15px 15px;position:relative;
	background:transparent url(img/com_bas.gif) no-repeat bottom left;
	}
#comments .first { }
#comments .odd { }
#comments .me *{color:#C3C; }
.me .comment-author{font-weight:bold;}
.comment-author, .comment-number{display:inline-block;}
.comment-author{margin-left:40px;}
.comment-date{margin-left:20px;margin-top:20px;color:#999;display:block;}
.comment-number,a.comment-number{font-size:20px;text-decoration:none;}
.comment-author,  .comment-author a{font-size:14px;text-decoration:none;}

#pings .first { }
#pings .odd { }
#pings .me { }

#pr dl { }
#pr dd { }

#comment-form fieldset , .form-help{width:300px; margin: 0 auto; }
.field {background:#FFF;padding:0; }
.field label { display:block;margin:3px 0px;}
.field input {
	background:#CCC url(img/input.gif) no-repeat;
	padding:2px 4px;	
	width:292px;height:16px;
	}
.field textarea {
	background:#CCC url(img/textarea.gif) no-repeat;
	padding:2px 4px;	
	width:292px;height:166px;
	}

#comment-form input[type=submit],
#comment-form input[type=reset]
{	background:#C6C url(img/bouton.gif) no-repeat;
	margin:5px 0px;color:#FFF;
	width:132px;height:20px; }
#comment-form input[type=submit]:hover,
#comment-form input[type=reset]:hover
{	
	color:#CCC;
	background:#C6C url(img/bouton_hover.gif) no-repeat;
}
.form-help {margin:5px auto; }

#ping-url {margin:0 auto; }
#comments-feed {margin:20px auto;width:300px;}


/* ------------------------------------------------------------
	8. SIDEBAR
------------------------------------------------------------- */

#sidebar { 
color:#FFF;
}

#blognav, #blogextra{
background : #333 url(img/side_fond.gif) repeat-y left bottom;
}
#blognav h2,#blogextra h2{
background : transparent url(img/side_haut.gif) no-repeat left top;
padding:15px 15px 5px 15px; text-align:center;
}

#blognav div, #blogextra div{ 
background : transparent url(img/side_bas.gif) no-repeat left bottom;
padding:0px 0px 35px 0px;}


#sidebar h2 { color:#FFF;font-size:15px;}
#sidebar h3 {color:#CCC;font-size:13px;}
#sidebar a {color:#F3F;}
#sidebar a:hover {color:#CCC;}
#sidebar ul,#sidebar p,#sidebar h3,#sidebar fieldset{margin:0px 10px;width:186px;}
#sidebar li {padding:4px 0px;}


/* boites du menu des widgets livres avec Dotclear */
div#search {
	position:absolute;top:175px;right:12px;
	width:222px;height:58px;
	padding:0px;
	background:#FFF url(img/side_search.gif) no-repeat left bottom;
}
#search h2{display:none;}
#search p {padding:0; }
#search form {padding:0; }
#search #q {
	width:107px;height:16px;padding:1px 1px 1px 19px;
	background:#FFF url(img/search_champ.gif) no-repeat left bottom;
} 
#search .submit {
	width:32px;height:18px;color:#FFF;margin-left:5px;padding:1px;
	background:#FFF url(img/search_btn.gif) no-repeat left top;
} 
#search form fieldset p{margin-left:15px;}

#topnav {display:none; }
.topnav-arch { }
.topnav-home { }

.selected { }
.lang { }
.categories { }
.syndicate { }
.lastposts { }
.lastcomments { }
.text { }
.links { }

.tags p strong a{text-align:right; }
/* a completer separement ou globalement pour le sidebar et la page 
spécifique des tags avec les differentes class des tags en fonction 
de leur frequence - voir 9/ classes communes */


/* ------------------------------------------------------------
	9. FOOTER
------------------------------------------------------------- */

#footer {height:32px;width:698px;margin:0px 6px;background : #333 url(img/footer.gif) repeat-x; }
#footer p {text-align:center;color:#CCC;padding-top:10px;}
#footer a {color:#999;}
#footer a:hover {color:#CCC;}
/* ------------------------------------------------------------
	10. CLASSES COMMUNES
------------------------------------------------------------- */

/* class sur les liens rss (on peut y placer l'icone
feed.png a piocher dans le theme par defaut par ex.) */

.feed { 
	padding:2px 0px 2px 18px;
	background : transparent url(img/feed.png) no-repeat left center !important;
	background : transparent url(ico/feed.gif) no-repeat left center;
	 }


/* tags dans le sidebar et dans la page les regroupant
(exemple ici pour un nuage) */
.dc-tags #content ul li, .dc-tags #content ul li a, 
.tags ul li, .tags ul li a {
	display : inline;
	width : auto;
	padding-left : 0;
	padding-right : 4px;
	background : transparent;
	line-height : 1.5em;
}
.tags ul li a:hover {
	background-image :none;
}
.dc-tags .tag0, .tags .tag0 { font-size: 85%; }
.dc-tags .tag10, .tags .tag10 { font-size: 90%; }
.dc-tags .tag20, .tags .tag20 { font-size: 95%; }
.dc-tags .tag30, .tags .tag30 { font-size: 100%; }
.dc-tags .tag40, .tags .tag40 { font-size: 105%; }
.dc-tags .tag50, .tags .tag50 { font-size: 110%; }
.dc-tags .tag60, .tags .tag60 { font-size: 115%; }
.dc-tags .tag70, .tags .tag70 { font-size: 120%; }
.dc-tags .tag80, .tags .tag80 { font-size: 125%; }
.dc-tags .tag90, .tags .tag90 { font-size: 130%; }
.dc-tags .tag100, .tags .tag100 { font-size: 135%; }

/* messages d'erreur */
.error {
	border : 1px solid #c44;
	background : #df0;
	padding : 0.5em;
	}
.error ul {
	padding-left : 20px;
	}
.error li {
	list-style : square;
	}
	
/* exemples de ceux que j'ajoute souvent */
.left { float: left; margin-right : 1em; }
.right { float: right; margin-left : 1em; }
.center { margin-left : auto; margin-right : auto; }
.left-text { text-align : left; }
.right-text { text-align : right; }
.center-text { text-align : center; }
.little-text { font-size : .8em;}
.little-upper-text { font-size : .8em; text-transform : uppercase; }


/* ------------------------------------------------------------
	11. PAGES SPECIFIQUES
	j'indique le marqueur du body, a completer pour cibler 
	plus precisement (cf l'exemple ci-dessus pour les tags)
------------------------------------------------------------- */

.dc-home { }
.dc-post { }
.dc-categories { }
.dc-category { }
.dc-archive #content h3 { font-size:18px;text-align:center;margin-top:10px;}
.dc-archive #content h4 { margin-top:10px;}
.dc-archive-month { }
.dc-tags { }
.dc-tag { }
.dc-404 { }
.dc-search { }


/* ---------------------------------------------------
  12. ET POUR FINIR NE PAS OUBLIER LES CLEARERS
	ici ceux le plus souvent necessaires
--------------------------------------------------- */
.post, .post-content, .footnotes, .attachments, 
.post-info-co, #comments, #footer {
    clear:both;
    }