@media all and (max-width : 480px)  {

@font-face {
	font-family : "Avenir";
	src : url("../../font/AvenirLTStd-Light.woff2");
	font-display : swap;
}

body {
	background-color : white;
	margin : 0;
	padding : 0;
	overflow-x : hidden;

	font-family : Avenir;
	font-size : 3.5vw;
	color : grey;
}

/*html {
  height: 100%;
}*/

div#selector {
	display : none;
}

div#keyboard {
	display : none;
}


/************************************************ HEADER ***********************************************/

div#header {
	position : fixed;
	z-index : 100;
	top : 0px;
	width : 100vw;
	height : 15vw;
	box-shadow : 0vw 2vw 2vw #999;
	background-color : white;
}

img#menu_button {
	position : fixed;
	opacity : 0.5;
	top : 4vw;
	left : 2vw;
	width : 8vw;
}

		img#menu_button:hover {
			cursor : pointer;
			opacity : 1;
		}

div#header_left {
	display : none;
}


div#header_center {
	text-align : center;
	width : 100vw;
}

		img#logo {
			margin-top : 3vw;
			width : 30vw;
		}

div#header_right {
	display : none;
}

		ol.sub_list_header {
			display : none;
		}

img#user_button {
	position : fixed;
	opacity : 0.5;
	top : 4vw;
	right : 2vw;
	width : 8vw;
}

		img#user_button:hover {
			cursor : pointer;
			opacity : 1;
		}

img#log_button {
	position : fixed;
	top : 4vw;
	right : 1.8vw;
	width : 1.8vw;
}


/************************************************* MENU ************************************************/

div.menu {
	position : fixed;
	z-index : 60;
	top : 0vw;
	padding-top : 30vw;
	margin-left : -80vw;
	width : 78vw;
	height : 100%;
	overflow-y : auto;
	box-shadow : 2vw 0vw 2vw #999;
	background-color : white;
}

		div#menu_right {
			margin-left : 102vw;
			box-shadow : -2vw 0vw 2vw #999;
		}

div.item_menu {
	position : relative; 
	opacity : 1; 
	width : 100%;
}

		div.item_menu:hover {
			cursor : pointer;
			opacity : 0.6; 
		}   

		img.icon_item_menu {
			width : 10vw;
			margin-left : 4vw;
			vertical-align : middle;
		}

		a.text_item_menu {
			color : grey;
			font-size : 5vw;
			vertical-align : middle;
			text-decoration : none;	
			margin-left : 2vw;
		}

		img.icon_item_down {
			width : 10vw; 
			float : right; 
			margin-right : 4vw;
		}


ol.sub_list_menu {
	display : none;
	list-style-type : none;
	margin : 0vw;
}

		ol.sub_list_menu li {
			margin-left : 15vw;
			line-height: 250%;
		}

		a.sub_list_item_menu {
			color : grey;
			font-size : 5vw;
			text-decoration : none;
		}

		a.sub_list_item_menu:hover {
			color : white;
		}

div.item_padding {
	height : 10vw;
}

div#item_user_connect {
	margin-top : 10vw;
	opacity : 0.5;
}

div#black_layer {
	display : none;
	position : absolute;
	z-index : 50;
	top : 0px;
	left : 0px;
	width : 100%;
	height : 100%;
	opacity : 0.7;
	background-color : transparent;
}


/************************************************ TITLE ***********************************************/

div#screen {
	display : none;
	margin-top : 6vw;
	min-height : 40vw;
}

div.screen_title {
	margin-top : 22vw;
	margin-bottom : 8vw;
	margin-left : 5vw;
	width : 90vw;
	text-align : center;
}

	/*h1.screen_title {
		position : relative;
		margin-left : 5vw;
		font-size : 6vw;
		color : rgb(200, 200, 200); 
		font-weight : normal;
		width : 80vw;
	}*/

	a.screen_title_medium {
		font-size : 3.6vw;
	}

	a.screen_title_big {
		font-size : 4vw;
	}

	a.mouse_over {
		text-decoration : none;
		color : grey;
	}

			a.mouse_over:hover {
				color : white;
			}	

a#warning {
	margin-top : -0.5vw;
	margin-bottom : 2vw;
	margin-left : 20vw;
}


/********************************************* RIGTH / LEFT *********************************************/

img#arrow_left_page {
	display: none;
	position: fixed;
	cursor : default;
	z-index : 50;
	left : 0vw;
	top : 50%;
	height : 20vw;
 	margin-top: -10vw;
}

img#arrow_left_page:hover {
	cursor : pointer;
}

img#arrow_right_page {
	display: none;
	position: fixed;
	cursor : default;
	z-index : 50;
	right : 0vw;
	top : 50%;
	height : 20vw;
 	margin-top: -10vw;
}

img#arrow_right_page:hover {
	cursor : pointer;
}


/*************************************** CONFIRM POP UP **************************************/

