/************************************************************/
/*				Hygiene Mentale																																							*/
/*				REDICO					 																			                     		*/
/************************************************************/

main { text-align : left ; }
header {text-align : left ; }
h2 { margin:0px;}

/*******************************/
/*		La liste des parties 		*/
/*******************************/

#logoredico {
	float:right;
}
@media screen and (max-width: 800px) {
#logoredico { width:30% ; height:30% ;}}
		
.redicoliste {
	font-family:Arial ;
	width:100% ;
	margin: 5px ; 
}
.redicoliste th {
	font-size:70% ;
	color:#999 ;
	border: 0px ;
	text-align:left;
	vertical-align:bottom;
}
.redicoliste td {
	border: 1px solid black ;
	text-align:left;
	vertical-align:center;
}


.redicoliste .date {
	width:100px;
	border: 0px ;
	color:#999 ;
}

.redicoliste .statut {
	width:200px;
}


/*******************************/
/*		La partie de redico 		*/
/*******************************/

#logo {
	height:150px;
	float:right; 
}
@media screen and (max-width: 800px) {
#logo { height:100px ;}}
/* La date de création du Redico  */
.cartouche {
	font-family:Arial ;
}
.cartouche span {
		color:#999 ;
}

/* Les messages du tutoriel */
.tuto {
	color:#f33;
	background-color:#fff0f0;
	font-family:Arial ;
	font-size:120% ;
	padding:5px ;
	width:70%;
	border:1px solid #f33;
}




/* Les boutons verts */
.back , .add {
	color:#090;
	font-weight:bold;
}
.back , .add {float:right; }
@media screen and (min-width: 1200px) {
.add {margin-right:400px;}}

.connexion, .connected {
	float:right;
	position:relative;
	width:250px;
	background-color:#dfd ;
	border: 1px solid black ;
	font-family:Arial ;
	margin:3px;
	padding:3px;
	text-align:right ;
}
@media screen and (min-width: 1200px) { .connexion form { 	width:200px; }}
.connected form {	width:240px;}
@media screen and (max-width: 800px) { .connected, .connected form {	float:none; width:95%; }}

.connexion span {
	font-size:80%;
	color:#363 ;
}
.connexion b {
	font-weight:bold;
	color:#a00 ;
}
.labelconnexion {
	color:#363 ;
	font-weight:bold;
	font-size:120%;
	position:absolute;
	top:-31px;
	left:0px;
}

/*******************************/
/*		La liste des proposition 		*/
/*******************************/
.redicoprop {
	font-family:Arial ;
	width:100% ;
	border-collapse: collapse;
	border-spacing: 0px;
}

.redicoprop th {
	vertical-align:bottom ;
	position:relative;
	color:#999 ;
	text-align:left;
}

.redicoprop td {
	border: 1px solid black ;
	text-align:left;
}

.redicoprop td:first-child { /* Auteur */
		text-align:center ;
}

.redicoprop th:nth-child(3), 
.redicoprop th:nth-child(4),
.redicoprop td:nth-child(3),
.redicoprop td:nth-child(4) {  /* evaluations */
		width:100px;
		text-align:center ;
		font-size:120% ;
}
@media screen and (max-width: 800px) { 
.redicoprop th:nth-child(3), 
.redicoprop th:nth-child(4),
.redicoprop td:nth-child(3),
.redicoprop td:nth-child(4) { 	width:50px; }}

.redicoprop th:nth-child(3) { /* Nom du joueur 1 */
	color:#b0f
}
.redicoprop th:nth-child(4) { /* Nom du joueur 2 */
	color:#40f
}
.redicoprop .lois {  /* Lois */
		width:24px;
		border: 0px ;
}
.redicoprop td .prop {
	font-size:120% ;
	font-weight:bold ;
}
.redicoprop .P1 {
	width:20px;
	background-color:#ffd9e9 ;
	position:relative;
}
.redicoprop .P2 {
	width:20px;
	background-color:#ddf ;
	position:relative;
}
.redicoprop .divergence {
	width:22px;
	position:relative;
}

.redicoprop input {
	border: 1px solid #ccc;
}
.redicoprop td:nth-child(3) input {
	text-align:right ;
}

.redicoprop .noeval {
	text-align:left !important ;
	color:#f00;
}
.redicoprop .noevalred {
	border: 1px solid #f00;
}

.redicoprop tr.salve {
	height:6px;
}

/*******************************/
/*		   Nouvelle salve 				   		*/
/*******************************/
#salve1 td:nth-child(3) span, 
#salve1 td:nth-child(4) span, 
#salve2 td:nth-child(3) span, 
#salve2 td:nth-child(4) span,
#salve3 td:nth-child(3) span, 
#salve3 td:nth-child(4) span,  
#salve4 td:nth-child(3) span, 
#salve4 td:nth-child(4) span { /* le label évaluation */
	color:#999 ;
	font-size:70%;
	font-weight:bold;
}

.maininputs th span { /* le label proposition-url-détail */
	color:#999 ;
	font-weight:bold;
}
.maininputs .propinput { /*gros texte pour le texte de la proposition */
	font-size:120% ;
	font-weight:bold ;
}
@media screen and (max-width: 800px) { 
.maininputs .propinput {
	font-size:120% ;
}}

#salve2 ,#salve3 ,#salve4 {
	display : none ;
}

/**/
.delsalve {
	position:absolute;
	top: 0px;
	left: 0px;
}
.addsalve {
	position:absolute;
	bottom: 0px;
	left: 0px;
}

