.titre_partition{
	background-color :SEAGREEN;
	color : white;
	width : 13%;
	font-size :  1.19em;
	opacity : 0.57
}

.titre_partition2{
	background-color :SEAGREEN;
	font-weight : bold;
	color : white;
	width : 91%;
	margin : auto;
	font-size :  1.79em;
	opacity : 0.57
}

.CartouchePartition{
	margin : 1%;
	vertical-align : top;
	width : 100%;
}

.CartouchePartition td{
	vertical-align: top;
	width : 23px;
}

.iconePart, .iconePartFalse{
	padding 	: 1%;
	border		: 0;
	text-align : center;
}

.iconePartFalse{
	background : rgba(19, 19, 19, 0.719);
}

.iconePart img, .iconePartFalse img{
	width : 43px;
}

.iconePart a {
	text-decoration : none;
}

.iconePart:hover{
	transform: translateY(19%);
	transition-duration: 0.5s;
}

.iconeDesc{
	font-size : 0.519em;
}

.carnet{
	text-align : left;
	width : 71%;
	margin : auto;
}

.carnetTitre{
	text-align : center;
	font-size : 1.79em;
	font-weight : bold;
	margin : 3%;
}

.carnet li a{
	font-weight : bold;
}

.horizon0, .horizon0 tr, .horizon0 td, .horizon1, .horizon1 tr, .horizon1 td{
	border : 0;
	border-collapse: separate;
}

.horizon0{
	background-color : rgba(0, 0, 0, 0.19);
}

.horizon0, .horizon1{
	width : 87%;
	text-align : left;
	margin : auto;
}

.horizon0 .note, .horizon1 .note{
	text-align : center;
	font-weight : bold;
}

.horizon0 .data_note, .horizon1 .data_note {
	font-size : 0.79em;
	text-align : center;
}

.horizon0 .trophes, .horizon1 .trophes{
	text-align : center;
}

.horizon0 img, .horizon1 img{
	width : 17px;
}

.horizon0 .trophes img, .horizon1 .trophes img{
	width : 23px;
}

.user{
	width : 31%;
	padding : 1%;
}

.COMP{
	vertical-align : top;
	padding : 1%;
	margin : auto;
	width : 87%;
}

.mini_COMP{
	display : inline-block;
	border : 1px solid black;
	text-align : center;
	vertical-align : center;
	border-radius : 39px;
	margin : 1%;
	padding : 1%;
	font-weight : bold;
	font-family : arial;
}

.maxi_COMP{
	display : inline-block;
	border : 1px solid black;
	text-align : center;
	vertical-align : center;
	border-radius : 39px;
	margin : 0.519%;
	padding : 1%;
	font-family : arial;
	font-size : 0.719em;
}

.mini_COMP{
	width : 19px;
	height : 19px;
}

.not_COMP{
	text-align : right;
	font-weight : bold;
}

.err{
	display 		: inline-block;
	vertical-align 	: middle;
	padding 		: 1%;
	margin			: 1%;
	border 			: 10px red solid;
	text-align 		: center;
	font-weight		: bold;
	color			: red;
}

.petit{
	font-size :  57%;	
}

.STD{
	background-color :rgba(70,130,180, 0.519);
	width : 41%;
}
.MST{
	background-color :rgba(199, 21, 133, 0.519);
	width : 41%;
}
.CHR{
	background-color :rgba(255,248,220, 0.519);
	width : 41%;
}

.table_details{
	display : inline-block;
	width : 31%;
	vertical-align : top;
	margin : 1%;
}
.Details_STD{
	background-color :rgba(70,130,180, 0.519);
}
.Details_MST{
	background-color :rgba(199, 21, 133, 0.519);
}
.Details_CHR{
	background-color :rgba(255,248,220, 0.519);
}

.NON{
	background-color :rgba(0,0,0, 0.519);
	width : 41%;
}

:root {
  --taille: 271px;
  --posx : 73px;
  --posy : 79px;
}

.BIGBLOC{
	display : inline-block;
	margin : 1%;
}

.blocMODE {
  width: var(--taille);
  height: var(--taille);
  display: grid;
  grid-template-columns: repeat(2, 50%);
  grid-template-rows: repeat(2, 50%);
  justify-items: center;
  align-items: center;
  filter: drop-shadow(0px 0px 7px rgba(1, 1, 1, .7));
  text-align : left;
}

