/**************************
 *
 * Menu
 *
 **************************/
#commons_header_menu
{
	color: 					#fff;
}

/**************************
 * Ligne sous-menu
 **************************/
.submenu_inner
{
	position:   			relative;
	top:  					10vh;
	width: 					800px;
	margin:  				0 auto;
	-moz-border-radius:		3px;
	-webkit-border-radius:	3px;
	border-radius:			3px;
	overflow:  				hidden;
	box-shadow: 			0 0 8px rgba(0,0,0,.6);
}
.submenu_inner::after
{
	content: 			" ";
	display: 			block;
	clear: 				both;
}

#commons_header_menu_bloc
{
}
#commons_header_menu_bloc::after
{
	content: 			" ";
	display: 			block;
	clear: 				both;
}

#commons_header_submenu_bloc
{
	position: 			relative;
	z-index: 			1000;
}
#commons_header_submenu_bloc::after
{
	content: 			" ";
	display: 			block;
	clear: 				both;
}

.commons_header_submenu_item
{
	position: 			fixed;
	top:  				0;
	left:  				0;
	right:  			0;
	bottom:  			0;
	display:  			none;
	background-color:  	rgba(0,0,0,.65);
	margin:  			0 auto;
	-webkit-transition:	all .2s ease-out;
	-moz-transition:	all .2s ease-out;
	-o-transition:		all .2s ease-out;
	transition:			all .2s ease-out;
}
.commons_header_submenu_item.visible
{
	display:  			block;
}
.commons_header_submenu_bloc::after
{
	content: 			" ";
	display: 			block;
	clear: 				both;
}

.commons_submenu_close
{
	position:  				absolute;
	top:  					25px;
	right:  				10px;
	width:  				48px;
	height:  				48px;
	background-image: 		url(../images/commons/close.svg);
	background-position:	center center;
	background-repeat: 		no-repeat;
	background-size:  		32px;
	cursor:  				pointer;
	-webkit-transition:	all .2s ease-out;
	-moz-transition:	all .2s ease-out;
	-o-transition:		all .2s ease-out;
	transition:			all .2s ease-out;
}

.commons_submenu_close:hover
{
	transform: 			rotate(180deg);
}

/*************************************
 * Submenu > Bloc Top
 *************************************/
.commons_submenu_title
{
	position:  				relative;
	font-size:  			20pt;
	font-weight:  			600;
	color:  				#fff;
	text-align:   			center;
	padding:  				30px 0;
	height:   				100px;
}
.commons_submenu_title span
{
	background-position:	left;
	background-repeat: 		no-repeat;
	padding:  				20px;
	padding-left:  			60px;
	background-position:	left;
	background-repeat: 		no-repeat;
	background-size:  		48px;
}
.commons_submenu_title i
{
	position:   		absolute;
	left:  				0;
	right:  			0;
	bottom:  			4px;
	font-size:   		8pt;
	font-style:  		normal;
	font-weight:  		300;
	color:   			#fff;
}

