/* Feuille de style (sauf IE6 et inferieurs) pour le site présentant le portfolio de Jules Leclerc, designer d'interaction - Tous droits réservés à ce dernier */

html, body{
margin:0 0 0 0;
padding: 0 0 0 5px;
text-align:left;
}

    .clearfloat { /* cette classe doit être placée pour un élément div ou break et doit être l'élément final avant la balise de fin d'un conteneur qui doit contenir entièrement un élément flottant */
    	clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    }
	
		#footer {
	height: 50px;
	text-align: left;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
	position: absolute;
	top: 486px;
    }
	
		* html	#footer {
	height: 50px;
	text-align: left;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
	position: absolute;
	top: 490px;
    }


/*haut de page/////////////////////////////////////////////////////////////////////*/

#barrehaut{
	height:18px;
	width:828px;
	margin-top:5px;
	float: left;
}

#item{
	font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#504c46;
	font-weight:bold;
	width:140px;
	float:left;
	margin-left: 0px;
	text-align: right;
}
#item2{
	font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#504c46;
	font-weight:bold;
	width:126px;
	text-align:right;
	position: absolute;
	left: 148px;
	top: 145px;
	background-image: url(img/fond-tiret.gif);
	background-repeat: repeat-x;
	background-position: center 20px;
	height: 22px;
	padding-right: 8px;
}

#haut-droite{
	float:right;
	font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#504c46;
	margin: 0;
	padding: 0;
}
.haut-droite{
font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
font-size:10px;
color:#504c46;
}
a.haut-droite{
font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
font-size:10px;
color:#504c46;
background-color:#d6d5d6;
text-decoration:none;
}
/*////////////////////////////////////////////////////////////////////*/

#tirethoriz{
	background-image: url(img/fond-tiret.gif);
	background-position: center;
	background-repeat:repeat-x;
	width:100%;
	height: 5px;
	float: left;
}
/*bas de page/////////////////////////////////////////////////////////////////////*/


#barrebas{
	width:811px;
	height: 50px;
	margin: 3px 0 3px 20px;
	margin-left: 20px;

}
.infos{
	font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
	color:#3d6c8a;
	font-size:11px;
	line-height: 20px;
}
a.infos{
font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
color:#3d6c8a;
font-size:11px;
text-decoration:none;
}
a.infos:hover{
	font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
	color:#ffffff;
	font-size:11px;
	text-decoration:none;
	background-color:#45708c;
	line-height: 20px;
	font-style: italic;
}
#bas-droite{
	background-image: url(img/couleurs.gif);
	background-repeat: no-repeat;
	background-position: right 0px;
	width: 80px;
	height: 10px;
	text-align: right;
	position: absolute;
	left: 750px;
	top: 548px;
}
#bas-gauche{
	width:600px;
	margin-left: 20px;
	margin-top: 15px;
}
* html #bas-gauche{
	width:450px;
	margin-left: 20px;
	margin-top: 5px;
}
/*Page-conteneur/////////////////////////////////////////////////////////////////////*/
div#pagecontenu{
	width: 828px;
	margin-top: 5px;
	height: 460px;
	}

div#droite{
	float: left;
	width: 550px;
	margin: 0;
}

/*blocs contenu/////////////////////////////////////////////////////////////////////*/
#blocimage{
	width:550px;
	height: 355px;
	margin:0;
	background-image:url(img/fond-blocimage.gif);
	background-repeat:no-repeat;
}

#blocabout{
	width:550px;
	height: 500px;
	margin:0;
	float: right;
	margin-top: 20px;
	
	}

/*ARTILCLE selectionné/////////////////////////////////////////////////////////////////////*/

#article{
	width: 550px;
	padding-top: 0px;
	margin: 0;
}

#fondtitrearticle{
	float: right;
	width: 550px;
	background-color:#000033;
	text-align:right;
}

#txtarticle{
	font-size:11px;
	color:#504c46;
	font-family: "Trebuchet MS", Tahoma, Geneva, Arial, Helvetica, sans-serif;
	text-align:justify;
	height: 80px;
	overflow: hidden;

}

.post-content{
	padding-top:0px;
	font-style:normal;
	font-size:11px;
	color:#504c46;
	font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
	text-align:justify;

}
a.post-content{
	padding-top:0px;
	font-style:normal;
	font-size:11px;
	color:#3d6c8a;
	font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
	text-align:justify;
	text-decoration:none;
	letter-spacing: 0pt;
}
a.post-content:hover{
	font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
	color:#ffffff;
	font-size:11px;
	text-decoration:none;
	font-style: italic;
	background-color:#3d6c8a;
}
.ambiant{
	padding-top:0px;
	font-style:normal;
	font-size:11px;
	color:#45708c;
	font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
	text-align:justify;
	font-weight:bold;

}
.post-title {
	font-size: 14px;
	font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
	text-align:right;
	font-weight:bold;
	padding-right:8px;
	margin-bottom:8px;
	margin-top:4px;
	color: #504c46;
	font-style: italic;
	letter-spacing: -0.5pt;

}

	.sIFR-active .post-title
			{
				visibility: hidden;
				font-family: Verdana;
				line-height: 1em;
			}

