body{
	background-image: url(images/768/background.png);
	background-repeat: no-repeat;
	background-position: center top;
	height: 1184px;
}

header{
	position: fixed;
	display: block;
	width: 768px;
	left: 50%;
	margin-left: -383px;
	height: 168px;
	background-image: url(images/768/header.png);
	background-repeat: no-repeat;
	z-index: 2000;
}
nav{
	position: absolute;
	top: 104px;
	left: 40px;
	width: 700px;
}


article{
	position: relative;
	display: block;
	width: 700px;
	left: 50%;
	margin-left: -350px;
	padding-top: 213px;
	height: 940px;
}

#home{
    position: absolute;
    top: 5px;
    left: 100px;
    width: 580px;
    height: 100px;
}

#menuToggle{
	display: none;
}

nav ul{
	list-style: none;
	display: block;
	width: 700px;
	height: 29px;
	padding: 20px;
}

nav ul li{
	text-indent: -30000px;
	width: 93px;
	float: left;
}

nav ul li a{
	display: block;
}
#mnuPaint{
	width: 93px;
	height: 29px;
	background-image: url(images/768/paint.png);
	background-repeat: no-repeat;
}
#mnuPaint:hover{
	background-image: url(images/768/paint_hover.png), url(images/768/paint.png);
	background-repeat: no-repeat, no-repeat;
}

#mnuDraw{
	width: 93px;
	height: 29px;
	background-image: url(images/768/draw.png);
	background-repeat: no-repeat;
}
#mnuDraw:hover{
	background-image: url(images/768/draw_hover.png), url(images/768/draw.png);
	background-repeat: no-repeat, no-repeat;
}

#mnuSculp{
	width: 93px;
	height: 29px;
	background-image: url(images/768/sculp.png);
	background-repeat: no-repeat;
}
#mnuSculp:hover{
	background-image: url(images/768/sculp_hover.png), url(images/768/sculp.png);
	background-repeat: no-repeat, no-repeat;
}

#mnuInstal{
	width: 93px;
	height: 29px;
	background-image: url(images/768/instal.png);
	background-repeat: no-repeat;
}
#mnuInstal:hover{
	background-image: url(images/768/instal_hover.png), url(images/768/instal.png);
	background-repeat: no-repeat, no-repeat;
}

#mnuPerfo{
	width: 93px;
	height: 29px;
	background-image: url(images/768/perfo.png);
	background-repeat: no-repeat;
}
#mnuPerfo:hover{
	background-image: url(images/768/perfo_hover.png), url(images/768/perfo.png);
	background-repeat: no-repeat, no-repeat;
}

#mnuVideo{
	width: 93px;
	height: 29px;
	background-image: url(images/768/video.png);
	background-repeat: no-repeat;
}
#mnuVideo:hover{
	background-image: url(images/768/video_hover.png), url(images/768/video.png);
	background-repeat: no-repeat, no-repeat;
}

#mnuAbout{
	width: 93px;
	height: 29px;
	background-image: url(images/768/about.png);
	background-repeat: no-repeat;
}
#mnuAbout:hover{
	background-image: url(images/768/about_hover.png), url(images/768/about.png);
	background-repeat: no-repeat, no-repeat;
}

section.home{
	position: relative;
	width: 212px;
	height: 197px;
    display:block;
    float: left;
    margin-bottom: 34px;
}
section.home:nth-of-type(3n+0){
    margin-left: 27px;
}
section.home:nth-of-type(3n+1){
    margin-left: 9px;
}
section.home:nth-of-type(3n+2){
    margin-left: 25px;
}

section.home img{
	position: absolute;
	top: 5px;
	left: 4px;
	width: 204px;
	height: 151px;
}

section.home div{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 212px;
	height: 197px;
	background-image: url(images/768/photo.png);
	background-repeat: no-repeat;
}

section.home h1{
	position: absolute;
	bottom: 16px;
	left: 22px;
	font-size: 24px;
}

section.articleImage{
	position: relative;
	width: 693px;
	height: 480px;
}

section.articleImage div{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 693px;
	height: 480px;
	background-image: url(images/768/article_image.png);
	background-repeat: no-repeat;
}
section.articleImage img{
	position: absolute;
	top: 18px;
	left: 20px;
	width: 652px;
	height: 444px;
}

