* {
    padding : 0;
    margin : 0;
}

/* aide sur les couleurs
noir : 			#000000
blanc : 		#ffffff
bleufoncenuit:	#212f3d 

bleutempo:		#1b4f72 	
*/

:root {
	--bg-color: #000000;
	--part-color:#212f3d;
	--part1-color: var(--part-color);
	--new-form-color: var(--part-color);
	--part-selUnderl-color: #0033CC;
	--form-color: var(--part-color);
	/*#78909c;*/
	
	--font-main-color: #ffffff;
	--font-mainNoSel-color: #808b96;
	--font-tuile-color: var(--part-color);
	
/* parametrer facteur de taille*/
 
	}


/* general */ 
body{
	background-color: var(--bg-color);
	color: var(--font-main-color);
	font-family: Calibri;
/*    font-family: "Lucida Console", monospace;*/
/*  font-family: Helvetica, Arial, sans-serif;*/
    }
	
h1{
	position: fixed;
	top: 0;
	background-color: var(--part1-color);
	width: 100%;
	font-size: 320%; 
}

.h_t{
	border-collapse: separate;
	border-spacing: 15px 0px;
	height: 90px;
}
.h_t_main{
	border-collapse: separate;
	border-spacing: 15px 0px;
	height: 90px;
	width: 100%;
}
.h1_div2{
background-color: var(--bg-color);
width: 100%;
}
.h_t2{
	border-collapse: separate;
	border-spacing: 15px 0px;
	height: 40px;
	font-size: 80%;
}

.h_c1{
	color:var(--font-mainNoSel-color);
	text-align: center;
}

.h_c1_e{
	color:var(--font-mainNoSel-color);
	text-align: center;
	width:30px;
}

.h_c1_sel{
	color:var(--font-main-color);
	border-bottom-style: solid;
	border-width: 7px;
	border-color: var(--part-selUnderl-color);
	text-align: center;
}
.h_c1_main{
	color:var(--font-main-color);
	border-bottom-style: solid;
	text-align: center;
	border-width: 10px;
	border-color: var(	--bg-color);
}

h2{
	background-color: var(--part1-color);
	position: fixed;
	bottom: 0;
	width: 100%;
	font-size: 200%; /*small*/
}

/* basic general */
p{
	clear: both;
}
/* retirer les text deco des liens*/
a { 
	text-decoration: none;
	color:var(--font-main-color);
}
.center{
	    text-align: center;
	}
.right{
	    text-align: right;
	}


/*DEPUIKAN*/
/* titre des catégories  */
.type{
	background-color: var(--part1-color);
	clear: both;
	width: 100%;
	font-size: 220%; /*small*/
	/*font-weight: bolder;*/
	text-indent: 15px;
	/*text-transform: uppercase;*/
}

.h_t3{
	clear: both;
	width: 100%;
	font-size: 220%; /*small*/
	/*font-weight: bolder;*/
	/*text-indent: 15px;*/
	padding-left:15px;
	padding-right:15px;

	/*text-transform: uppercase;*/
	/*padding-bottom: 15px;*/
}

/* tuiles et sous parties */
.tuile{
	float: left;
	margin-right: 15px;
	margin-bottom: 15px;
	text-align: center;
	border-collapse: separate;
	border-spacing: 0px 0px;
	border-radius: 14px;
	overflow:hidden;
    }
.tuile_titre{
	background-color: var(--part1-color);
	font-size: 260%;
	padding-right:15px;
	padding-left:15px;
    }
.tuile_count{
	/*font-size: x-large;*/
	font-size: 500%;
	clear: both;
	color:	var(--font-tuile-color);
	/*font-weight: bolder;*/
	/*vertical-align: -200px;*/
    }
.tuile_u_count{
	color:	var(--font-tuile-color);
	font-size: 260%; /* small*/
	/*font-weight: bolder;*/
    }

table.sstype{
	float: left;
	padding-right:15px;
	padding-left:15px;
	}

.tuile_titre_sstype{
	font-size: 220%;
	padding-right:15px;
	padding-left:15px;
	/*
	writing-mode: vertical-lr;
	text-orientation: sideways-left;
	transform: rotate(180deg);
	*/
	text-align: left;
	}


	
/*NEW*/	
/* formulaire d'ajout de tuile */
.input_tuile{
      /*clear: both;*/
	text-align: left;
	top: 0;
	font-size: 300%;
	/* la couleur de font n est pas reconnu */
	}
.form_input{
}
/* formulaire : couleur et position du texte */
.form_type{
	font-size: 90%; /* small*/
	width: 100%;
	background-color: var(--new-form-color);
	border-style: none;
	color: var(--font-main-color);
	padding-left:15px;
    }
.form_type_info{
	font-size: 90%; /* small*/
	/*width: 100%;*/
	background-color: var(--new-form-color);
	border-style: none;
	color: var(--font-main-color);
	padding-left:15px;
    }

.form_select_yyyy{
	font-size: 150%; /* small*/
	/*width: 100%;*/
	background-color: var(--form-color);
	border-style: none;
	color: var(--font-main-color);
	padding-left:15px;
		font-weight: bolder;
    }


.form_color{
    	/*font-size: 100%;  small*/
	width: 100%;
	height: 62px;
	font-size: 80%; /* small*/
	background-color: var(--new-form-color);
	color: #ffffff;
	border-style: none;
    }
