﻿@charset "utf-8";
@font-face {
font-family: DINBold;
/*src:url("../fonts/DIN-Bold.otf");*/
src:url("../fonts/DIN-Regular.otf");
}

@font-face {
font-family: "DIN Next Pro Regular";
/*src:url("../fonts/DINNextLTPro-Regular.otf");*/
src:url("../fonts/DIN-Regular.otf");
}

@font-face {
font-family: "DIN Regular";
src:url("../fonts/DIN-Regular.otf");
}

html {height: 100%;}

h3, p, div {margin: 0; padding: 0; /*font-size:16px;*/}

body {
	/*width: 100%; */width: 1280px;
	/* NEW */ height: 610px;
	background-color: #FFFFFF;
	font-family: Arial;
	margin:0 0;
	/* NEW */ overflow: hidden;
}

/*-----------BANDEAU HAUT--------------*/


#container {
	/*position: relative;*/
	width: 1280px;
	height: 610px;
	/*border-radius: 15px;*/
	/*overflow: hidden;*/
	/*margin-top: 0px;
	margin-bottom: 0;*/
	margin-right: auto;
	margin-left: auto;
	background-color: #FFFFFF;
	/*border: 1px solid #93117e;*/
	
	display: block;
	-webkit-transform-origin : top left;
	-moz-transform-origin : top left;
	-ms-transform-origin : top left;
	-o-transform-origin : top left;
	transform-origin : top left;
}




#logo_hachette {

	position: relative;
	left: 0px;
	top: 0px;
	height: 45px;
	width: 45px;
	float:left;

}

#bandeau_ht {
	position: relative;
	width:1280px;
	height:60px;
	margin: 0px;
	padding: 0px;
	background-color:#93117E;
	display: block;
}



#titre {
	font-family: Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	width:780px;
	position: relative;
	float:left;
	height: 44px;
	font-size:22px;
	vertical-align: middle;
	display: block;
	font-weight: bold;
	padding: 8px;
	padding-left:20px;
}

sup {
	vertical-align: text-top;
}

/*---------------------------------------------*/

/*-----------CENTRE--------------*/
#center {
	position:relative;
	clear:both;
	width:1278px;
	height:563px;
	float:left;
	display:block;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	border: 1px solid #93117e;
}
	
#image_exercice {
    position: absolute;
    left: 0px;
    height: 525px;
    width: 1278px;
    /*background-image: url(../medias/Image_Exercice.jpg);*/
    background-repeat: no-repeat;
    top: 38px;
 }

#image_exercice img {    height: 525px;
    width: 1278px;}

img_contenu_exercice {
	z-index:20;
	}

 
#enonce_exercice {
    position: absolute;
    left: 967px; /*left:450px;*/
    top: 0px;
    height: 447px;
    width: 206px;
    float: left;
    padding-top: 5px;
    padding-right: 2px;
    padding-bottom: 10px;
    padding-left: 3px;

 }

#consigne {
    position: absolute;
    height: 40px;
    width: 980px;
    /*	padding:20px;*/
    color: #000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    line-height: 24px;
    left: 0px;
    padding-top: 5px;
    padding-left: 20px;
}
/*-----------ETIQUETTES ET ZONE DE DEPOTS-------------*/

.cible {
    position: relative;
    /*background-color:transparent;*/
    color: #2e4254;
    /*font-weight: bold;*/
    display: inline-block;
    vertical-align: middle;
    opacity: 1;
    /*z-index:99;*/
    float: left;
    clear: both;
    margin: 0px;
    width: 314px;
    height: 48px;
    border-radius: 19px;
    /*padding-top: 10px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 10px;*/
	/* border: 1px solid black; box-sizing: border-box; */
}
.cible strong {
	float: left;
}


#cible01 {position: absolute; top:  48px; left: 10px;}
#cible02 {position: absolute; top: 198px; left: 10px;}
#cible03 {position: absolute; top: 346px; left: 10px;}
#cible04 {position: absolute; top:  48px; left: 654px;}
#cible05 {position: absolute; top: 198px; left: 654px;}
#cible06 {position: absolute; top: 346px; left: 654px;}
#cible07 {position: absolute; top: 498px; left: 103px;}
#cible08 {position: absolute; top: 498px; left: 568px;}