.post-info{
font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
font-size:11px;
margin-top:2px;
padding-bottom:5px;
background-color:#F8F8F8;
}
/* FONDS hover pour les titres des projets au dessus du txt>
*/
/*inteaction design*/
#cat-titre1{
	margin-bottom:2px;
	background-color: #CCE2F0;
	border-bottom: 1px;
	border-bottom-color: #666666;
	border-bottom-style: solid;
	height: 17px;
	margin-top: 0px;

}
/*web*/
#cat-titre2{
	margin-bottom:2px;
	background-color: #FFF9C5;
	border-bottom: 1px;
	border-bottom-color: #666666;
	border-bottom-style: solid;
	height: 17px;

}
/*illus print*/
#cat-titre3{
	margin-bottom:2px;
	background-color: #E2DFCF;
	border-bottom: 1px;
	border-bottom-color: #666666;
	border-bottom-style: solid;
	height: 17px;

}
/*video*/
#cat-titre5{
	margin-bottom:2px;
	background-color: #FCD4E1;
	border-bottom: 1px;
	border-bottom-color: #666666;
	border-bottom-style: solid;
	height: 17px;

/*photo*/
}
#cat-titre6{
	margin-bottom:2px;
	background-color: #DBDBDB;
	border-bottom: 1px;
	border-bottom-color: #666666;
	border-bottom-style: solid;
	height: 17px;

}
/*contest*/
#cat-titre7{
	margin-bottom:2px;
	background-color: #D1FFE5;
	border-bottom: 1px;
	border-bottom-color: #666666;
	border-bottom-style: solid;
	height: 17px;

}


/*LISTE DES CATEGORIES+projets/////////////////////////////////////////////////////////////////////*/



div#listecat{
	float: left;
	width: 140px;
	padding:0px;
	padding-top:0px;
	margin: 0;
	text-align: right;
}

#divcatmenu {
	margin-bottom:5px;
}
#divcatmenu:hover {
	margin-bottom:5px;
}

	
/*LISTE DES TITRES ARTILCLES/////////////////////////////////////////////////////////////////////*/
.sIFR-active .listeprojets
			{
				visibility: hidden;
				font-family: Verdana;
				line-height: 1em;
			}

.listeprojets{
	font-size:14px;
	color: #504c46;
}
a.listeprojets{
	font-size:14px;
	color: #504c46;
}
a.listeprojets:hover{
	font-size:14px;
	color: #504c46;
	background-color:#000000;
}

#fondprojets{
margin-bottom:2px;
}

#fondprojets:hover{
background-color: #45708c;
border-bottom:2px;
border-bottom-color:#959595;
border-bottom-style:solid;
margin-bottom:0px;
}




.ouvert{
display:block;

}

#titreart{
list-style:none;
font-family: Trebuchet MS, Tahoma, Geneva, Arial, Helvetica, sans-serif;
text-align:right;
font-size: 13px;
font-weight:bold;
padding-right:8px;
margin:0;
}

/*********** .rubriques ***********/
#listearticles{
	float: left;
	width: 135px;
	margin: 140px 0 0 0;
	text-align: right;
	font-size: 9pt;
	font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
	color: #504c46;
	font-weight: normal;
	font-style: normal;
	text-decoration:none;
	line-height: 11pt;
	}

#listearticles ul{
	background-color:#fff;
	list-style:none;
	padding:0;
	margin:0;
	color: #504c46;

	}
#listearticles li{
padding-right:5px;
color: #504c46;


}
#listearticles li a{
	display:block;
	text-decoration:none;
	margin-bottom:6px;
	padding-right:5px;
	color: #504c46;


}

#listearticles a:hover{
	text-decoration:none;
	border-bottom: 1px;
	border-bottom-color: #504c46;
	border-bottom-style: solid;
	margin-bottom:5px;
	padding-right:5px;
	color: #504c46;


		}
		
/*********** .rubriques ***********/
#rubrique{
	float: left;
	width: 140px;
	padding:0px;
	padding-top:0px;
	text-align: right;
	font-size: 11pt;
	font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
	color: #504c46;
	font-weight: bold;
	font-style: italic;
	letter-spacing: -0.5pt;
	text-decoration:none;
	line-height:11pt;
	}

#rubrique ul{
	background-color:#fff;
	list-style:none;
	padding:0;
	margin:0;
	line-height:11pt;
	}
#rubrique li{
	padding-right:5px;
	line-height: 11pt;

}
#rubrique li a{
	width:135px;
	display:block;
	text-decoration:none;
	margin-bottom:6px;
	padding-right:5px;
	color:#504c46;
	line-height: 11pt;
}
/*pour ie*/
* html #rubrique a:hover{
	text-decoration:none;
	border-bottom: 1px;
	border-bottom-color: #504c46;
	border-bottom-style: solid;
	margin-bottom:5px;
	padding-right:5px;
	color:#504c46;
	line-height: 15pt;
}
/*pour ie7*/
*+html #rubrique a:hover{
	text-decoration:none;
	border-bottom: 1px;
	border-bottom-color: #504c46;
	border-bottom-style: solid;
	margin-bottom:5px;
	padding-right:5px;
	color:#504c46;
	line-height: 15pt;
		}
		
#rubrique a:hover{
	text-decoration:none;
	border-bottom: 1px;
	border-bottom-color: #504c46;
	border-bottom-style: solid;
	margin-bottom:5px;
	padding-right:5px;
	color:#504c46;
	line-height: 11pt;

		}

/* VERSION AVEC COULEURS DOUCES : */

/*interaction*/
.cat1 a:hover{
		background-color: #CCE2F0;
}
/*web*/
.cat2 a:hover{
		background-color: #FFF9C5;

}
/*print*/
.cat3 a:hover{
		background-color:  #E2DFCF;
}
/*contests*/
.cat7 a:hover{
		background-color: #D1FFE5;
}
/*video*/
.cat5 a:hover{
		background-color:#FCD4E1;
}
/*photo*/
.cat6 a:hover{
		background-color: #DBDBDB;
		}