.form_date{
    	/*font-size: 100%;  small*/
	/*width: 733px;*/
	width:100%; 
	/*height: 62px;*/
	font-size: 120%; /* small*/
	background-color: var(--new-form-color);
	color: #ffffff;
	border-style: none;
	padding-left:15px;
	}
.form_count_Q1{
	width: 100%;
	font-size: 80%;
	background-color: var(--new-form-color);
	color: var(--font-main-color);
	border-style: none;
	padding-left:15px;
    }
.form_count_Q2{
	font-size: 80%;
	width: 100%;
	background-color: var(--new-form-color);
	color: var(--font-main-color);
	border-style: none;
	padding-left:15px;
    }
	.input_empty{
	height: 15px;
	}
.but{
	background-color: var(--new-form-color);
	font-size: 100%;
	padding-right:15px;
	padding-left:15px;
	border-style: solid;
	border-width: 2px;
	border-color: #ffffff;
	color: #ffffff;
	width:100%;
	text-align: center;
	}
/* formulaire : dimenssion */
.new_c1{
	width: 800px;
	padding-right:15px;
	padding-left:15px;
	font-size: 80%;
	height: 62px;
}
.new_c2{
	height: 62px;
}

.new_c2a{
	width:33%;
	height: 62px;
}

.new_c2b{
	width:66%;
	height: 62px;
}

.new_s{
	font-style:italic;
	color:var(--font-mainNoSel-color);
	vertical-align: top;
	}

/*INFO*/
/*--------*/
/* titre des catégories  */
/*style info type = type*/
.info_tag{
	background-color: var(--part1-color);
	clear: both;
	width: 100%;
	font-size: 250%; /*small*/
	font-weight: bolder;
	text-indent: 15px;
	text-transform: uppercase;
}
.info{
	background-color: var(--part1-color);
	clear: both;
	/*width: 100%;*/
	font-size: 200%; /*small*/
	/*font-weight: bolder;*/
	padding-right:15px;
	padding-left:15px;
	/*text-transform: uppercase;*/
}
.info_tb1{
	table-layout: auto;
	width: 100%;
	padding-right:30px;
	padding-left:15px;
}
.info_r1{
	font-size: 120%;
	height: 60px;
	font-weight: bolder;
}
.info_anx1{
	padding-right:15px;
	padding-left:15px;
	}
.info_anx{
	padding-right:15px;
	padding-left:15px;
	border-style: solid;
	border-width: 2px;
	border-color: var(--font-mainNoSel-color);
	color:var(--font-mainNoSel-color);
	font-size: 150%; 
}
.tab_data{
	background-color: var(--part1-color);
	clear: both;
	width: 100%;
	font-size: 220%; /*small*/
	/*font-weight: bolder;*/
	padding-right:15px;
	padding-left:15px;
	/*text-transform: uppercase;*/
	text-align: left;
	vertical-align: top;
	
}

tr.top {
   vertical-align: top;
}

td.top {
   vertical-align: top;
}
	
/*GOAL*/	
/* presentation objectifs et badge */
.goal_table_1Y{
    /*clear: both;*/
	text-align: left;
	top: 0;
}
.goal_tb1{
	table-layout: auto;
	width: 100%;
	padding-right:15px;
	padding-left:15px;
}

.goal_tb2{
	table-layout: auto;
	width: 100%;
	padding-right:15px;
	padding-left:15px;
/*
	border-collapse: separate;
	border-spacing: 50px 0px;
*/
}

/* tableau */

/* row */
.goal_r1{
	font-size: 280%;
	height: 60px;
}
.goal_r2{
	font-size: 200%;
	color:var(--font-mainNoSel-color);
	font-style:italic;
	height: 62px;
}
.goal_r2b{
	font-size: 200%;
	color:var(--font-mainNoSel-color);
	font-style:italic;
}
.goal_r3{
	font-size: 280%;
	height: 60px;
	padding-right:15px;
	padding-left:15px;
}
.goal_r4{
	font-size: 200%;
	padding-right:15px;
	padding-left:15px;
}
/* column */
/* objectif intermediaire*/
.goal_r3c{
	background-color: gray;
	text-align: center;
	/*
	border-style: solid;
	border-left: 7.5px;
	border-right: 7.5px;
	border-color: var(--bg-color);
	*/
}
/* on goal*/
.goal_r1c3{
	background-color: gray;
	padding-right:15px;
	padding-left:15px;
	text-align: center;
}	
.goal_r5{
	font-size: 70%;
	color:var(--font-mainNoSel-color);
	font-style:italic;
	height: 50px;
}
.goal_r6{
	height: 62px;
}
.goal_r7{
	height: 10px;
}

.goal2_input{
      /*clear: both;*/
	text-align: left;
	top: 0;
	font-size: 280%;
	/* la couleur de font n est pas reconnu */
	}

.goal2_c1{
	width: 800px;
	padding-right:15px;
	padding-left:15px;
}
.goal2_c2{

}

.goal2_c2a{
	padding-right:15px;
	padding-left:15px;
	width:33%;
}
.goal2_c2ai{
	padding-right:15px;
	padding-left:-15px;
	width:33%;
}

.goal2_c2b{
	padding-right:15px;
	padding-left:15px;
	width:66%;
}

.form_goal{
	font-size: 90%; /* small*/
	width: 100%;
	background-color: var(--new-form-color);
	border-style: none;
	color: var(--font-main-color);
	padding-left:15px;
    }