#cible09 {position: absolute; top: 215px; left: 744px;}
#cible10 {position: absolute; top: 350px; left: 744px;}
#cible11 {position: absolute; top: 433px; left: 744px;}
#cible12 {position: absolute; top: 517px; left: 744px;}
#cible13 {position: absolute; top: 327px; left: 414px;}
#cible14 {position: absolute; top: 250px; left: 0px;}


.cible.active { /*background-color: orange;*/
	/*border-radius:15px;
	border-width:medium;
	border-style:solid;
    background-color:#9ee6fc;*/
}

.etiquette {
	font-family: Arial, Helvetica, sans-serif;
	color:#000;
	/*font-weight:bold;*/
	/*margin-left:120px;*/
	background-color:#f9f6c3;
	text-align:center;
	cursor:move;
	/*z-index:100;*/
	/*background-image: url(../medias/Fd_Etiquettes.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;*/
	font-size: 1.10em;
	width:298px;
	height:auto;
	/*min-height:61px;*/
	display: inline;
	float: left;
	border-radius:11px;
	padding:3px;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-left: 0px;
	line-height: 61px;
}



.etiquette {padding-top:2px; padding-right:1px; line-height: 10.8px; height:51px; font-size: 9px;}
/*@-moz-document url-prefix() {.etiquette {font-size: 9px;}}*/
.LA RÉPUBLIQUE MENACÉE, .                    - Montagnards au pouvoir                    , .                                 NAPOLÉON CONSUL                                 , .RÉFORMES NAPOLÉONIENNES, .TRANSFORMATIONS EN EUROPE {padding-top: 8px; height: 45px;}
/*.etiquette {padding-top:2px; padding-right:1px; line-height:20px; height:39px;}
.réalisent {font-size: 1.00em;}
.interfaces {font-size: 0.90em;}
.Assurer, .Permettre {font-size: 0.70em;}*/

/*.etiquette:hover {background-color:#93117E;color:#fff;}*/

/*.etiquette01 {background-image: url(../medias/Fd_Etiquette01.png);}
.etiquette02 {background-image: url(../medias/Fd_Etiquette02.png);}
.etiquette03 {background-image: url(../medias/Fd_Etiquette03.png);}
.etiquette04 {background-image: url(../medias/Fd_Etiquette04.png);}
.etiquette05 {background-image: url(../medias/Fd_Etiquette05.png);}
.etiquette06 {background-image: url(../medias/Fd_Etiquette06.png);}
.etiquette07 {background-image: url(../medias/Fd_Etiquette07.png);}
.etiquette08 {background-image: url(../medias/Fd_Etiquette08.png);}
.etiquette09 {background-image: url(../medias/Fd_Etiquette09.png);}
.etiquette10 {background-image: url(../medias/Fd_Etiquette10.png);}*/
.txtInvis {visibility: hidden;}
.bgImg {background-image: none; height: 28px; position: relative; top: -5px; /*opacity: 0.5;*/}

.espace { display:block; padding-bottom:50px; }

/*-----------BARRE DU BAS--------------*/

#boutons_bas {
	position:absolute;
	height: 34px;
	width: 340px;
	padding-right:20px;
	padding-left:20px;
	color:#000000;
	font-family: "DIN Regular";
	font-size: 17px;
	line-height: 22px;
	bottom:30px;
	right: 0px;
	text-align: center;
		/*cursor: pointer;*/
		/*z-index:30px;*/
}


#bouton_valider {
	width:115px;
	height:30px;
	float:left;
	display: inline;
	position:absolute;
	right:40px;
	cursor: pointer;

}

#barre_boutons_bas
{
    position: absolute;
	clear: both;
	margin-top:-28px;
	padding-left:810px;
}
#btn_aide {
	height: 30px;
	width: 30px;
	position: absolute;
right:0px;
	margin-right:10px;
	padding-top:8px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}



#btn_aide .opacifier {
	height: 100%;
	width: 100%;
	cursor: pointer;
}

#btn_aide:hover .opacifier {
	/*background: url('medias/bouton-aide-rol.png');*/
}

#btn_solution {
	width:115px;
	height:30px;
	float:left;
	display: inline;
	position:absolute;
	right:40px;
	cursor: pointer;
}

#bouton_recommencer {
	width:115px;
	height:30px;
	float:left;
	display: inline;
	position:absolute;
	right:40px; /*right:200px;*/
	top: 0px;
	cursor: pointer;
}	


