body{
	background-image:url(images/canvas_bg.jpg);
}

/*image "portfolio porteur de folie*/
#portfolio {
	z-index: 10;
	height: 60px;
	width: 200px;
	right: -50px;
	bottom: 0px;
	position: fixed;
	background-image: url(images/portfolio-porteur-de-folie.png);
}

/*post-it*/
#postit{
	z-index: 1;
	height: 210px;
	width: 240px;
	top: 90px;
	right: 20px;
	float: left;
	position: absolute;
}

#lien{
	position: absolute;
	width: 236px;
	height: 46px;
	top: 0px;
}
#maryam{
	width:97px;
	height:38px;
	position: absolute;
	top: 46px;
	left: 0px;
}
#noemie{
	position: absolute;
	width:97px;
	height:24px;
	top: 84px;
	left: 0px;
}
#simon{
	position: absolute;
	width:97px;
	height: 30px;
	top: 108px;
	left: 0px;
}
#fluff{
	width:69px;
	height:24px;
	position: absolute;
	top: 46px;
	left: 97px;	
}
#soz{
	width:70px;
	height:24px;
	position: absolute;
	top: 46px;
	left: 166px;	
}
#symon{
	position: absolute;
	width:69px;
	height: 26px;
	top: 70px;
	left:97px;
}
#cecile{
	position: absolute;
	width:70px;
	height:26px;
	top: 70px;
	left: 166px;
}
#pathos{
	position: absolute;
	width:139px;
	height:22px;
	top: 96px;
	left: 97px;
}
#missclara{
	position: absolute;
	width:139px;
	height: 20px;
	top:118px;
	left: 97px;
}
#plume{
	position: absolute;
	width:138px;
	height: 30px;
	top: 138px;
	left: 0px;
}
#sharne{
	position: absolute;
	width:138px;
	height: 36px;
	top: 168px;
	left: 0px;
}
#moemai{
	position: absolute;
	width:98px;
	height: 30px;
	top: 138px;
	left: 138px;
}
#bou{
	position: absolute;
	width:98px;
	height: 36px;
	top: 168px;
	left: 138px;
}


/*conteneur site*/
#conteneur {
	position:relative;
	height: 610px;
	width: 800px;
	z-index:2;
	margin-left:auto;
	margin-right:auto;
	background-image:url(images/page-type.png);
	background-repeat: no-repeat;
}

/*page contact*/
#contact {
	position: absolute;
	height: 60px;
	width: 121px;
	left: 641px;
	top: 47px;
	z-index: 5;
}
#contact2 {
	position: absolute;
	height: 60px;
	width: 121px;
	left: 641px;
	top: 47px;
	z-index: 5;
}
#moi{
	position: absolute;
	top: 100px;
	left: 192px;
}
#cv{
	position: absolute;
	width:130px;
	height:129px;
	top: 70px;
	left: 585px;
	font-size: 14px;
	z-index: 4;
	padding-top: 25px;
	color:#A50707;

}
#form{
	position: absolute;
	color: #A50707;
	top: 355px;
	left: 200px;
	width: 559px;
	z-index: 7;
	font-size:12px;
	font-weight: bold;
}
#message{
	position:absolute;
	top: 5px;
	left: 230px;
}

/*pour le texte*/
#text, #textcontact, #textindex {
	position: absolute;
	z-index: 4;
	color:#A50707;
}
#textcontact {
	font-size: 11px;
	height: 231px;
	width: 300px;
	left: 400px;
	top: 80px;
}
.Style2 {
color: #FFFBDE
}
#textindex {
	height: 231px;
	width: 450px;
	left: 250px;
	top: 150px;
	font-size: 14px;
}	


/*Menu*/

#menu{
	height: 39px;
	width: 530px;
	position: absolute;
	top: 47px;
	left: 100px;
	z-index: 4;
}

ul, li {	/* utilisation de liste pour le menu */
list-style-type: none;	/* suppression des puces de liste */
margin:0;
padding:0;
}
ul {
position: absolute;	/* positionnement pour IE5 et IE5.5 */
top: 0;
left: 90px;
background: transparent url(images/all.png) top left no-repeat;	/* arrière-plan général du menu */
width: 530px;
}
li {float: left;}

li a {	/* dimensions et définitions des boutons */
display: block;	/* mise en block de <a> pour lui donner des dimensions */
height: 39px;
width: 115px;
text-decoration: none;
}
li a:hover {
background: transparent url(images/all.png) top left no-repeat;
}
a#accueil:hover {
background-position: -450px 0%;	/* décalage de l'arrière-plan pour chaque bouton */
}
a#graph:hover {
background-position: -570px 0%;
}
a#photo:hover {
background-position: -710px 0%;
}
a#video:hover {
background-position: -845px 0%;
}

/*BOX*/

img{border:none;}

#cont-box{
	position: relative;
	top: 100px;
	left: 200px;
}

/*_web.css*/

.buttons{
	margin-top:0px;
}
.buttons span{
	color:#A50707;
	padding:0 5px;
	cursor:pointer;
	font:10px Verdana
}
.buttons span.active, .buttons span:hover{
	background:#A50707;
	color:#FFFBDE
}

/* Box */
#box, #box-v, #box-i, #box-g{
	position:absolute;
	color: #A50707;
	top: 0px;
}
#box div, #box-v div, #box-i div, #box-g div{
	width:480px;
	height:500px;
	float:left;
}

#box h3, #box-v h3, #box-i h3, #box-g h3, #box p, #box-v p, #box-i p, #box-g p, #box ul, #box-v ul, #box-i ul, #box-g ul{
	padding:0px 10px;
	list-style-type: none;
	margin: 0px;
	margin-bottom:5px;
}
#box-v h3{
	font-size: 15px;
}

/*tailles des bouttons*/
#box p, #box-v p, #box-i p, #box-g p{
	text-indent:16px;
}

/*place et taille des images*/
#box img, #box-v img, #box-i img, #box-g img{
	float:left;
	margin:5px;
}

#box-v img{
	width: 200px;
	height: auto;
}
#box-i img{
	width: 35px;
	height: 35px;
}
#box-g img{
	width: auto;
	height: auto;
}	

	
/*texte dans la div*/
#box-v{
	font-size: 12px;
}

/*masque de la box*/
.mask{
	position:relative;
	width:480px;
	height:500px;
	overflow:hidden;
}
/*pour les images mais est-ce nécessaire ici? à voir*/
span img{
	display:block;
	border:none;
}