div#confirm_black_layer {
	display : none;
	position : absolute;
	z-index : 400;
	top : 0px;
	left : 0px;
	width : 100vw;
	height : 100vh;
	opacity : 0.7;
	background-color : black;
}

div#confirm_pop_up {
	display : none;
	position : fixed;
	z-index : 500;
	top : 25vw;
	left : 10vw;
	padding-top : 0vw;
	padding-bottom : 1vw;
	padding-left : 3vw;
	padding-right : 3vw;
	border-radius : 4vw;
	width : 74vw;
	height : 25vw;
	text-align : center;
	background-color : rgb(35, 35, 35);
}

img#close_confirm_pop_up {
	z-index : 501;
	opacity : 0.5;
	position : fixed;
	top : 27vw;
	left : 82vw;
	width : 6vw;
}


a.confirm_text {
	display : block;
	margin-top : 6vw;	
	margin-left : auto;
	margin-right : auto;
	margin-bottom : 5vw;
	color : rgb(200,200,200);
	font-size : 3.6vw;
	color : grey;
}

a.confirm_action {
	margin-top : 12vw;
	margin-left : 1vw;
	margin-right : 1vw;
	margin-bottom : 0.5vw;
	padding-top : 1.5vw;
	padding-left : 4vw;
	padding-right : 4vw;
	padding-bottom : 1vw;
	width : 6vw;
	color : grey;
	font-size : 3.6vw;
	border-radius : 2vw;
	background-color : rgb(20, 20, 20);
	text-decoration : none;
}

		a.confirm_action:hover {
			cursor : pointer;
			color : white;
		}


/*************************************** CONNEXION POP UP **************************************/	

div#connection_black_layer {
	display : none;
	position : absolute;
	z-index : 600;
	top : 0px;
	left : 0px;
	width : 100vw;
	height : 100vh;
	opacity : 0.7;
	background-color : black;
}

div#connection_pop_up {
	display : none;
	position : fixed;
	z-index : 600;
	top : 25vw;
	left : 4vw;
	width : 85vw;
	height : 78vw;
	padding-top : 0vw;
	padding-bottom : 1vw;
	padding-left : 3vw;
	padding-right : 3vw;
	border-radius : 2vw;
	text-align : center;
	background-color : rgb(35, 35, 35); 
}

img#close_pop_up {
	z-index : 601;
	opacity : 0.5;
	position : fixed;
	top : 27vw;
	left : 88vw;
	width : 6vw;
}

a.title_pop_up {
	display : block;
	margin-top : 5vw;	
	margin-left : auto;
	margin-right : auto;
	margin-bottom : 5vw;
	color : rgb(200,200,200);
	font-size : 4vw;
	color : grey;
}

div.item {
	margin-bottom : 2vw;
}

		a.item_title {
			display : block;
			float : left;
			width : 40vw;
			font-size : 3.6vw;
			color : rgb(200, 200, 200);
		}

		a.grey {
			color : grey;
		}

		input.item_value {
			border-top : none;
			border-left : none;
			border-right : none;
			border-bottom-color : grey;
			margin-bottom : 2vw;
			background-color : transparent;	
			height : 4vw;
			width : 40vw;
			font-size : 3.6vw;
			color : grey;
		}

		input.grey {
			border-bottom-color : rgb(80, 80, 80);
		}

a.action, label.action {
	display : block;
	margin-top : 1vw;
	margin-left : auto;
	margin-right : auto;
	margin-bottom : 0.5vw;
	width : 30vw;
	color : grey;
	font-size : 3.5vw;
	border-radius : 2vw;
	padding : 1.8vw;
	background-color : rgb(20, 20, 20);
	text-decoration : none;
}

a.action {
	text-align : center;
}

		a.action:hover, label.action:hover {
			cursor : pointer;
			color : white;
		}

		a#create {
			margin-top : -4vw;
		}

a.message {
	display : block;
	margin-top : 2vw;
	visibility : hidden;
	color : red;
}

img.check {
	vertical-align : -0.25vw;
	margin-top : 5vw;
	margin-right : 0.5vw;
	margin-top : 2vw;
	width : 4vw;
}	


/************************************************ SCROLL ***********************************************/

img#page_back {
	position: fixed;
	z-index : 5;
	bottom : 4vw;
	left : 4vw;
}

img#page_up {
	position: fixed;
	z-index : 50;
	bottom : 0vw;
	left : 50%;
	width : 20vw;
 	margin-left: -10vw;
}


/************************************************ FOOTER ***********************************************/

div#footer {
	display : none;
	background-color : white;
	position : relative;
	padding-top : 6vw;
	height : 30vw;
	text-align : center;
	box-shadow : 0vw -2vw 2vw 0vw #999;
}

a#info_footer {
	color : rgb(60, 60, 60);
}

ol#footer_list {
	list-style-type : none;
	padding-left : 0vw; 
	margin-left : 0vw;
}

		ol#footer_list li { 
			display : inline;
			padding-left : 4vw; 
			padding-right : 4vw; 
		}

		.item_footer {
			color : grey; 
			text-decoration : none;
		}

}