.paillote .commons_submenu_title 	{ background-color: #BB2958; }
.restaurant .commons_submenu_title 	{ background-color: #40BFC4; }
.rooftop .commons_submenu_title 	{ background-color: #50C49C; }
.agenda .commons_submenu_title 		{ background-color: #EDA929; }


.paillote .commons_submenu_title span	{ background-image: url(../images/icon/default_paillote.svg); 	}
.restaurant .commons_submenu_title span	{ background-image: url(../images/icon/default_restaurant.svg); 	}
.rooftop .commons_submenu_title span	{ background-image: url(../images/icon/default_rooftop.svg); 	}
.agenda .commons_submenu_title span		{ background-image: url(../images/icon/default_agenda.svg); 		}


.commons_submenu_localisation
{
	padding:  			15px 30px;
	background-color:  	#fff;
}
.commons_submenu_localisation::after
{
	content: 			" ";
	display: 			block;
	clear: 				both;
}

	.commons_submenu_geolocalizeme
	{
		float: 					left;
		width:  				45%;
		padding:  				20px 0;
		font-size:  			14pt;
		font-weight:  			500;
		color:  				#777;
		background-image: 		url(../images/icon/pin.svg);
		background-position:	left;
		background-repeat: 		no-repeat;
		background-size:  		32px;
		padding:  				10px;
		padding-left:  			40px;
		cursor:  				pointer;
	}
	.commons_submenu_search
	{
		float: 			right;
		width:  		50%;
	}
		.commons_submenu_search_input
		{
			background-color:  		#f4f4f4;
			font-size:  			14pt;
			color:  				#777;
			width:  				100%;
			border:  				0;
			background-repeat:  	no-repeat;
			background-image: 		url(../images/commons/search.svg);
			background-position:	99% 50%;
			padding:  				15px;
			padding-right:  		40px;
			-moz-border-radius:		3px;
			-webkit-border-radius:	3px;
			border-radius:			3px;
		}


/**************************
 * Semi-bloc COUNTRY
 **************************/
.commons_submenu_country_bloc
{
	float: 				left;
	position:  			relative;
	z-index:  			1;
	width: 				50%;
	background-color: 	#fff;
	height: 			60vh;
	overflow-y: 		auto;
	-webkit-overflow-scrolling: touch;
	box-shadow:  		0 4px 4px rgba(0,0,0,.3);
}
.commons_menu_country_item:link,
.commons_menu_country_item:hover,
.commons_menu_country_item:active,
.commons_menu_country_item:visited
{
	display: 			block;
	color: 				#777;
	font-size: 			12pt;
	font-weight: 		500;
	padding: 			8px 30px;
	border-top: 		1px solid rgba(0,0,0,.05);
	text-decoration: 	none;
}
.commons_menu_country_item:hover
{
	background-color: 	#f3f3f3;
}
.commons_menu_country_item.selected:link,
.commons_menu_country_item.selected:hover,
.commons_menu_country_item.selected:active,
.commons_menu_country_item.selected:visited
{
	font-weight: 		600;
	background-color: 	#E5E5E5;
}

.commons_menu_country_item:link span,
.commons_menu_country_item:hover span,
.commons_menu_country_item:active span,
.commons_menu_country_item:visited span
{
	font-size: 			10pt;
	opacity: 			0.5;
}

.commons_menu_country_item span.desktop
{
	display: 			inline;
}

.commons_menu_country_item span.country_flag.desktop
{
	position: 			relative;
	top: 				5px;
	display: 			inline-block;
	width: 				24px;
	height: 			24px;
	background-size: 	contain;
	opacity: 			1;
	margin-right: 		8px;
}



/**************************
 * Semi-bloc AREA
 **************************/
.commons_submenu_area_bloc
{
	float: 				right;
	width: 				50%;
	background-color: 	#f2f2f2;
	height: 			60vh;
	overflow-y: 		auto;
	-webkit-overflow-scrolling: touch;
}
.commons_menu_area
{
	display: 			none;
}
.commons_menu_area.visible
{
	display: 			block;
}
.commons_submenu_country_title,
.commons_submenu_area_title
{
	padding: 			20px 15px;
	font-size: 			16pt;
	font-weight: 		600;
	color: 				#777;
	background-color:  	#eaeaea;
}

.commons_menu_area_item_obf,
.commons_menu_area_item:link,
.commons_menu_area_item:hover,
.commons_menu_area_item:active,
.commons_menu_area_item:visited
{
	display: 			block;
	color: 				#777;
	font-size: 			12pt;
	font-weight: 		400;
	padding: 			8px 15px;
	border-top: 		1px solid rgba(0,0,0,.1);
	text-decoration: 	none;
	cursor:  			pointer;
}

.commons_menu_area_item_obf:hover,
.commons_menu_area_item:hover
{
	background-color: 	#fff;
}
.commons_menu_area_item_obf span,
.commons_menu_area_item:link span,
.commons_menu_area_item:hover span,
.commons_menu_area_item:active span,
.commons_menu_area_item:visited span
{
	font-size: 			10pt;
	opacity: 			0.5;
}

.commons_menu_area_access
{
}
.commons_menu_area_access::after
{
}

.commons_menu_area_access_page_presentation:link,
.commons_menu_area_access_page_presentation:hover,
.commons_menu_area_access_page_presentation:active,
.commons_menu_area_access_page_presentation:visited,
.commons_menu_area_access_allpaillote:link,
.commons_menu_area_access_allpaillote:hover,
.commons_menu_area_access_allpaillote:active,
.commons_menu_area_access_allpaillote:visited
{
	display: 				block;
	color: 					#fff;
	font-size: 				12pt;
	font-weight: 			500;
	padding: 				15px 15px;
	border-top: 			1px solid rgba(0,0,0,.1);
	text-decoration: 		none;
	background-image: 		url(../images/icon/menu_arrow.svg);
	background-position: 	10px 50%;
	background-repeat: 		no-repeat;
	background-size: 		24px;
	padding-left: 			45px;
}
.commons_menu_area_access_page_presentation:link,
.commons_menu_area_access_page_presentation:hover,
.commons_menu_area_access_page_presentation:active,
.commons_menu_area_access_page_presentation:visited
{
	background-color: 		#696969;
}
.commons_menu_area_access_allpaillote:link,
.commons_menu_area_access_allpaillote:hover,
.commons_menu_area_access_allpaillote:active,
.commons_menu_area_access_allpaillote:visited
{
	background-color: 		#8b8b8b;
}
.commons_menu_area_access_page_presentation:hover,
.commons_menu_area_access_allpaillote:hover
{
	background-color: 	#444;
}




@media only screen /* Smartphone Horizontal */
and (max-width : 700px)
{
	.commons_submenu_country_title,
	.commons_submenu_area_title
	{
		font-size:   		13pt;
	}

	.commons_menu_country_item:link,
	.commons_menu_country_item:hover,
	.commons_menu_country_item:active,
	.commons_menu_country_item:visited
	{
		font-size: 			11pt;
		font-weight: 		500;
		padding: 			8px 10px;
		border-top: 		1px solid rgba(0,0,0,.05);
		text-decoration: 	none;
	}

	.commons_menu_area_item:link,
	.commons_menu_area_item:hover,
	.commons_menu_area_item:active,
	.commons_menu_area_item:visited
	{
		font-size: 			11pt;
		font-weight: 		400;
		padding: 			8px 10px;
	}

	.commons_menu_area_access_page_presentation,
	.commons_menu_area_access_allpaillote
	{
		font-size: 			11pt;
		font-weight: 		400;
		padding: 			2px 10px;
	}
	.commons_menu_area_access_page_presentation:hover,
	.commons_menu_area_access_allpaillote:hover
	{

	}
	.commons_submenu_list
	{
		position:   		relative;
		-webkit-perspective: 	right;
		perspective-origin: 	top;
	}
	.commons_submenu_list::after
	{
		content: 			" ";
		display: 			block;
		clear: 				both;
	}
	.commons_submenu_country_bloc
	{
		position:  			relative;
		float:   			none;
		width:  			100%;
		height:  			60vh;
	}
	.commons_submenu_country_bloc.wait
	{
		overflow:    		hidden;
	}
	.commons_submenu_country_bloc.wait .mask
	{
		position:  			fixed;
		top:  				0;
		left:  				0;
		right:  			0;
		bottom:  			0;
		background-color:  	rgba(0,0,0,.8);
		cursor:   			pointer;
	}
	.commons_submenu_area_bloc
	{
		float:  			none;
		width:  			80%;
		height:  			60vh;
		margin-left:  		20%;
		opacity:     		0.2;
		transform: 			rotateY(99.5deg);
		-webkit-transition:	all .2s ease-out;
		-moz-transition:	all .2s ease-out;
		-o-transition:		all .2s ease-out;
		transition:			all .2s ease-out;
		box-shadow:  		-3px 5px 6px rgba(0,0,0,0.2);
	}
	.commons_submenu_area_bloc.visible
	{
		position:   		absolute;
		transform: 			rotateY(0deg);
		z-index:  			1000;
		top:  				0;
		left:  				0;
		right:  			0;
		bottom:  			0;
		opacity:  			1;
	}
}