/* ***** BEGIN LICENSE BLOCK *****
 * This file is part of DotClear.
 * Copyright (c) 2004 Maurice Svay and contributors. All rights
 * reserved.
 *
 * DotClear is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; either version 2 of the License, or
 * (at your option) any later version.
 * 
 * DotClear is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 * 
 * You should have received a copy of the GNU General Public License
 * along with DotClear; if not, write to the Free Software
 * Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA
 *
 * ***** END LICENSE BLOCK *****
 *
 * Contributor(s):
 *  Maurice Svay
 */

/* Ce fichier définit le style visuel pour les différents éléments du blog.
 * Dans l'ordre, vous trouverez les règles qui définissent l'apparence pour:
 * - les éléments HTML en général
 * - la page
 * - l'entête
 * - le prélude
 * - le contenu
 * - la barre de navigation
 * - le pied de page
 *
 * L'agengement des blocs est défini dans le fichier layout.css
 * Pour mettre la barre de navigation à gauche, décommentez l'appel à 
 * layout-gauche.css
 */

/*@import "layout.css";*/
/* @import "layout-gauche.css"; */
 
/* Les éléments HTML en général
-------------------------------------------------------- */

*{
	/*border: 1px red solid;*/
	margin: 0;
	padding: 0;
}

body{
	background: #000 /*url(img/bg_body.png)*/;
	color: #000;
	font-size: 80%;
	line-height: 1.6em;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}

h1, h2, h3, h4, h5, h6{
	font-family: Lucida Sans, Lucida Grande, Tahoma, "Trebuchet MS", sans-serif;
	text-transform: uppercase;
}

h1{font-size: 1.5em;}
h2{font-size: 1.4em;}
h3{font-size: 1.3em;}
h4{font-size: 1.2em;}
h5{font-size: 1.1em;}
h6{font-size: 1em;}

hr{	
	border: 2px solid #fff;	
	margin-top: 1em;
	text-align: left;
	width: 150px;
}

img.gauche{
	float: left;
	margin: 1em 1em 0 1em;
}

img.droite{
	float: right;
	margin: 1em 1em 0 1em;
}

img.centre{
	margin: 1em 2em 0 2em;
}

img.float{
	margin: 0.5em;
}

img.cc{
	float: right;
}

img.gravatar_img{
	float: left;
	margin-right: 0.5em;
}

blockquote, .erreur{
	background: url(img/bg_blockquote.png) no-repeat top right #f408a9;	
	border: 1px solid #f408a9; 
	color: #fff;
	font-family: Georgia, Verdana, Geneva, Arial, Helvetica, sans-serif;	
	font-style: italic;	
	margin: 0.5em 0;
	padding: 0 40px 0 1em;
}

pre, code{
	font-size: 1.2em;
}

pre{
	width: 100%;
	overflow: auto;
	border: 1px solid #ccc;
}

h3{
	background: url(img/bg_h3.gif) no-repeat;
	color: #fff;
	font-weight: normal;
	margin-top: 2em;
	margin-bottom: 1em;
	padding-left: 30px;
}

fieldset{
	border: none;	
	margin-top: 1em;
}

legend{
	color: #fff;
	cursor: pointer;
	font-size: 0.8em;
	margin-left: 1em;
	text-transform: uppercase;
}

.field label{
	display: block;
}

input,textarea{
	background: #1d1c1d;
	border: 1px solid #2e2d2d;
	color: #fff;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;	
	font-size: 0.8em;
	margin: 0.5em;
	padding: 0.2em;
}

input.submit{
	background: #f408a9;
	border: 0;
	color: #fff;
	text-transform: uppercase;
}

object{
	margin: 2em, auto;
}

object.float{
	float: right;
	margin: 1em 1em 0 1em;
}

div.portfolio{ 		
	margin-top: 2em;	
}

div.portfolio a{
	float: left;
	margin: 0.25em 0.5em;
}

div.portfolio img{
	border: 7px solid #fff;
}

div.portfolio img:hover{
	border: 7px solid #61cbf8;
}

div.portfolio p{
	clear: left;
	text-align: center;
}

span.etat{
	font-size: 0.5em;
}

table.cv  th{
	display: none;
}

table.cv td{
	padding-top: 1em;
	width: 25px;
}

table.cv td.domaine{
	width: 80%;
}

textarea{
	width: 50%;
	font-family: Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
}

a{
	color: #61cbf8;
	text-decoration: none;
}

a:visited{
	color: #61cbf8;
}

a:hover{
	text-decoration: underline;
}



/* La page
-------------------------------------------------------- */
#page{
	width: 100%;	
	text-align: justify;
}
 
/* L'entête
-------------------------------------------------------- */
#header{
	background: url(img/bg_header.png) no-repeat left top !important;
	background: url(img/bg_headerIE.png) no-repeat left top;
	height: 410px;	
	/*margin-top: 25px;	*/
}

/* Le prélude
-------------------------------------------------------- */ 
#prelude{
	background: #f408a9;
	border-top: 4px solid #f408a9;
	/*margin: 0 0 0 -390px;		*/
	position: absolute; top: 0; right: 0;	
}

