html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin:0; padding:0; border:0; outline:0;}

@font-face {
	font-family: 'deibi';
	src: url('../fonts/deibi.eot');
	src: local('☺'), url('../fonts/deibi.woff') format('woff'), url('../fonts/deibi.ttf') format('truetype'), url('../fonts/deibi.svg') format('svg');
	font-weight: normal;
	font-style: normal;
	}
@font-face {	
	font-family: 'heroL';
	src: url('../fonts/hero_light.eot');
	src: local('☺'), url('../fonts/hero_light.woff') format('woff'), url('../fonts/hero_light.ttf') format('truetype'), url('../fonts/hero_light.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {	
	font-family: 'hero';
	src: url('../fonts/hero.eot');
	src: local('☺'), url('../fonts/hero.woff') format('woff'), url('../fonts/hero.ttf') format('truetype'), url('../fonts/hero.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

.clear{clear:both;} 

header, nav, footer, section, video {display:block;}
html{height:100%;}
a{outline:none;}
body { height:100%; width:2240px; text-align:center; background-color:#fff; background-attachment: fixed; behavior:url(js/csshover.htc);}

#container{position:absolute; width:2240px; min-height:100%; top:0; left:0; z-index:100;}
#fond{position:fixed; left:200px;width:800px; height:600px; z-index:0;}
h1{font-family: hero, helvetica, arial; font-size: 30px;color:#bbb; line-height:40px;}
h2{font-family: hero, helvetica, arial; font-size: 48px;color:#ff9c00; line-height:40px;}
h3{font-family: hero, helvetica, arial; font-size: 106px;color:#aaa; line-height:66px;}
 
#gauche { position:absolute; top:40px; left:0px; width:10px; height:10px; background-color:transparent; float:left; z-index:200;}
#creation { position:relative; top:40px; left:40px; width:320px; height:500px; font-family:heroL,arial, helvetica, sans-serif; font-size:20px; line-height:28px;color:#aaa; border:1px dotted #bbb; z-index:200; float:left;}
#nom {position:fixed; top:40px; left:410px; width:320px; height:500px; font-family:hero,arial, helvetica, sans-serif; font-size:36px; color:#aaa; line-height:35px;border:1px dotted #bbb; z-index:10;}
#droite { position:absolute; width:10px; height:10px;top:40px; left:740px; background-color:transparent; float:left; z-index:200;}
#graphisme { position:relative; top:40px; left:459px; width:320px; height:500px; font-family:heroL,arial, helvetica, sans-serif; font-size:20px; line-height:28px; color:#aaa; border:1px dotted #bbb; z-index:200; float:left;}
#animation { position:relative; top:40px; left:876px; width:320px; height:500px; font-family:heroL,arial, helvetica, sans-serif; font-size:20px; line-height:28px; color:#aaa; border:1px dotted #bbb; z-index:200; float:left;}

blockquote {background:#ff9c00; color:#fff; font-family:deibi, arial, helvetica; font-size:18px; padding:4px 0 0 0; margin:0px 0; border-bottom:1px dotted #fff; border-top:1px dotted #fff; z-index:10;} 

nav {position:fixed; top:600px; left:40px; width:1064px; height:30px; color:#fff; padding:4px 0 0 0; border-bottom:1px dotted #fff; border-top:1px dotted #fff; background-color:#ff9c00;}
nav ul, li{float:left; margin-left:80px; color:#fff; padding:3px 0 0 0; list-style:none; text-decoration:none;}
nav li a{outline:none; color:#fff; font-family:deibi, arial; font-size:18px;padding:4px 2px 0 2px;text-decoration:none;}
nav li a:hover{outline:none; color:#666; font-family:deibi, arial; background-color:#fff;}