/* couleurs
 * violet du logo : #650103
 * bleu du logo : #8ed7d0
 * bleu foncé des titres : #30538f
 * lien : #3e6bb9
 * fond de tableau : #cee0ff
 *
*/

@import url('https://fonts.googleapis.com/css2?family=Quattrocento+Sans:wght@400;700&display=swap');


* {
	margin:0px;
	padding:0px;
	box-sizing:border-box;
	box-sizing:-webkit-border-box;
	box-sizing:-moz-border-box;
}
/* --------------- pour IE 8 */
header, footer, nav, article{
 display: block;
}
/* --------------- */



@media screen and (min-width:641px){
body{
	font-family: 'Quattrocento Sans', sans;
	font-size:0.85em;
	overflow-x:hidden;
	display:table;
	width:100%;
}
ul{
	padding:0px 10px;
}
li{
	list-style:none;
}
a, a:visited{
	text-decoration:none;
	color:#016664;
}
img{
	border:none;
}
h1,h3,h4,h5,h6{
	margin:5px 10px;
	color:#940104;
}
h1,h2{
	margin-left:20%;
}
h2{
	color:#650103;
}
div.none{
	clear:both;
	height:0px;
}

/*------------------------------*/
header{
	/*height: 87px;*/
	background-color: #650103;
	padding: 5px 10px 0px 50px;
	display:flex;
	flex-flow:row nowrap;
	justify-content:space-between;
	/*
	background: -webkit-linear-gradient(left,#650103 50%,#8ed7d0 65%,#650103 90%);
	background: -webkit-linear-gradient(to right,#650103 50%,#8ed7d0 65%,#650103 90%);
	background:    -moz-linear-gradient(left,#650103 50%,#8ed7d0 65%,#650103 90%);
	background:    -moz-linear-gradient(to right,#650103 50%,#8ed7d0 65%,#650103 90%);
	background:     -ms-linear-gradient(left,#650103 50%,#8ed7d0 65%,#650103 90%);
	background:     -ms-linear-gradient(to right,#650103 50%,#8ed7d0 65%,#650103 90%);
	background:      -o-linear-gradient(left,#650103 50%,#8ed7d0 65%,#650103 90%);
	background:      -o-linear-gradient(to right,#650103 50%,#8ed7d0 65%,#650103 90%);
	background:         linear-gradient(to right,#650103 50%,#8ed7d0 65%,#650103 90%);
	*/
}
header h1{
	font-size:40px;
	font-weight:400;
	margin:0px;
}
header h1 a, header h1 a:visited{
	color:white;
}
header p{
	color:white;
	font-style:italic;
	text-shadow: 1px 3px 3px rgba(0, 0, 0, 0.5);
}
header div{
	display:flex;
	flex-direction:column;
}
header div:nth-child(1){
	flex-basis:auto;
	flex-grow:1;
}
header div:nth-child(1) p{
	margin-left:10px;
	font-size:18px;
}
header div:nth-child(2){
	flex-basis:200px;
}
header div:nth-child(3){
	padding:2px 0px;
	flex-grow:1;
	align-items:flex-end;
	justify-content:space-around;
}
nav.connexion{
	border:1px solid white;
	border-radius:3px;
	padding:3px;
	color:white;
}
nav.connexion a{
  color:white;
}
form.recherche{
	padding-left:3px;
	/*border:1px solid #cee0ff;
	border-radius:3px;
	color:#cee0ff;*/
}
form.recherche p{
	display:inline-block;
	vertical-align:bottom;
	text-shadow:none;
	position:relative;
}
form.recherche p input[type=image]{
	position:relative;
}


/*----------- barre de menus -----------------------*/
nav.services > ul{
	margin-bottom:10px;
	padding:0px;
	border:5px solid #ba0205;
	background-color:#650103;
}
nav.services > ul > li{
	display:inline-block;
	padding:3px 20px 5px 10px;
	position:relative;
	color:white;
	font-weight:bold;
	text-shadow: 1px 3px 3px rgba(0, 0, 0, 0.5);
	border:1px solid #650103;
}
nav.services > ul > li:hover{
	background-color:#ac5252;
	color:white;
	border:1px solid #ac5252;
}
nav.services > ul > li > a{
display:inline-block;
width:100%;
color:white;
}

nav.services2 ul{
	display:none;
	padding:0px;
}
nav.services2 ul a{
	font-size:11px;
	color:white;
	text-shadow: 1px 3px 3px rgba(0, 0, 0, 0.5);
}
nav.services > ul > li:hover nav.services2 ul{
	display:block;
	width:140px;
	border:1px solid #ac5252;
	position:absolute;
	margin-top:5px;
	margin-left:-11px;
	background-color:#650103;
	z-index:1000;
}
nav.services > ul > li:hover nav.services2 ul > li{
	padding:2px 5px 3px 5px;
}
nav.services > ul > li:hover nav.services2 ul > li:hover{
	background-color:#ac5252;

	-webkit-box-shadow:0 1px 3px rgba(0, 0, 0, .15) inset, 0 3px 5px rgba(0, 0, 0, .05) inset, 0 5px 10px rgba(0, 0, 0, .05) inset, 0 20px 20px rgba(0, 0, 0, .01) inset;
	   -moz-box-shadow:0 1px 3px rgba(0, 0, 0, .15) inset, 0 3px 5px rgba(0, 0, 0, .05) inset, 0 5px 10px rgba(0, 0, 0, .05) inset, 0 20px 20px rgba(0, 0, 0, .01) inset;
	    -ms-box-shadow:0 1px 3px rgba(0, 0, 0, .15) inset, 0 3px 5px rgba(0, 0, 0, .05) inset, 0 5px 10px rgba(0, 0, 0, .05) inset, 0 20px 20px rgba(0, 0, 0, .01) inset;
	     -o-box-shadow:0 1px 3px rgba(0, 0, 0, .15) inset, 0 3px 5px rgba(0, 0, 0, .05) inset, 0 5px 10px rgba(0, 0, 0, .05) inset, 0 20px 20px rgba(0, 0, 0, .01) inset;
	        box-shadow:0 1px 3px rgba(0, 0, 0, .15) inset, 0 3px 5px rgba(0, 0, 0, .05) inset, 0 5px 10px rgba(0, 0, 0, .05) inset, 0 20px 20px rgba(0, 0, 0, .01) inset;
}
#sm0:target, #sm1:target, #sm2:target, #sm3:target, #sm4:target, #sm5:target, #sm6:target, #sm7:target, #sm8:target, #sm9:target{
	display:block;
	width:140px;
	border:1px solid #cee0ff;
	position:fixed;
	margin-top:5px;
	margin-left:-11px;
	background-color:#650103;
	z-index:1000;
}
/* spécialement pour Ipad et Iphone, qui ne supportent pas le li:hover */
#sm0:target > li, #sm1:target > li, #sm2:target > li, #sm3:target > li, #sm4:target > li, #sm5:target > li, #sm6:target > li, #sm7:target > li, #sm8:target > li, #sm9:target > li{
	padding:2px 5px 3px 5px;
}