#prelude a{
	background: transparent;
	border-right: 1px solid #000;
	color: #fff;
	font-size: 0.7em;
	line-height: 20px;
	margin: 0 0.5em;
	padding: 0 0.5em;	
	text-align: right;
	text-decoration: none;
	text-transform: uppercase;
}

#prelude a:hover{
	text-decoration: underline;	
}

#menu{
	height: 35px;
	margin: auto;
	padding-top: 3em;
	padding-bottom: 2em;	
	width: 600px;
}

	#menu a{
		color: #fff;
		display: block;
		float: left;
		height: 35px;	
		margin: 0 2px;
		text-indent: -9000px;
	}

	#menu a#actualite:link, #menu a#actualite:visited{
		background: url(img/bg_ongletActualite_mo.gif) no-repeat;
		width: 111px;
	}

	#menu a#presentation:link, #menu a#presentation:visited{
		background: url(img/bg_ongletPresentation_mo.gif) no-repeat;
		width: 127px;
	}

	#menu a#competences:link, #menu a#competences:visited{
		background: url(img/bg_ongletCompetences_mo.gif) no-repeat;
		width: 129px;
	}

	#menu a#creations:link, #menu a#creations:visited{
		background: url(img/bg_ongletCreations_mo.gif) no-repeat;
		width: 107px;
	}

	#menu a#contact:link, #menu a#contact:visited{
		background: url(img/bg_ongletContact_mo.gif) no-repeat;
		width: 91px;
	}

	#menu a#actualite:hover, #menu a#actualite:active{
		background: url(img/bg_ongletActualite_mu.gif) no-repeat;
	}

	#menu a#presentation:hover, #menu a#presentation:active{
		background: url(img/bg_ongletPresentation_mu.gif) no-repeat;
	}

	#menu a#competences:hover, #menu a#competences:active{
		background: url(img/bg_ongletCompetences_mu.gif) no-repeat;
	}	

	#menu a#creations:hover, #menu a#creations:active{
		background: url(img/bg_ongletCreations_mu.gif) no-repeat;
	}

	#menu a#contact:hover, #menu a#contact:active{
		background: url(img/bg_ongletContact_mu.gif) no-repeat;
	}

#main{	
	width: 100%;
}
	
#sectionPresentation, #sectionCompetences, #sectionCreations, #sectionContact{
	height: 50px;
	margin-top: 1em;
	margin-bottom: 4em;
	padding-left: 60px;
}

#sectionPresentation{
	background: url(img/ico_presentation.gif) no-repeat;
}

#sectionCompetences{
	background: url(img/ico_competences.gif) no-repeat;
}

#sectionCreations{
	background: url(img/ico_creations.gif) no-repeat;
}

#sectionContact{
	background: url(img/ico_contact.gif) no-repeat;
}

#sectionPresentation a, #sectionCompetences a, #sectionCreations a, #sectionContact a{
	background: url(img/bg_h3.gif) no-repeat;
	display: block;
	float: left;
	font-size: 0.8em;
	margin-top: 0.7em;
	margin-right: 1em;
	padding-left: 30px;
	text-transform: uppercase;
}

#sectionPresentation span.titreSection, #sectionCompetences span.titreSection, #sectionCreations span.titreSection, #sectionContact span.titreSection{
	display: block;
	color: #fff;
	font-size: 2em;
	text-transform: uppercase;
}

#boxes{
	background: url(img/bg_boxes.png) no-repeat top;
	height: 205px;	
}

#boxes{
	display: none;
	/*border: 1px yellow solid;*/
	height: 210px;	
	margin: 4em auto;	
	width: 910px;
}

#skills, #portefolio, #cv{
	/*border: 1px red solid;*/
	float: left;
	height: 205px; 
	margin: 0 25px 0 25px;
	width: 265px;
}

#skills a, #portefolio a, #cv a{
	/*border: 1px yellow solid;*/
	display: block;
	height: 30px;
	margin-top: 165px;
	width: 250px;
}

#skills{	
	margin-left: 0;	
}

#cv{	
	margin-right: 0;	
}


#competences a, #portefolio a, #cv a{
	text-indent: -9000px;
}

#content{	
	margin: 0 300px 0 0;
	padding: 1em 0 0 8em;
}

/* Le contenu
-------------------------------------------------------- */
.day-date{
	display: none;
}

.post{
	margin-bottom: 4em;
}

.post-title{
	background: url(img/bg_h1.png) no-repeat bottom left;
	color: #fff;
	padding-bottom: 0.5em;
}

.post-title a{
	color: #fff;
	text-decoration: none;
}

.post-info{
	background: url(img/bg_h3.gif) no-repeat;
	color: #fff;
	font-size: 0.8em;
	margin-top: 1em;
	padding-bottom: 1ex;
	padding-left: 30px;
}

.post-info a{
	color: #61cbf8;
	background: transparent;
	text-decoration: none;
}

