/* Def Générales */
/**
* v 1.1.23 : modificaiton du design global de la plateforme
*/
/**
* GENERAL
*/
/* CONSTANTES */
:root {
	--red: #DE0613;
	--white: #fff;
	--black: #151210;
	--blue: #273580;
	--bluelogo: #63B4E4;
	--clearblue: #d8ecf8;
	--yellow: #F6B500;
	--green: #33ce33;
	--fond-liste: rgba(216, 236, 248, 0.25);
	--fond-fiche:rgba(216, 236, 248, 0.5);
	--border: #eee;
	--shadow: rgba(39, 53, 128, 0.2);
	--parcours: rgba(39, 53, 128,0.75);
	--module:rgba(39, 53, 128,0.5);
	--seance:rgba(39, 53, 128,0.25);
	--sequence: rgba(39, 53, 128,0.10);
	--ressource: rgba(39, 53, 128,0);
	--inactive: #999;
}

@font-face {
	font-family: "Futura Book";
	font-weight:normal;
	src: url('/fonts/Futura Book.ttf');
}

@font-face {
	font-family: "Futura Medium";
	src: url('/fonts/Futura Heavy.ttf');
	font-weight:bold;
}

@font-face {
	font-family: "Futura Medium";
	src: url('/fonts/Futura Medium.ttf');
	font-weight:normal;
}

@font-face {
	font-family: "Futura Medium";
	src: url('/fonts/Futura Medium.ttf');
	font-weight:normal;
}

@font-face {
	font-family: "Futura";
	font-weight:100;
	src: url('/fonts/Futura Light.otf');
}

@font-face {
	font-family: "Futura";
	font-weight:300;
	src: url('/fonts/Futura Book.ttf');
}

@font-face {
	font-family: "Futura";
	src: url('/fonts/Futura Medium.ttf');
	font-weight:500;
}

@font-face {
	font-family: "Futura";
	src: url('/fonts/Futura Bold.otf');
	font-weight:bold;
}




html {overflow-y: scroll;}

/* STYLES GENERAUX */
body {
  padding:0px;
  margin:0px;
  border:0px;
  color:var(--black);
  font-family: "Futura Book", Arial, "Sans Serif";
  font-size: 18px;
  /* min-height: 100vh; */
}

h1{
	font-size: 1.7em;
	font-weight:bold;
	color:var(--white);
	padding: 15px 0;
	margin: 0;
	font-family: 'Futura Medium';
}
 #cadrePlay h1{
	color:var(--black);
 }

h2{
    font-size: 1.5em;
    font-weight: bold;
    color:var(--blue);
    /* width: 40%; */
}

img{border: 0px;}

a{
	text-decoration:none;
	color:var(--black);
}

/* STYLE GENERAUX DES OBJETS */
#btAdd{	font-size:1.3em;}
#linkBiblio, #linkEDC{display:none;}

/* Boutons d'actions */
.btAction {
    border: 1px solid var(--bluelogo);
    border-radius: 5px;
    background-color: var(--white);
    padding: 2px 8px;
    margin-right: 5px;
    font-size: 0.9em;
    float: right;
}

/* HEADER - Flex Container */
#menu {
	height:120px;
	background-color:var(--white);
	display: flex;
	flex-direction: row;
	justify-content:space-between;
	align-items:center;
	gap:10px 20px;
	padding: 0 10px;
}

	/* Logo  */
	#menu_pict{
		width:250px;
		text-align: center;
	}
		#pictHome{
			height:90px;
		}

	/* Menu de navigation - flex interne */
	#menu_nav{
		display:flex;
		flex-direction:row;
		justify-content:space-around;
		flex:2;
	}

		.item_menu{
			width:200px;
			text-align: center;
			margin-top:10px;
			padding-bottom:10px;
			font-size: 1em;
		}

		.item_menu > a {
			text-decoration: none;
			color:var(--blue);
			text-transform: uppercase;
			font-weight: bold;
			/* font-family: 'Futura Medium'; */
		}

		.item_menu.selected,.item_menu:hover {
			border-bottom: 3px solid var(--red);
		}

	/* Login et déconnection */
	#menu_login{
		width:250px;
		font-size: 0.8em;
		cursor: pointer;
		padding-bottom:0px;
		transition: all 1s ease-in-out;
	}

		#menu_login .icon-user{
			border: 1px solid var(--border);
			border-radius: 60px;
			padding: 8px;
			background-color: var(--clearblue);
		}

		#menu_login:hover #menu_login_down {
			height: 2em;
			display: block;
			padding:10px 10px 10px 20px;
			border: 1px solid var(--border);
		}

		#menu_login:hover{
			padding-bottom:14px;
			transition: all 0.5s ease-in-out;
		}

		#menu_login:hover #menu_login_down.menu_login_down_adm {
			height: 4em;
		}


		#user_login{
			font-weight: inherit;
			display: flex;
			flex-direction: row;
			align-items: center;
			gap: 5px;
		}
		#menu_login_down{
			height: 0em;
			overflow: hidden;
			transition-property: height;
			transition: all 0.5s ease-in-out;
			position: absolute;
			top: 76px;
			background-color: var(--clearblue);
			width: 180px;
			box-shadow: 0 5px 10px 0px var(--shadow);
		}
			#menu_login_down ul {
				list-style: none;
				margin: 0;
				padding:0;
			}
			#menu_login_down li {
				padding:5px;
			}
			#menu_login_down li span{
				padding-right:5px;
			}
			#menu_login_down li:hover {
				background-color: var(--white);
				border-radius: 5px;
			}

	/* actionParameter - Bouton d'action contextuel */
	#actionParameter:hover #actionParameterMenu {
		height: 6em;
		padding:10px 10px 10px 20px;
		border: 1px solid var(--border);
	}
	#actionParameterMenu{
		height: 0em;
		overflow: hidden;
		transition-property: height;
		transition: all 0.5s ease-in-out;
		position: absolute;
		background-color: var(--blue);
		width: 180px;
		box-shadow: 0 5px 10px 0px var(--shadow);
		right: 20px;
		z-index: 2;
		padding:0;
		margin-top: 5px;
		border-radius: 5px;
		color: var(--white);
	}
		#actionParameterMenu ul {
			list-style: none;
			margin: 0;
			padding:0;
		}
		#actionParameterMenu li {
			padding:5px;
		}
		#actionParameterMenu a {
			color:var(--white);
		}
		#actionParameterMenu li span {
			padding-right:10px;
		}
		#actionParameterMenu li:hover {
			background-color: var(--clearblue);
			border-radius: 5px;
		}
		#actionParameterMenu a:hover{
			color:var(--black);
		}

