@charset "utf-8";
/*** CSS Document ***/


*{
	margin:0;
	padding:0;
}

body{
	background:url(../img/background.jpg) repeat-x;
	background-color:#f5f5f5;
	font-family:"Trebuchet MS", Georgia, "Times New Roman", Times, serif;
	font-size:12px;
	color:#848484;	
}


/*** DIV ***/
#header{
	width:950px;
	height:239px;
	background:url(../img/logo.jpg);
	margin:0 auto;
	padding-top:14px;
}

#date{
	width:190px;
	height:30px;
	margin:40px 0 0 660px;
	padding-top:12px;
	text-align:center;
	background:url(../img/date.jpg);
	font-size:11px;
	color:white;
	font-weight:bold;
}

#conteneur{
	width:932px;
	margin:0 auto;
	background:url(../img/conteneur.png) repeat-y;
}

#contenu{
	width:480px;
	padding-left:60px;
	float:left;
}

#footer{
	width:950px;
	margin:0 auto;
	background:url(../img/footer.jpg) no-repeat;
	text-align:center;
	padding-top:100px;
}

#menu{
	width:912px;
	height:80px;
	margin:0px auto 0 auto;
	background:url(../img/menu.jpg) repeat-x;
}


.orange{
	background-color:#ffe9c4;
	border:1px dotted #ffcb79;
	padding:6px;
	margin:20px 0 20px 0;
}

.blanc{
	border:1px dotted #ffcb79;
	padding:6px;
	margin:20px 0 20px 0;
}


#creation{
	width:476px;
	height:120px;
	margin: 0 0 5px 367px;
	border:1px solid #aaaaaa;
}

.crea{
	width:476px;
	margin: 0 0 5px 0px;
	border:1px solid #aaaaaa;
	padding:4px;
}



#myname{
	background:url(../img/name.jpg) no-repeat;
	width:70px;
	height:640px;
	float:right;
	margin-right: 10px;
}

.spacer{
	clear:both;
}

#skill{
	float:left;
	width:213px;
	margin:30px 0 0 60px;
	border:1px dotted #267dd0;
	padding:2px;
}
#skill h2{
	width:100px;
}

#competence{
	padding:18px;
	margin-left:20px;
}
#adress h2{
	width:173px;
	background:none;
	color:white;
	border-bottom:1px dotted #257ccf;
	text-indent:0;
}

#adress{
	background:url(../img/bg_skill.jpg) repeat-x;
	padding:18px;
	color:#257ccf;	
	height:490px;
}

#adress h3{
	color:#257ccf;
}


#photo_mathieu{
	float:right;
	width:164px;
	height:84px;
	background:url(../img/photo.jpg) no-repeat;
	font-size:40px;
	font-family:"Times New Roman", Times, serif;
	text-align:right;
	padding:16px 16px 0 0; 
	line-height:30px;
}

#jeu_mario{
	border:1px dotted #267dd0;
	padding:4px;
	margin-bottom:15px;
}

/* TEXTE */


#header p{
	margin-left:440px;
	color:white;;	
}


span.accessibilite{
	display:none;
}

h2{
	color:#bdbdbd;
	font-weight:normal;
	font-size:26px;
	width:480px;
	font-family:"Times New Roman", Times, serif;
	margin:40px 0 30px 0;
	background:url(../img/h2.jpg) top left no-repeat;
	text-indent:36px;
}
h2 span{
	border-bottom:1px dotted #f7a830;
}

h3{
	font-size:16px;
	color:#f7a830;
	margin:10px 0 6px 0;
}

h3:before{
	content:"›› ";
	color:#919494;
}

p{
	width:480px;
	margin:0 0 15px 0; 
	text-align:justify;
}

#footer p {
	text-align:center;
	width:926px;
}

strong{
	color:#f7a830;
	font-weight:normal;
}

address{
	font-style:normal;
}

a{
	color:#f7a830;
}

a.visite{
	color:white;
	font-weight:bold;
	font-size:12px;
	text-decoration:none;
	background:url(../img/lien_site.jpg);
	border:1px dotted #247ccf;
	width:98px;
	height:19px;
	padding:0 2px 0 20px;
	display:block;
	float:right;
	margin-left:20px;
}
a.visite:hover{
	text-decoration:underline;
}


/*** MENU ***/

#menu ul{
	width:903px;
	margin:0 auto;
}

#menu ul li{
	float:left;
	width:150px;
	height:80px;
	list-style-type:none;
}

#menu span.lien_menu {
	display:none;	
}

#menu ul li a{
	display:block;
	width:150px;
	height:80px;
}

#menu a.accueil{
	background:url(../img/accueil.jpg) top no-repeat;
}

#menu a.accueil:hover{
	background:url(../img/accueil.jpg) bottom no-repeat;
}

#menu a.web{
	background:url(../img/web.jpg) top no-repeat;
}

#menu a.web:hover{
	background:url(../img/web.jpg) bottom no-repeat;
}