#salve1 .delsalve {
	display:none;
}
#salve4 .addsalve {
	display:none;
}

.addsalve .fiche2 {
	width: 150px;
	top: 15px;
	left: 10px;
}
.addsalve:hover .fiche2  {
	opacity: 1;
	transform: scale(1) rotate(0);
	visibility: visible;  
}
#Envoyer  {
	float:right;
	background-color:#cfc;
	color:#151;
	border:1px solid #151;
}
#feedbacksalve {
	float:right;
	margin-right:100px;
	margin-left:10px;
	font-family:Arial;
}

/****************************/
/* Effet de l'infobulle */
/****************************/

.fiche, .fiche2{
	border: 1px solid black ;
	background-color: #eee;
	margin: 0;
	padding: 3px;
	font-size:80%;
	box-shadow: 5px 5px 10px #bbb;
	position: absolute;
	opacity: 0;
	transform: scale(0) rotate(-50deg);
	transition: opacity 0.5s, transform 0.25s;
	visibility: hidden;
	z-index: 10001;
}


/*  Infobulle  Noms des joueurs*/
.EnteteNom .fiche {
	text-align:left;
	width: 140px;
	top: -25px;
	left: 5px;
}
.EnteteNom:hover .fiche {
	opacity: 1;
	transform: scale(1) rotate(0);
	visibility: visible;  
}


/*  Infobulle  auteur*/
.P1 .fiche, .P2 .fiche {
	text-align:left;
	width: 140px;
	top: 5px;
	left: 5px;
}
.P1:hover .fiche , .P2:hover .fiche  {
	opacity: 1;
	transform: scale(1) rotate(0);
	visibility: visible;  
}

/*  Infobulle  divergence*/
.divergence .fiche {
	text-align:center;
	width: 70px;
	top: 25px;
	left: -70px;
}
.divergence:hover .fiche {
	opacity: 1;
	transform: scale(1) rotate(0);
	visibility: visible;  
}

/*  Infobulle  note*/
.note {
	color:#000 ;
	text-align:left;
	position:relative;
}
.note .fiche {
	width: 150px;
	top: 5px;
	left: -115px;
}
.note:hover .fiche  {
	opacity: 1;
	transform: scale(1) rotate(0);
	visibility: visible;  
}

.maininputs th span.fiche {
		color:#000 ;
		font-weight:normal ;
}


/*  Infobulle  alerte*/
.alerte {
	color:#000 ;
	text-align:left;
	position:relative;
}
.alerte .fiche2 {
	width: 150px;
	top: 15px;
	left: -115px;
}
.alerte:hover .fiche2  {
	opacity: 1;
	transform: scale(1) rotate(0);
	visibility: visible;  
}
main > .alerte .fiche2 {
	width: 150px;
	top: 15px;
	left: -15px;
}



/*  Infobulle modify*/
.modify {
	float:right;
	color:#000 ;
	text-align:left;
	position:relative;
}
.modify .fiche {
	width: 300px;
	top: 15px;
	left: -245px;
}
.modify:hover .fiche  {
	opacity: 1;
	transform: scale(1) rotate(0);
	visibility: visible;  
}



/*  Infobulle modifier le titre*/
.modifytitle {
	color:#000 ;
	text-align:left;
	position:relative;
}
.modifytitle .fiche {
	width:300px;
	top: -20px;
	left:15px;
}
.modifytitle:hover .fiche  {
	opacity: 1;
	transform: scale(1) rotate(0);
	visibility: visible;  
}


/*  Infobulle image : Loading for Evaluation*/
.eval {
	text-align:left;
	position:relative;
}
.eval .fiche {
	width: 170px;
	top: 5px;
	left: -115px;
}
.eval:hover .fiche  {
	opacity: 1;
	transform: scale(1) rotate(0);
	visibility: visible;  
}

/*  Infobulle newalerte  */
.newalerte {
	text-align:left;
	position:relative;
}
.newalerte .fiche {
	width: 140px;
	top: 10px;
	left: -95px;
}
.newalerte:hover .fiche  {
	opacity: 1;
	transform: scale(1) rotate(0);
	visibility: visible;  
}
.newalerte td {
	border:0px;
}





/************************************/
/*    Le Footer     */
/************************************/
footer {
	clear:both;
	font-family:sans-serif;
	color:#ccc;
	width:100%;
	height:100px;
}



/************************************/
/*    L'edition en frontOffice     */
/************************************/



a.edit {
	float:right;
	margin:5px;
	font-family: Sans-Serif;
	color:#090;
	font-weight:bold;
	/*font-size:6px;*/
}



.order {
	float:right;		
	position:relative;
	top:0px;
	right:0px;
}

.order a.edit {
	float:none;
	margin:0px;
}

span .info {
	font-familly:Arial; 
	font-size:20px;
	color:grey;
}



.form {
	font-size : 200% ;
}

.form h1{
	margin:0px;
}
.form td:first-child {
	text-align:right;
	font-weight :bold;
	width:150px;
}
.form td{
	text-align:left;
	vertical-align:top;
	margin:0px;
	padding:5px;
}

select, input, textarea {
	font-size : 100% ;
	font-family:arial;
}


/* La fonction print_a   */
.joli {
	margin: 5px ; 
}

.joli td {
	font-family:Arial;
	border: 1px solid black ;
	text-align:left;
}
.joli .joli {
 background-color:#fff9f9 ;
}