/* ----------------------- */


/*----------------------------------------------*/


footer{
	margin-top:30px;
	text-align:center;
	display:table-row;
}
footer ul li{
	display:inline-block;
	margin-right:15px;
}
/*-----------------------------------------------*/


nav h2{
	margin:5px 10px;
	color:#650103;
}



.bulle{
	display:none;
}

div#menus{
	display:flex;
	flex-flow: row wrap;
	justify-content:space-between;
	height:55px;
	overflow:show;
}

div#menus nav.navigation{
	flex-basis:100%;
}
nav.navigation > ul{
	padding:0px;
	margin-bottom:4px;

	background-color:#650103;
}
nav.navigation > ul li ul{
	display:none;
	min-width:120px;
	background:#650103;
	padding:0px;
}
nav.navigation li{
	display:inline-block;
	min-width:120px;
	height:30px;
	text-align:center;
	position:relative;
	border:1px solid #650103;
}
nav.navigation li:hover .bulle{
	display:block;
	position:absolute;
	top:25px;
	left:0px;
	z-index:100;
	background:#30538f;
	border:2px solid white;
	border-radius:5px;
	padding:5px;
}
nav.navigation li:hover ul{
	display:block;
	position:absolute;
	top:30px;
}
nav.navigation a{
	color:white;
	font-weight:bold;
	display:block;
	padding:6px 9px 7px 9px;
	text-align:center;
	text-shadow: 1px 3px 3px rgba(0, 0, 0, 0.5);
}

nav.navigation a:hover{
	background-color:#ac5252;
}
/*nav.navigation li:hover::before{
	background:#cee0ff;
	-webkit-box-shadow:0 -1px 0 rgba(0,0,0,.4);
	   -moz-box-shadow:0 -1px 0 rgba(0,0,0,.4);
	    -ms-box-shadow:0 -1px 0 rgba(0,0,0,.4);
	     -o-box-shadow:0 -1px 0 rgba(0,0,0,.4);
	        box-shadow:0 -1px 0 rgba(0,0,0,.4);
}*/


