 /* Extra small devices (phones, 600px and down) SMARTPHONE PORTRAIT = 412 x 915*/
@media only screen and (max-width: 600px) 
{
	body {
  /*   background-color: green;	*/
	}
	
/* Horaire */	
	[class*="col-"] 
	{
	  width: 90%;
	}
	.lbl_heures{
		font-weight: bold;
		color: #FFFFFF;
		font-size: 4vw;
	}
	.lbl_classes{
		font-size: 3vw;
		font-weight: bold;
		color: #000000;
	}	
	.lbl_cours{
		font-size: 3vw;
	}
	.legend-horaire
	{
		font-weight: bold;
		font-size: 3.5vw;
	}
	
}

/* Small devices (portrait tablets and large phones, 600px and up) 915 x 412*/
@media only screen and (min-width: 600px) 
{
	 body {
  /*   background-color: yellow;	*/
  }
	
	
	
	
}




/* Medium devices (portrait tablets, 768px and up) TABLETTE PORTRAIT 800 x 1280 - SMARTPHONE PORTRAIT*/
@media only screen and (min-width: 768px) 
{
	body {
 /*		background-color: #FFFF00;	*/
	}	

}




/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) 
{
  body {
 /*   background-color: blue;	*/
  }	
	

	
	
}


/* -------------------------- 1 2 0 0 / 1 4 0 0 / 1 6 0 0 -------------------------- */
/* -------------------------- 1 2 0 0 / 1 4 0 0 / 1 6 0 0 -------------------------- */
/* Extra large devices (large laptops and desktops, 1200px and up) 1280 x 800*/
@media only screen and (min-width: 1200px) 
{
	body {
/*		background-color: red;	*/
	}	
	.body-class
	{
		width: 99%;
		max-width: 99%;
		height: 100%;
		min-height: 100%;
		background-image: url(../ico/Wave_fond.png);
		background-position: top center;
		background-repeat:no-repeat;
	}	
/* HEADER */
	.lbl_header_top
	{
		color: #1eabed;
		font-size: 0.9vw;
	}
	.lbl_info_top
	{
		font-size: 0.8vw;
		font-weight: bold;
	}
	#depot_name
	{
		color: #1eabed; 
		font-weight: bold; 
		font-size: 1vw;
	}
	.menu_look
	{
		cursor: pointer; 
		font-size: 0.9vw;
/*		transition: transform .1s;*/
	}
	.menu_look:hover
	{
		cursor: pointer;
/*		background-color: #1eabed; */
/*		-ms-transform: scale(1.1); /* IE 9 */
/*		-webkit-transform: scale(1.1); /* Safari 3-8 */
/*		transform: scale(1.1);*/
	}
	.menu_look_div
	{
		font-size: 0.9vw;
		cursor: pointer;
/*		background : transparent;	*/
/*		transition: transform .1s;*/
	}	
	.menu_look_div:hover
	{
		background-color: #1eabed; 
		cursor: pointer;
/*		transition: transform .1s;*/
	}
/*	.menu_look_div:active
	{
		background: #1eabed; 
		cursor: pointer;
/*		transition: transform .1s;*/
/*	}*/
	#lbl_menu_info
	{
		color: #1eabed; 
		font-size: 1vw;
		font-weight: bold; 
		cursor: pointer;
	}
/* ---------------------------------MATIERE PAR CLASSE ---------------------------------*/
	.lbl_std
	{
		font-size: 0.9vw;
	}
	.lbl_etiq
	{
		font-size: 0.9vw;
	}
	.lbl_etiq_tableau
	{
		font-size: 0.9vw;
	}
	.lbl_etiq_blue
	{
		font-size: 0.8vw;
		color: #1eabed;
		font-weight: bold;
	}
	.lbl_checkbox
	{
		font-size: 0.8vw;
		padding-top: 5px;
	}
	.input_tableau
	{
		font-size: 0.9vw;
		text-align: left;
		border: none;
		cursor: pointer;
	}
/* --------------------------------- BULLETINS ---------------------------------*/
	.lbl_options
	{
		font-size: 0.9vw;
	}
	.lbl_bull_points
	{
		font-size: 0.8vw;
		font-weight: bold;
	}
	.lbl_bull_points_red
	{
		font-size: 0.8vw;
		font-weight: bold;
		color: #e72b34
	}
	.textarea_legend
	{
		font-weight: bold; 
		font-size: 0.8vw;
		
	}
/* --------------------------------- GÉNÉRAL ---------------------------------*/	
	.input_tableau_9
	{
		font-size: 0.8vw;
		text-align: left;
		border: none;
		cursor: pointer;
	}	
	.info_std
	{
		font-size: 0.7vw;
		color: #FFFFFF;
	}	
	.dash_blanc_r
	{
		font-weight: bold; 
		color: #FFFFFF;		/*#FF3131; */
		text-align: right; 
		font-size: 0.7vw;
	}
	.dash_rouge_r
	{
		font-weight: bold; 
		color: #FF0040;		/*#FF3131; */
		text-align: right; 
		font-size: 0.7vw;
	}
	.dash_vert_r
	{
		font-weight: bold; 
		color: #00FF00; 
		text-align: right; 
		font-size: 0.7vw;
	}		
	.titre
	{
		text-align: center; 
		font-size: 0.8vw;
		cursor: pointer;
	}
/* --------------------------------- PRÉ INSCRIPTIONS ---------------------------------*/	
	.input_ligne
	{
		border: none;
		border-radius: 0px;
		border-style: hidden;
		border-bottom: 1px solid #D8D8D8;
		
	}
	.combo_ligne
	{
		border-style: hidden;
		border-bottom: 1px solid #D8D8D8;
		box-shadow: 4px 4px #ccc
	}
/* --------------------------------- HORAIRES ---------------------------------*/	
	.tr-horaire
	{
		height: 1.2vw;
		width: 100%;
		vertical-align: middle;
	}
	.tr-horaire-sepa
	{
		height: 0.8vw;
		width: 100%;
		vertical-align: middle;
	}
	.td_horaire{
		background-color: #1eabed;
		border-radius: 0.8vw;
		cursor: pointer;
	}
	.col-1
	{
		width: 20%;
		min-width: 20%;
		max-width: 20%;
		float: left; 
		left: 0%;
	}
	.col-2
	{
		width: 20%;
		min-width: 20%;
		max-width: 20%;
		float: left; 
		left: 3%;
	}
	.col-3
	{
		width: 20%;
		min-width: 20%;
		max-width: 20%;
		float: left;
		left: 6%;
	}
	.col-4
	{
		width: 20%;
		min-width: 20%;
		max-width: 20%;
		float: left;
		left: 9%;
	}
	.col-5
	{
		width: 20%;
		min-width: 20%;
		max-width: 20%;
		float: left; 
		left: 12%;
	}	
	.lbl_heures{
		font-weight: bold;
		color: #FFFFFF;
		font-size: 0.8vw;
	}
	.lbl_classes{
		font-size: 0.6vw;
		font-weight: bold;
		color: #000000;
	}	
	.td_lbl_cours{
		width: 80%;
		max-width: 80%;
		font-size: 0.6vw;
		vertical-align: middle;
	}	
	.lbl_cours{
		font-size: 0.6vw;
		vertical-align: middle;
	}
	.legend-horaire
	{
		font-weight: bold;
		font-size: 0.9vw;
	}	
	.lbl_mat_jc
	{
		font-size: 0.8vw;
		color: #1eabed;
		font-weight: bold;
	}	
}