section.articleText{
	position: relative;
	display: block;
	width: 673px;
	height: 167px;
	background-image: url(images/768/article_text.png);
	background-repeat: no-repeat;
	margin-top: 40px;
    margin-bottom: 40px;
}

section.articleText h1{
	position: relative;
	display: block;
	width: 600px;
	height: 20px;
	padding-top: 20px;
	margin-left: 40px;
	font-size: 24px;
}

section.articleText div{
	position: absolute;
	width: 600px;
	height: 60px;
	top: 50px;
	left: 40px;
	overflow: scroll;
	font-family: Arial;
	font-size: 16px;
	line-height: 24px;
	margin-top: 20px;
}

section.text{
	position: relative;
	display: block;
	width: 682px;
	height: 529px;
	background-image: url(images/768/text.png);
	background-repeat: no-repeat;
	margin-bottom: 40px;
}

section.text h1{
	position: relative;
	display: block;
	width: 540px;
	height: 20px;
	padding-top: 60px;
	margin-left: 60px;
	font-size: 24px;
}

section.text div{
	position: relative;
	width: 550px;
	height: 360px;
	margin-top: 20px;
	margin-left: 60px;
	overflow: scroll;
	font-family: Arial;
	font-size: 16px;
	line-height: 24px;
}

footer{
	position: relative;
	clear: both;
	left: 10px;
	width: 700px;
	height: 69px;
	background-image: url(images/768/footer.png);
	background-repeat: no-repeat;
}

footer:hover{
	background-image: url(images/768/footer_hover.png);
}

#icon{
    position: absolute;
    left: 28px;
    top: 57px;
    width: 60px;
    height: 65px;
    
}

section.articleImage video{
	position: absolute;
	top: 30px;
	left: 15px;
	width: 650px;
	height: 430px;
    background-color: white;
}

section.videoControls{
	position: relative;
	display: block;
	width: 667px;
	height: 85px;
	background-image: url(images/768/video_controls.png);
	background-repeat: no-repeat;
	margin-top: -10px;
	margin-left: 5px;
	margin-bottom: 160px;
}

.playPause{
    position: absolute;
    background-image: url(images/768/video_pause.png);
    background-repeat: no-repeat;
    width: 29px;
    height: 19px;
    top: 32px;
    left: 29px;
}

.playPause.paused{
    background-image: url(images/768/video_play.png);
}

.progress{
    position: absolute;
    background-image: url(images/768/video_timeline.png);
    background-position: left 3px;
    background-repeat: no-repeat;
    width: 344px;
    height: 11px;
    top: 34px;
    left: 65px;
}

.progressItem{
    position: relative;
    background-image: url(images/768/video_progress.png);
    background-position: left top;
    background-repeat: no-repeat;
    width: 5px;
    height: 15px;
    top: 2px;
    left: 0;
}

.time{
    position: absolute;
    width: 60px;
    height: 18px;
    top: 34px;
    left: 420px;
    font-size: 12px;
}

.currentTime{
    position: absolute;
    width: 25px;
    height: 14px;
    top: 0px;
    left: 0px;
}

.totalTime{
    position: absolute;
    width: 25px;
    height: 14px;
    top: 0px;
    right: 0px;
}

.volumeIcon{
    position: absolute;
    background-image: url(images/768/video_volume_loudspeaker.png);
    background-position: left top;
    background-repeat: no-repeat;
    width: 12px;
    height: 12px;
    top: 35px;
    left: 496px;
}

.volume{
    position: absolute;
    background-image: url(images/768/video_volume_line.png);
    background-position: left 3px;
    background-repeat: no-repeat;
    width: 57px;
    height: 12px;
    top: 35px;
    left: 512px;
}

.volumeValue{
    position: absolute;
    background-image: url(images/768/video_volume.png);
    background-position: left top;
    background-repeat: no-repeat;
    width: 8px;
    height: 12px;
    top: 0px;
    left: 0px;
}

.fullscreen{
    position: absolute;
    background-image: url(images/768/video_fullscreen.png);
    background-position: left top;
    background-repeat: no-repeat;
    width: 48px;
    height: 31px;
    top: 25px;
    left: 588px;
}