nav.chemin{
	margin-top:5px;
}
nav.chemin ul li{
	display:inline-block;
	margin:0px 3px;
}
nav.chemin ul li:not(:last-child):after{
	content:url("../images/go-next.png");
	position:relative;
	top:3px;
	margin-left:9px;
}

nav.action{
	background:white;
	width:250px;
	z-index:100;
	margin:0px 10px;
	border:1px solid #650103;
	border-left:30px solid #650103;
	overflow:hidden;
	border-radius:3px;
}
nav.action::before{
	content:"Actions";
	display:block;
	text-align:center;
	color:#650103;
	font-weight:bold;
}
nav.action:hover{
	-webkit-transition-property:max-height;
	-webkit-transition-duration:0.5s;
	-webkit-transition-timing-function:ease;
	   -moz-transition-property:max-height;
	   -moz-transition-duration:0.5s;
	   -moz-transition-timing-function:ease;
	    -ms-transition-property:max-height;
	    -ms-transition-duration:0.5s;
	    -ms-transition-timing-function:ease;
	     -o-transition-property:max-height;
	     -o-transition-duration:0.5s;
	     -o-transition-timing-function:ease;
		    transition-property:max-height;
	        transition-duration:0.5s;
	        transition-timing-function:ease;
	/*max-height:300px;*/
}
nav.action:not(:hover){
	-webkit-transition-property:max-height;
	-webkit-transition-duration:0.5s;
	-webkit-transition-timing-function:ease;
	   -moz-transition-property:max-height;
	   -moz-transition-duration:0.5s;
	   -moz-transition-timing-function:ease;
	    -ms-transition-property:max-height;
	    -ms-transition-duration:0.5s;
	    -ms-transition-timing-function:ease;
	     -o-transition-property:max-height;
	     -o-transition-duration:0.5s;
	     -o-transition-timing-function:ease;
		    transition-property:max-height;
	        transition-duration:0.5s;
	        transition-timing-function:ease;
	max-height:15px;
}
nav.action ul{
	border-top:1px solid #650103;
	padding-left:10px;
}

nav.agendas{
	float:right;
	border: 3px solid #650103;
    height:auto;
    padding-bottom:5px;
}

nav.info_sommaire{
	font-size:130%;
	font-weight:bold;
}

/*-------------------------*/

p.message{
	margin-top:5px;
	margin-left:260px;
	font-weight:bold;
}
p.alerte span{
	font-size:large;
	border:2px solid #650103;
	padding:2px 5px;
	border-radius:3px;
}

.evidence{
	margin:20px 310px 0px 310px;
	border:1px solid #30538f;
	padding:5px;
	border-radius:5px;
}
.evidence h3{
	font-size:180%;
	font-weight:bold;
	border-bottom:1px solid #8ed7d0;
}
.evidence h4{
	margin:20px 0px 10px 0px;
}




div#corps{
	display:grid;
  grid-template-columns:33% 33% 33%;
	margin-right:5px;
  font-size:115%;
}

div#corps .menucol{
	border:1px solid #30538f;
	border-radius:5px;
	padding:10px;
	margin:5px 50px;
}
div#corps .menucol table{
	margin:0px auto;
}


div.gauche{
	border-right:2px solid #30538f;
	min-height:400px;
  grid-row:2;
  grid-column:1;
}
div.gauche.colles{
	flex-basis:5%;
}
div.gauche a{
	color:#016664;
}
div.gauche ul{
	border:none;
}
div.gauche nav{
	margin-top: 10px;
}
div.gauche nav ul li{
	margin-bottom:3px;
}
div.gauche h3{
	font-size:100%;
	border-bottom:1px solid #8ed7d0;
	margin-bottom:5px;
}
div.gauche form{
	margin:10px;
	border:1px solid #30538f;
	border-radius:5px;
	padding:5px;
}
div.gauche form fieldset{
	margin:5px;
	background-color:#cee0ff;
	position:relative;
	border:1px solid #8ed7d0;
	border-radius:3px;
	padding:3px;
}

.sansbord div.gauche{
	display:flex;
	border:none;
}
.sansbord div.gauche img{
	margin:auto;
}






div.math{
	margin: 10px;
	text-align:center;
}
div.central{
	padding:0px 5px 5px 15px;
	min-height:400px;
  grid-row:2;
  grid-column:2 / span 3;
  position:relative;
}
div.ects, div.suivi{
  grid-row:2;
  grid-column:1 / span 3;
}
div.central:before{
  position:absolute;
  left:center;
  content: url('../../images/chateau.jpg');
  opacity:.5;
  z-index:-1;
}
div.central h3{
	text-align:center;
}
div.central h3 span{
	color:black;
	font-size:20px;
}
div.central nav{
	margin-top: 30px;
}
div.central nav.mdp{
	margin-top:10px;
	border:1px solid #30538f;
	border-radius:5px;
	padding:5px;
}
div.central nav.une{
	margin-top:0px;
}

