/****************************************************************
* CSS Kazar Creation
* Design by : Jean Marois
* CSS created by : Steve Perron
* December 14th, 2006
* www.kazarcreation.com
*****************************************************************/
* {
	margin:0;
	padding:0;
}

body {
	background:#666667;
}

h1 {
	font:14px Arial, Helvetica, sans-serif;
	color:#000;
	display:none;
}

h2 {
	font:12pt Georgia, "Times New Roman", Times, serif;
	color:#000;
	display:none;
}

h3 {
	font:12px Arial, Helvetica, sans-serif;
	color:#F37B2D;
	font-weight:bold;
}

p {
	font:10px Arial, Helvetica, sans-serif;
	color:#DCD9D9;
	width:150px;
	margin-top:10px;
}

#wrapper {
	position:relative;
	width:800px;
	height:600px;
	background:#666667 url(../images/kazar-creation-visuel-new.gif) no-repeat top left;
	margin:0 auto;
	padding-top:240px;
	margin-top:35px;
	
}

#menu {
	width:275px;
	height:34px;
	background:url(../images/menu.gif) repeat-x top left;
	margin-left:254px;
	padding-left:2px;
}

#menu li {
	list-style:none;
	float:left;
	width:88px;
	height:30px;
	margin:2px 0 2px 2px;
	background:url(../images/item-menu.gif) repeat-x top left;
	position:relative;
}

#menu li #design, #menu li #integration, #menu li #graphisme {
	position:absolute;	
	background:url(../images/note.gif) no-repeat top left;
	height:199px;
	width:198px;
	display:none;
	padding:20px 20px;
}

#menu li #design {	
	top:-70px;
	left:-208px;
}

#menu li #integration {	
	top:38px;
	left:-50px;
}

#menu li #graphisme {	
	top:-70px;
	left:98px;
}

#menu li #design li, #menu li #integration li, #menu li #graphisme li {
	background:none;
}

#menu li a {
	display:block;
	width:88px;
	height:30px;
	background:url(../images/item-menu.gif) repeat-x top left;
	font:12px Arial, Helvetica, sans-serif;
	color:#fff;
	text-decoration:none;
	text-align:center;
	line-height:2.5;	
}

#menu li:hover #design, #menu li:hover #integration, #menu li:hover #graphisme, 
#menu li.over #design, #menu li.over #integration, #menu li.over #graphisme {
	display:block;
}

#wrapper .vcard {
	/*position:absolute;
	top:415px;
	left:260px;*/
	width:264px;
	margin-left:254px;
	text-align:center;
	font:11px Arial, Helvetica, sans-serif;
	color:#CE6523;
	font-weight:bold;
}

#wrapper .vcard .org, #wrapper .vcard .adr {
	display:none;
} 

#wrapper .vcard .tel, #wrapper .vcard .email {
	color:#868687;
	text-decoration:none;
	font-weight:normal;
	margin-left:10px;
	line-height:1.8;
	font-family:Geneva, Arial, Helvetica, sans-serif;
}

#wrapper .vcard .email:hover {
	color:#494949;
	text-decoration:underline;
}

.note {
	margin-left:251px;
	padding:0px 20px 0 20px;
	width:279px;
	padding-bottom:10px;
}

.note p {
	font:11px Arial, Helvetica, sans-serif;
	width:249px;
	color:#494949;
}

.note p.contact {
	font-weight:bold;
	color:#C15D22;
}

.note ul {
	margin-left:10px;
	padding-top:8px;
	list-style:none;
}

.note ul li {
	font:11px Arial, Helvetica, sans-serif;
	padding-bottom:10px;
	background:url(../images/bullet.gif) no-repeat 0 5px;
	padding-left:15px;
}

.note ul li a:link, .note ul li a:visited, .note ul li a:hover, .note ul li a:active {
	color:#494949;
	text-decoration:none;
	font-weight:bold;
}

.note ul li a:hover {
	text-decoration:underline;
	color:#C15D22;
}