.post-content{
	/*background: url(img/bg_pContenu.gif) no-repeat right bottom;*/
	border-bottom: 3px solid #f408a9;
	color: #fff;
	/*font-family: Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;*/
	padding-bottom: 4em;
	text-align: justify;	
}

.post-content blockquote{
	font-family: Georgia, serif;
	font-style: italic;
}

.post-content li{
	background: url(img/etoile.gif) no-repeat top left;
	list-style-type: none;	
	padding-left: 15px;
}

.post-content p{
	/*ine-height: 2em;*/
	margin: 1em 0;
	text-indent: 1em;
}

.medias{
	background: url(img/bg_medias.png) no-repeat bottom #000;	
	margin: 2em auto 0 auto;
	padding: 0 35px 0 15px;
	width: 550px;
}

.post-content span.small{
	font-size: 0.8em;
}

.post-content ul{
	border-left: 5px solid #f408a9;
	margin: 1em 0 1em 4em;
	padding-left: 1em;
}

.post-info-co{
	color: #fff;
	font-size: 0.8em;
	text-align: right;
}

	.post-info-co a:link, .post-info-co a:visited, .post-backToMenu a:link, .post-backToMenu a:visited{
		color: #fff;
		text-decoration: none;
	}
	
	.post-info-co a:hover, .post-info-co a:active, .post-backToMenu a:hover, .post-backToMenu a:active{
		color: #dfdfdf;
		text-decoration: none;
	}
	
.post-backToMenu{ 
	background: url(img/bg_backToMenu.gif) bottom left no-repeat;
	clear: left;
	height: 18px;
	margin-bottom: 4em;
	padding-left: 30px;
}
	
	.post-backToMenu a{ 
		font-size: 0.8em;
	}

#trackbacks blockquote, #comments blockquote{
	margin: 1em 0;
	padding: 1ex 1em;
}

#trackbacks p, #comments{
	color: #fff;
	margin: 1em 0;
	padding: 1ex 1em;
}

/* La barre de navigation
-------------------------------------------------------- */
#sidebar{
	float: right;
	padding-bottom: 4em;
	width: 240px;
}

	#sidebar a:link, #sidebar a:visited{
		font-size: 0.8em;
		text-transform: uppercase;
	}

	#sidebar div{
		border-bottom: 1px solid #f0f0f0;
		color: inherit;	
		margin: 2em 30px 0 0;
		padding: 1ex 1em;	
	}
	
		#sidebar div ul{
			list-style: none;
			margin: 0;
			padding: 0;			
		}
	
	#sidebar h2, #sidebar h3{
		color: #fff;
		margin: 0 0 1ex 0;
	}

	#sidebar h3{
		font-size: 1em;
		margin: 0;
	}

	#sidebar #calendar{
		display: none;
	}
	
	#sidebar #search, #sidebar #dl, #sidebar #categories, #sidebar #archives, #sidebar #links, #sidebar #syndicate{
		padding-bottom: 2em;
		padding-left: 60px;
	}

	#sidebar div#search{
		background: url(img/ico_search.gif) no-repeat top left;
		color: inherit;
		line-height: 2.3em;
	}	

	#search fieldset, #search p{
		margin: 0;
		padding: 0;
	}

	#q{
		background: #fff url(img/q.png) no-repeat 4px center;
		padding-left: 18px;	
	}
		
	#sidebar #dl{
		background: url(img/ico_presentation.gif) no-repeat top left;
	}
	
	#sidebar #categories{
		background: url(img/ico_categories.gif) no-repeat top left;
	}

	#sidebar #archives{
		background: url(img/ico_archives.gif) no-repeat top left;
	}

	#sidebar #links{
		background: url(img/ico_liens.gif) no-repeat top left;
	}
	
		#sidebar #links h3{
			background: url(img/etoile.gif) no-repeat top left;
			font-size: 0.8em;
			line-height: 10px;
			margin: 0.5em 0 0.2em 0;
			padding-left: 15px;
		}

	#sidebar #syndicate{
		background: url(img/ico_rss.gif) no-repeat top left;
	}

/* Le rappel du menu 
--------------------------------------------------------*/
#rappelMenu{
	background: #f408a9;
	clear: both;
	color: #000;	
	text-align: center;
}

#rappelMenu a{
	color: #fff;
	font-size: 0.8em;
	text-transform: uppercase;
}

#rappelMenu a:hover, #rappelMenu a:active{
	color: #fff;		
}

/* Le pied de page
-------------------------------------------------------- */
#footer{	
	background: #f408a9;
	color: #dfdfdf;
	height: 40px;
	margin: 0;
	padding: 0 1em;
}

	#footer a{
		color: #dfdfdf;
		font-size: 0.8em;
		margin-right: 2em;
	}

	#footer img{
		padding-bottom: 1em;
	}
	
	#footer img.cc{
		border: 0;
	}
	
/* L'annonce Flash
--------------------------------------------------------*/
	
#annonceFlash{
	display: none;
	/*position: absolute; top: 10px; left: 50px;*/	
}