@charset "UTF-8";
/*=============================================================
			Ecriture mouvements de la tête
=============================================================*/
/* procedure, video */
aside 
{
	position: absolute;
	top: 60px;
	left: 0px;
	height: 171px;
	width: 428px;
	padding: 0px 0px 0px 20px;
}
aside, #instructions ul
{
	text-align: left;
}
aside h2
{
	font-size: 1.1em;
}
#video
{
	position: absolute;
	top: 62px;
	left: 375px;
	height: 180px;
	width: 160px;
} 
#instructions
{
	position: absolute;
	top: 48px;
	left: 522px;
	height: 171px;
	width: 381px;
}
/* figures */
.drag-highlight
{ 
	background-color:white;/* #E0ECF8; #fffbee; couleur jaune pâle */
}
#kf1 /* draggable */
{
	position: absolute;
	top: 60px;
	left: 746px;
	height: 21px;
	width: 74px;
	text-align: center;
	cursor: move;
	z-index:2;
}
#kf2 /* draggable */
{
	position: absolute; top: 183px; left: 624px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf3 /* draggable */
{
	position: absolute; top: 184px; left: 758px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf4 /* draggable */
{
	position: absolute; top: 105px; left: 608px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf5 /* draggable */
{
	position: absolute; top: 121px; left: 807px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf6 /* draggable */
{
	position: absolute; top: 130px; left: 699px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf7 /* draggable */
{
	position: absolute; top: 69px; left: 536px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf8 /* draggable */
{
	position: absolute; top: 143px; left: 553px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf9 /* draggable */
{
	position: absolute; top: 48px; left: 648px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
/*ecriture 2 */
#kf10 /* draggable */
{
	position: absolute; top: 89px; left: 820px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf11 /* draggable */
{
	position: absolute; top: 93px;left: 456px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf12 /* draggable */
{
	position: absolute;
	top: 40px;
	left: 213px;
	height: 21px;
	width: 74px;
	text-align: center;
	cursor: move;
	z-index: 2;
}
#kf13 /* draggable */
{
	position: absolute; top: 63px; left: 387px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf14 /* draggable */
{
	position: absolute; top: 24px; left: 786px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}
#kf15 /* draggable */
{
	position: absolute; top: 40px; left: 55px; height: 21px; width: 74px; text-align: center; cursor: move; z-index:2;
}

/*=============================================================
			Ecriture_1
=============================================================*/
/* Ligne du temps */
#temps
{
	position: absolute;
	top: 254px;
	left: 0px;
	width: 100%;
	height: 33px;
	visibility: visible;
}
/* boutons temps : idem composition */
.bouton_temps
{
	margin-left: 5px;
	color: #165076;/* Vanessa-benesh.css */
	font-size: 0.9em;
	border-width:thin;
	background-color:white;
	cursor:pointer;
}
.depart
{
	position: absolute;
	top: 0px;
	left: 128px;
}
.un
{
	position: absolute;
	top: 0px;
	left: 222px;
}
.deux
{
	position: absolute;
	top: 0px;
	left: 300px;
}
.trois
{
	position: absolute;
	top: 0px;
	left: 370px;
}
.quatre
{
	position: absolute;
	top: 0px;
	left: 443px;
}
.cinq
{
	position: absolute;
	top: 0px;
	left: 517px;
}
.six
{
	position: absolute;
	top: 0px;
	left: 587px;
}
.sept
{
	position: absolute;
	top: 0px;
	left: 667px;
}
.huit
{
	position: absolute;
	top: 0px;
	left: 741px;
}
.neuf
{
	position: absolute;
	top: 0px;
	left: 815px;
}

/* Animation partition*/
article
{
	position: absolute;
	top: 299px;
	left: 1px;
	height: 137px;
	width: 100%;
	text-align: center;
}

#portee 
{
	position: absolute;
	top: 0px;
	left: 95px;
	visibility: visible;
	z-index:3;
}

/* cadres drop */ 
#un, #deux, #trois, #quatre, #cinq, #six, #sept, #huit, #neuf
{
	width: 74px;
	height: 21px;
	background-color: #E0ECF8; /*border: 2px dashed #165076;Vanessa-benesh.css */
	visibility: hidden;
}
/* cadres pour img signes */ 
#kfs1, #kfs2, #kfs3, #kfs4, #kfs5, #kfs6, #kfs7, #kfs8, #kfs9
{
	width: 75px;
	height: 50px;
	visibility: hidden;
	background-color:white;
	z-index:3;
}
#kfs0 /* cadre départ  pour img signes */ 
{
	position: absolute;
	top: 1px;
	left: 90px;
}
#un /* cadre temps 1 drop */ 
{
	position: absolute;
	top: 21px;
	left:198px;
}
#kfs1 /* cadre temps 1 pour img signes */ 
{
	position: absolute;
	top: 9px;
	left:198px;
}
#deux /* cadre temps 2  drop */ 
{
	position: absolute;
	top: 21px;
	left: 273px;
}
#kfs2 /* cadre  temps 2 pour img signes */ 
{
	position: absolute;
	top: 9px;
	left: 273px;
}
#trois /* cadre temps 3  drop */ 
{
	position: absolute;
	top: 21px;
	left: 349px;
}
#kfs3 /* cadre temps 3  pour img signes */ 
{
	position: absolute;
	top: 9px;
	left: 349px;
}
#quatre /* cadre temps 4  drop */ 
{
	position: absolute;
	top: 20px;
	left: 425px;
}
#kfs4 /* cadre temps 3  pour img signes */ 
{
	position: absolute;
	top: 9px;
	left: 425px;
}
#cinq /* cadre temps 4  drop */ 
{
	position: absolute;
	top: 21px;
	left: 493px;
}
#kfs5 /* cadre temps 5  pour img signes */ 
{
	position: absolute;
	top: 9px;
	left: 493px;
}
#six /* cadre temps 6  drop */ 
{
	position: absolute;
	top: 21px;
	left: 569px;
}
#kfs6 /* cadre temps 6  pour img signes */ 
{
	position: absolute;
	top: 9px;
	left: 569px;
}
#sept /* cadre temps 7  drop */ 
{
	position: absolute;
	top: 21px;
	left: 644px;
}
#kfs7 /* cadre temps 7  pour img signes */ 
{
	position: absolute;
	top: 9px;
	left: 644px;
}
#huit /* cadre temps 8  drop */ 
{
	position: absolute;
	top: 21px;
	left: 719px;
}
#kfs8 /* cadre temps 8  pour img signes */ 
{
	position: absolute;
	top: 9px;
	left: 719px;
}
#neuf /* cadre temps 9  drop */ 
{
	position: absolute;
	top: 21px;
	left: 794px;
}
#kfs9 /* cadre temps 9  pour img signes */ 
{
	position: absolute;
	top: 9px;
	left: 794px;
}
/*=============================================================
			Ecriture_2 (idem ajusté Membres-lecture
=============================================================*/
/* Animation temps */
#temps2
{
	position: absolute;
	top: 254px;
	left: 0px;
	width: 100%;
	height: 33px;
	visibility: visible;
}
.bouton_temps
{
	margin-left: 5px;
	color: #165076;/* Vanessa-benesh.css */
	border-width:thin;
	background-color:white;
	cursor:pointer;
}
.dix
{
	position: absolute;
	top: 1px;
	left: 127px;
}
.onze
{
	position: absolute;
	top: 0px;
	left: 267px;
}
.douze
{
	position: absolute;
	top: -1px;
	left: 395px;
}
.treize
{
	position: absolute;
	top: 0px;
	left: 522px;
}
.quatorze
{
	position: absolute;
	top: 0px;
	left: 660px;
}
.quinze
{
	position: absolute;
	top: 0px;
	left: 777px;
}
/* Animation partition idem ecriture_1*/
/* cadres drop - autre noms - contenu idem ecriture_1 */ 
#dix, #onze, #douze, #treize, #quatorze, #quinze
{
	width: 74px;
	height: 21px;
	background-color: #E0ECF8; /*border: 2px dashed #165076;Vanessa-benesh.css */
	visibility: hidden;
	z-index:1;
}
/* cadres drop placement specifique ecriture2 */ 
#dix /* cadres depart drop */ 
{
	position: absolute;
	top: 22px;
	left: 123px;
}
#onze /* cadre temps 1 drop */ 
{
	position: absolute;
	top: 22px;
	left: 245px;
}
#douze /* cadre temps 2  drop */ 
{
	position: absolute;
	top: 22px;
	left: 374px;
}
#treize /* cadre temps 3  drop */ 
{
	position: absolute;
	top: 22px;
	left: 505px;
}
#quatorze /* cadre temps 4  drop */ 
{
	position: absolute;
	top: 22px;
	left: 645px;
}
#quinze /* cadre temps 5  drop */ 
{
	position: absolute;
	top: 22px;
	left: 761px;
}