#menu a.print{
	background:url(../img/print.jpg) top no-repeat;
}

#menu a.print:hover{
	background:url(../img/print.jpg) bottom no-repeat;
}

#menu a.contact{
	background:url(../img/contact.jpg) top no-repeat;
}

#menu a.contact:hover{
	background:url(../img/contact.jpg) bottom no-repeat;
}

#menu a.blog{
	background:url(../img/blog.jpg) top no-repeat;
}

#menu a.blog:hover{
	background:url(../img/blog.jpg) bottom no-repeat;
}

#menu a.game{
	background:url(../img/game.jpg) top no-repeat;
}

#menu a.game:hover{
	background:url(../img/game.jpg) bottom no-repeat;
}

/*** IMAGE ***/
img.float_l{
	float:left;
}
img.float_r{
	float:right;
}

#footer img, .creation img, #skill img, .crea img, #mentions_legales img, #creation img{
	border:0;
}

/*** CONTACT ***/

#civilite{
	background:url(../img/radio.jpg) no-repeat;
	height:37px;
	padding:23px 0 0 40px;
}


#civilite label {
	margin-right:40px;
}

#fond_form{
	padding:33px 0 0 40px;
	height:400px;
	background:url(../img/form.jpg) no-repeat;
}

div#mini_contact{
	width:150px;
	height:20px;
	background:url(../img/mini_contact.jpg) no-repeat;
	margin-top:144px;
	margin-left:700px;
	position:absolute;
}
div#mini_contact a {
	color:white;
	margin-left:45px;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	text-decoration:none;
}
div#mini_contact a:hover {
	text-decoration:underline;
}

input[type=text], textarea{
	width:260px;
	border:1px solid #f7a830;
	margin:5px 0 8px 0;
	padding:4px 0 2px 5px;
	background:url(../img/bg_input.gif) top left no-repeat #fff;		
}

input[type=text]:hover, input[type=text]:focus, textarea:hover, textarea:focus{
	background:none;
	background-color:#fff5e4;
}

input[type="submit"], input[type="reset"] {
	width:60px;
	height:60px;
	background:none;
	border:none;
	font-size:0;
}

input[type="submit"]{
	background:url(../img/btn_submit.jpg) top left no-repeat;
}

input[type="reset"] {
	background:url(../img/btn_reset.jpg) top left no-repeat;
}


input[type="submit"]:hover, input[type="submit"]:focus{ 
	background:url(../img/btn_submit.jpg) bottom left no-repeat;
}

input[type="reset"]:hover , input[type="reset"]:focus{
	background:url(../img/btn_reset.jpg) bottom left no-repeat;
}


/*** LISTE DE DEFINITION - COMPETENCE ***/

#skill dl{
	margin:0 0 10px 0; 
}

#skill dt{
	background:url(../img/puce.gif) no-repeat;
	text-indent:10px;
}

#skill dt{
margin-top:10px;
}
#skill dd span{
	display:none;
}
.stars_on{
	width:30px;
	height:30px;
	background:url(../img/skill.jpg) no-repeat top;
	float:left;
}
.stars_on:hover{
	background:url(../img/skill.jpg) no-repeat bottom;
}
.stars_off:hover{
	background:url(../img/skill.jpg) no-repeat top;
}
.stars_off{
	width:30px;
	height:30px;
	background:url(../img/skill.jpg) no-repeat bottom;
	float:left;	
}

#contenu dt{
	font-weight:bold;
}

p#aleatoire{
	font-size:11px;
}

/*** MENTIONS LEGALES ***/
ul#navigateur{
}

ul#navigateur li{
	float:left;
	font-size:11px;
	text-align:right;
	margin-left:10px;
	list-style-type:none;
}

ul#navigateur li a{
	color:#848484;
	width:80px;
	height:15px;
	display:block;
	text-decoration:none;
}

a#firefox{
	border:1px solid #ef6e03;
	background:url(../img/navigateur/firefox.jpg);
	
}
a#opera{
	border:1px solid #c42926;
	background:url(../img/navigateur/opera.jpg);
	
}
a#ie6{
	border:1px solid #0499f3;
	background:url(../img/navigateur/explorer6.jpg);
	
}
a#ie7{
	border:1px solid #1f69c9;
	background:url(../img/navigateur/explorer7.jpg);
	
}
a#safari{
	border:1px solid #a6a6a6;
	background:url(../img/navigateur/safari.jpg);
	
}

div#mentions_legales{
	width:504px;
	margin:0 auto;
	padding: 0 60px;
	background:url(../img/conteneur_mentions.png) repeat-y;
}

/*** MOOTOOLS ***/


p.box {
	width:464px;
	background: #f8f8f8;
	border: 1px solid #d6d6d6;
	border-left:2px solid #e4e4e4;
	border-top:2px solid #e4e4e4;
	padding: 10px;
	margin-top: 10px;
}
div.separateur {
	clear:both;
	height:50px;
	border-bottom:1px solid #DFDDD5;
	margin-bottom:20px;
}