.bouton-bas
{
	float:left;
	position:relative;
	cursor: pointer;
}


/*-----------BOUTONS--------------*/

.close
{
    /*background: url('bouton-fermer-aide.png') no-repeat;
    width: 15px;
    height: 15px;
    position: absolute;
    top: 5px;
    right: 5px;
    cursor: pointer;
    display: none;*/
}

.tab
{
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    position: absolute;
    top: 50px;
    right: -30px;
    font-size: 12px;
    background-color: #fff;
    color: #000;
    display: block;
    cursor: pointer;
}

.aide-text
{
	font-family: Arial;
	font-size:12px;
	font-weight:bold;
    /*display:none;*/
}

.bulle {
	position: absolute;
	top: 70px;
	left: 930px;
	right: 10px;
	display:none;
	z-index:99;
	padding:15px 25px ;
	border-radius:15px;
	background-color:#FFFFFF;
	border-width: 1px;
	border-style:solid;
	border-color:#93117e;
}
.bulle#dernier_essai {top: 500px; left: 1057px;}

.infobulle {
	position: absolute;
	left: 1090px;
	display:none;
	z-index:99;
	color:#005994;
	font-family: Arial;
	font-size:10px;
	text-align:right;
	width:60px;
	/*padding:2px 15px ;
	border-radius:9px;
	background-color:#FFFFFF;
	border-width:thin;
	border-style:solid;
	border-color:#000000;*/
}

#infobulle_aide
{
	left: 1130px;
}

#infobulle_toutafficher
{
	top: 585px;
}

#infobulle_touteffacer
{
	top: 615px;
}

#infobulle_affichertextes, #infobulle_retirertextes
{
	top: 645px;
}


.top
{
	position:relative;
}



.bottom
{
	clear:both;
}
/*-----------MESSAGES REPONSES--------------*/

.messages-reponses {
position: absolute; top:530px; right: 18px;
	/*position:relative;*/
	display:none;
	/*top :50px;
	left:-350px;*/
	width:260px;
	height:25px;
	overflow:hidden;
	z-index:11; text-align:right;
}

.messages-aide {
	position:relative;
	display:none;
	top :60px;
	left:-320px;
	width:323px;
	height:196px;
	overflow:hidden;
	z-index:11;
}

.texte01-msg-conseil {
	font-family: DINBold;
	font-size:20px;
	font-weight:normal;
	color:#000;
	position:absolute;
	float:left;
	padding-left:20px;
	padding-right:20px;
	margin-top:-180px;
}

.texte02-msg-conseil {
font-family: DINBold;
	font-size:16px;
	font-weight:normal;
	color:#4d412b;
	position:absolute;
	float:left;
	padding-left:20px;
	padding-right:20px;
	margin-top:-130px;
}

.texte03-msg-conseil {
	cursor: pointer;
	position:absolute;
	float:left;
	margin-left: 101px;
	margin-top:-45px;
}

.texte01-msg-bravo {
	font-family: Arial;
	font-size:15px;
	font-weight:normal;
	color:#41A62A;
	position:absolute;
	float:left;
	margin-top:0px;
	padding-left:20px;
	padding-right:20px;
}

.texte01-msg-correction {
	font-family: DINBold;
	font-size:20px;
	font-weight:normal;
	color:#ed1c24;
	position:absolute;
	float:left;
	margin-top:-180px;
	padding-left:20px;
	padding-right:20px;
}

.texte02-msg-correction {
font-family: DINBold;
	font-size:16px;
	font-weight:normal;
	color:#4d412b;
	position:absolute;
	float:left;
	padding-left:20px;
	padding-right:20px;
	margin-top:-50px; /*margin-top:-130px;*/
	clear:both;

}

.accordion>h3
{
    padding:5px 0;
    cursor:pointer;
}

.accordion>div
{
    display:none;
    width:100%;
}

/*.bouton-solution {
	position:absolute;
	float:left;
	cursor: pointer;
	z-index:12;
	
	top:150px;
	left:20px;
}*/

#btn-voirreponse-util
{
	display:none;
}
.ui-draggable, .ui-droppable {
	-ms-touch-action: none;
	touch-action: none;
}

/* Désactive la sélection*/
body {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none; 
}