.NOTE {
  grid-column: 1/span 2;
  grid-row: 1 /span 2;
  width: var(--taille);
  height: var(--taille);
  background-size: cover;
  clip-path: polygon(
    20% 20%,
    50% 20%,
    50% 20%,
    80% 20%,
    80% 50%,
    80% 50%,
    80% 80%,
    50% 80%,
    50% 80%,
    20% 80%,
    20% 50%,
    20% 50%
  );
  transition: all 0.7s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}

.NOTE:hover {
  clip-path: polygon(
    20% 0%,
    50% 0%,
    50% 20%,
    100% 20%,
    100% 50%,
    80% 50%,
    80% 100%,
    50% 100%,
    50% 80%,
    0% 80%,
    0% 50%,
    20% 50%
  );
  transform: rotate(-375deg);
  transition: all 0.4s cubic-bezier(0.86, 0, 0.07, 1);
}

.NOTE span{
	display : inline-block;
	padding : 3%;
}

.NOTE:hover ~ * {
  opacity: 1;
  transform: rotate(-15deg);
  transition: all 0.4s cubic-bezier(0.86, 0, 0.07, 1);
}
.blocSTAT h4, .TrophEes h4, .NOTE_R h4{
	padding : 0;
	margin : 0;
}
.blocSTAT, .TrophEes, .NOTE_R {
  z-index: 1;
  opacity: 0;
  transition: all 0.6s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}
.TrophEes .iconeTRO{
	display : inline-block;
}

.TrophEes .iconeTRO img{
	width : 19px;
}

.blocSTAT table{
  width : 123%;	
  font-size : 0.719em;
  background-color : rgba(0, 0, 0, 0.719);
  color : white;
}

.blocSTAT .col1{
  text-align : right;
}

.blocSTAT .col3{
  font-style : italic;
  font-size : 79%;
}

.blocSTAT .colTitre td{
  border : 1px solid white;
  text-align : center;
  font-size : 1.19em;
}

.blocSTAT .colContr1 td{
  color : rgb(0, 255, 0);
  text-align : center;
}

.blocSTAT .colContr2 td{
  color : rgb(255, 153, 153);
  text-align : center;
}

.blocSTAT .col2{
  font-weight : bold;
}

.TrophEes {
	grid-column: 1;
	grid-row: 1;
}


.blocSTAT {
  grid-column: 2;
  grid-row: 2;
}

.NOTE_R {
  grid-column: 2;
  grid-row: 1;
}

.nomMODE{
  grid-column: 1;
  grid-row: 2;
  justify-self: left;
}

.NOTE_R div{
	text-align : center;
	font-weight : bold;
	background-color : rgba(0, 0, 0, 0.719);
	color : white;
	padding : 3px;
}

.nomMODE {
	font-weight : bold;
	font-size : 1.79em;
	z-index: 1;
	transition: all 0.7s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}
.NOTE span{
	position : absolute;
	top : var(--posy);
	left : var(--posx);
	vertical-align : center;
	font-weight : bold;
	font-size : 2.19em;
}

.is_do{
	border : 1px solid black;
	width : 37%;
	min-height : 60px;
	background:rgba(43,44,47,1);
	background-image : url("../IMAGE/TempsDeVerificationCorrection.gif");
	background-size: 119px;
	background-repeat: no-repeat;
	color : white;
	margin : 1% auto;
	padding : 1%;
	text-align : center;
}

.BIGBLOC2{
	display : inline-block;
	width : 31%;
}

.blocFiche img{
	width : 37px;
}
.blocFiche{
	width : 19%;
	vertical-align : top;
	display : inline-block;
	text-align : center;
	padding : 1%;
	margin : 1%;
	border-radius : 19px;
	border : 1px solid black;
}

.blocFiche:hover{
	box-shadow : 0 0 19px seagreen;
	box-shadow : 0 0 19px seagreen;
	transition: all 0.31s ease-out;
}


.classement{
	transition: transform 0.5s;
	width : 5%;
	margin : auto;
}

.classement img{
	width : 100%;
}

.classement:hover{
	transform: rotate(-375deg);
}

.Faire img{
	transition: transform 0.5s;
}

.Faire img:hover{
	transform : rotate(-375deg) scale(1.79);
}