div.central article{
	padding-top:10px;
}
div.central p, div.central div{
	margin:0px 5px 5px 10px;
}
div.central form{
	margin-top:10px;
	border:1px solid #30538f;
	border-radius:5px;
	padding:5px;
}
div.central form fieldset{
	margin:43px 10px;
	background-color:#dafffe;
	position:relative;
	border:1px solid #8ed7d0;
	border-radius:3px;
	padding:3px;
}
div.central form fieldset legend{
	background-color:white;
	position:absolute;
	top:-22px;
	font-weight:bold;
}
div.central form fieldset p.texte{
	padding:5px;
}
div.central form label{
	display:inline-block;
	padding:0px 5px;
	min-width:180px;
}
div.central form table label{
	display:inline-block;
	padding:0px 5px;
}
div.central form span.help{
	display:inline-block;
	padding:2px 5px;
	margin-left:182px;
}
div.central form input[type=number]{
	width:50px;
	height:20px;
}
div.central form textarea{
	clear:both;
	width:70%;
	height:300px;
	vertical-align:top;
}
div.central form table textarea{
	clear:both;
	width:95%;
	height:auto;
	vertical-align:top;
}

div.central form.docs_ajouter{

}

div.central video{
	width:600px;
	height:337px;
}

/*---*/
.menu_colles li{
	margin-bottom:30px;
	font-size:150%;
	font-weight:bold;
	border-bottom:1px solid #650103;
	width:5em;
}
.menu_colles li:hover{
	padding-left:20px;
}







/* -------------- tables ----------------- */
article table{
	max-width:100%;
	table-layout:fixed;
}

table{
	margin:10px;
	border:1px solid gray;
}
table td,table th{
	padding:2px 5px;
}
table #doc_joints td:first-child{
	padding:0px;
}
table tr:nth-child(even){
	background:white;
}
table tr:nth-child(odd){
	background:#dafffe;
}
.docs table{
	margin-top:10px;
	width:90%;
	border-radius:3px;
}
.docs td.position{
  width:50px;
}
.docs td.position span{
  display:none;
}




div.central form table.edtr{
	display:inline-block;
	vertical-align:middle;
	border:none;
	margin:0px;
}
div.central form table.edtr tr{
	background-color:white;
	padding:0px;
}
div.central form table.edtr td{
	padding:2px;
	border:none;
}
div.central form table.edtr button{
	position:relative;
}
div.central form table.edtr span{
	display:none;
}
div.central form table.edtr button:hover span{
	position:absolute;
	display:block;
	top:20px;
	min-width:60px;
	z-index:20;
	background-color:#30538f;
	border-radius:3px;
	color:white;
	padding:0px 2px;
}


div.colles table{
	border-collapse: collapse;
}
div.colles table tr.sep{
	border-bottom:2px solid blue;
}
div.colles table td{
	position:relative;
}
div.colles table td span{
	display:none;
}
div.colles table td:hover span{
	display:block;
	position:absolute;
	z-index:100;
	top:15px;
	left:10px;
	border:1px solid red;
	background-color:yellow;
}


div.colles_prof table{
	border-collapse: collapse;
}
div.colles_prof table tr.sep{
	border-bottom:2px solid blue;
}
div.colles_prof table td, div.colles_prof table th{
	border:1px solid gray;
}
div.colles_prof table td:nth-child(2n+1){
	width:17%;
	text-align:center;
	font-weight:bold;
}
div.colles_prof table td:nth-child(2n+2){
	padding-left:5px;
	font-size:80%;
}


div.recap table{
	border-collapse: collapse;
}
div.recap table tr.sep{
	border-bottom:2px solid blue;
}
div.recap table td, div.recap table th{
	border:1px solid gray;
}
div.recap table td:nth-child(n+2){
	width:60px;
	text-align:center;
	font-weight:bold;
}



tbody#colles td:nth-child(2n){
	width:30%;
}
tbody#colles td.groupe{
	width:25px;
	font-weight:bold;
}



p.information{
	margin:10px;
}
p.statut{
	font-size:small;
	position:absolute;
	color:yellow;
	top:5px;
}
p.alerte{
	margin:20px 0px 0px 20%;
	font-size:20px;
}

svg{
	margin:10px;
}



}