/* SUBHEADER */
#submenu {
	background-color:var(--blue);
	color:var(--white);
	padding: 0 20px;
	display: flex;
	align-items: center;
	justify-content:space-between;
}
	#submenu > h1 { 
		font-weight:bold;
	}
	#actionZone {
		display: flex;
		flex-direction:row;
		/* width:150px; */
		gap:10px;
		align-content: center;
		align-items: center;
	}
	#actionBiblio {
		display: flex;
		flex-direction:row;
		font-size: 1.1em;
	}

	.pictAction {
		background-size: 32px;
		background-repeat: no-repeat;
		background-position-x: center;
		background-position: center;
		width: 50px;
		height: 50px;
		background-color: var(--blue);
		border:1px solid var(--white);
		border-radius: 5px;
	}

	.pictAction:hover {
		background-color: var(--white);
		border:1px solid var(--blue);
	}

	#actionVue .pictAction{
		background-image: url('/img/pictCalendrierBlanc.png');
	}
	#actionVue .pictAction:hover{
		background-image: url('/img/pictCalendrier.png');
	}

	#actionVue .pictFormation{
		background-image: url('/img/pictFormBlanc.png');
	}
	#actionVue .pictFormation:hover{
		background-image: url('/img/pictForm.png');
	}

	#actionParameter .pictAction{
		background-image: url('/img/pictParameter.png');
	}
	#actionParameter .pictAction:hover{
		background-image: url('/img/pictAdmin.png');
	}

	#actionPlay .pictAction{
		background-image: url('/img/pictCloseBlanc.png');
	}
	#actionPlay .pictAction:hover{
		background-image: url('/img/pictClose.png');
	}
	#actionPrint .pictAction{
		background-image: url('/img/pictImprimerBlanc.png');
	}
	#actionPrint .pictAction:hover{
		background-image: url('/img/pictImprimer.png');
	}

	#menuRessources.pictAction{
		background-image: url('/img/pictRessourceBlanc.png');
		cursor: pointer;
		margin: 0 10px;
	}
	#menuRessources.pictAction:hover{
		background-image: url('/img/pictRessource.png');
		cursor: pointer;
	}

	#prevPlay.pictAction{
		background-image: url('/img/pictPrevBlanc.png');
		cursor: pointer;
		margin: 0 10px;
	}
	#prevPlay.pictAction:hover{
		background-image: url('/img/pictPrev.png');
		cursor: pointer;
	}

	#nextPlay.pictAction{
		background-image: url('/img/pictNextBlanc.png');
		cursor: pointer;
		margin: 0 10px;
	}
	#nextPlay.pictAction:hover{
		background-image: url('/img/pictNext.png');
		cursor: pointer;
	}

	
/* CONTENT */
#allContent{
	padding: 0;
	margin: 0;
}

#content {
	display: flex;
}

#layout_basic #content{
	flex-direction: column;
}

#content{
	min-height: calc(100vh - 198px);
}

#liste {
	padding:20px;
	width: 30%;
	background-color: var(--fond-liste);
	box-shadow: 0 5px 10px 0px var(--shadow);
}
#fiche {
	width: 70%;
	padding:40px;
	background-color: var(--fond-fiche);
}

#topficheaction{
	float:right;
	margin: 20px 20px 0 0;
	display: none;
}

#ficheInit {
	background-color: var(--white);
    padding-left: 20px;
    min-height:350px;
    padding-top:10px;
	border-radius:10px;
	box-shadow: 0 5px 10px 0px var(--shadow);
}
/* Liste hors formation = Administration */
#contentListe{
    min-height:350px;
    padding:10px 0 10px 20px;
}

/* FOOTER */
div.footer {
	color:#000;
	height:20px;
	z-index:-1;
	width:100%;
	position:relative;
	bottom:0px;
	font-size:smaller;
	margin-top:30px;
}

div.footer > a{
	color:#000;
	text-decoration:underline;
}


/* HACK CKEditor */
.ckeP{
	color:pink;
	margin:45px;
	border:1px solid red;
}

/* HACK JS Tree */
.jstree-default.jstree-focused {
    background-color: #FFFFFF !important;
}