/* -------------------------- 1 9 0 0 -------------------------- */
/* -------------------------- 1 9 0 0 -------------------------- */
/* Extra large devices (large laptops and desktops, 1900px and up) 1920 x 1080*/
@media only screen and (min-width: 1900px) 
{
	body 
	{

 /*   background-color: #FE2EF7;		/* rose */	
	}	
	.body-class
	{
		width: 99%;
		max-width: 99%;
		height: 100%;
		min-height: 100%;
		background-image: url(../ico/Wave_fond.png);
		background-position: top center;
		background-repeat:no-repeat;
	}
/* ---------------------------------HEADER--------------------------------- */
	.lbl_header_top
	{
		color: #1eabed;
		font-size: 0.8vw;
	}
	.lbl_info_top
	{
		font-size: 0.8vw;
		font-weight: bold;
	}
	#depot_name
	{
		color: #1eabed; 
		font-weight: bold; 
		font-size: 1vw;
	}
	.menu_look
	{
		cursor: pointer; 
		font-size: 0.7vw;
/*		transition: transform .1s;*/
	}
	.menu_look:hover
	{
		cursor: pointer;
		background-color: #F5A9F2;		/*	#CED8F6;  */
/*		-ms-transform: scale(1.1); /* IE 9 */
/*		-webkit-transform: scale(1.1); /* Safari 3-8 */
/*		transform: scale(1.1);*/
	}
	.menu_look_div
	{
		font-size: 0.7vw;
		cursor: pointer;
/*		background : transparent;	*/
/*		transition: transform .1s;*/
	}	
	.menu_look_div:hover
	{
		background: #F5A9F2;		/*	#CED8F6;  */
		cursor: pointer;
/*		transition: transform .1s;*/
	}
/*	.menu_look_div:active
	{
		background: #1eabed; 
		cursor: pointer;
/*		transition: transform .1s;*/
/*	}*/
	#lbl_menu_info
	{
		color: #1eabed; 
		font-size: 0.8vw;
		font-weight: bold; 
		cursor: pointer;
	}
/* ---------------------------------Général ---------------------------------*/
	.lbl_std
	{
		font-size: 0.8vw;
	}	
	.lbl_etiq
	{
		font-size: 0.8vw;
		padding-top: 0.1vw;
	}
	.input_modif
	{
		font-size: 0.8vw;
		cursor: pointer;
	}	
	.lbl_etiq_tableau
	{
		font-size: 0.7vw;
	}
	.lbl_etiq_blue
	{
		font-size: 0.7vw;
		color: #1eabed;
		font-weight: bold;
	}
	.lbl_checkbox
	{
		font-size: 0.7vw;
		padding-top: 5px;
	}
	.input_tableau
	{
		font-size: 0.7vw;
		text-align: left;
		border: none;
		cursor: pointer;
		background-color: transparent;
	}
/* --------------------------------- BULLETINS ---------------------------------*/
	.lbl_options
	{
		font-size: 0.9vw;
	}
	.lbl_bull_points
	{
		font-size: 0.7vw;
		font-weight: bold;
	}
	.lbl_bull_points_red
	{
		font-size: 0.7vw;
		font-weight: bold;
		color: #e72b34
	}
/* --------------------------------- GÉNÉRAL ---------------------------------*/	
	.input_tableau_9
	{
		font-size: 0.7vw;
		text-align: left;
		border: none;
		cursor: pointer;
	}
	.info_std
	{
		font-size: 0.6vw;
		color: #FFFFFF;
	}	
	.dash_blanc_r
	{
		font-weight: bold; 
		color: #FFFFFF;		/*#FF3131; */
		text-align: right; 
		font-size: 0.7vw;
	}	
	.dash_rouge_r
	{
		font-weight: bold; 
		color: #FF0040;		/*#FF3131; */
		text-align: right; 
		font-size: 0.7vw;
	}
	.dash_vert_r
	{
		font-weight: bold; 
		color: #00FF00; 
		text-align: right; 
		font-size: 0.7vw;
	}	
	.titre
	{
		text-align: center; 
		font-size: 0.7vw;
		cursor: pointer;
	}	
/* --------------------------------- PRÉ INSCRIPTIONS ---------------------------------*/	
	.input_ligne
	{
		border: none;
		border-radius: 0px;
		border-style: hidden;
		border-bottom: 1px solid #D8D8D8;
		
	}
	.combo_ligne
	{
		border-style: hidden;
		border-bottom: 1px solid #D8D8D8;
		box-shadow: 4px 4px #ccc
	}	
/* --------------------------------- HORAIRES ---------------------------------*/	
	.tr-horaire
	{
		height: 1.1vw;
		width: 100%;
	}
	.tr-horaire-sepa
	{
		height: 0.8vw;
		width: 100%;
	}
	.td_horaire{
		background-color: #1eabed;
		border-radius: 0.8vw;
		cursor: pointer;
	}	
	.col-1
	{
		width: 18%;
		min-width: 18%;
		max-width: 18%;
		float: left; 
		left: 0%;
	}
	.col-2
	{
		width: 18%;
		min-width: 18%;
		max-width: 18%;
		float: left; 
		left: 2%;
	}
	.col-3
	{
		width: 18%;
		min-width: 18%;
		max-width: 18%;
		float: left;
		left: 2%;
	}
	.col-4
	{
		width: 18%;
		min-width: 18%;
		max-width: 18%;
		float: left;
		left: 2%;
	}
	.col-5
	{
		width: 18%;
		min-width: 18%;
		max-width: 18%;
		float: left; 
		left: 2%;
	}	
	.lbl_heures{
		font-weight: bold;
		color: #FFFFFF;
		font-size: 0.7vw;
	}
	.lbl_classes{
		font-size: 0.5vw;
		font-weight: bold;
		color: #000000;
	}	
	.lbl_cours{
		font-size: 0.6vw;
	}
	.legend-horaire
	{
		font-weight: bold;
		font-size: 0.9vw;
	}	
	.lbl_mat_jc
	{
		font-size: 0.6vw;
		color: #1eabed;
		font-weight: bold;
	}
}



