#div_ancre_albums
{
	position: relative;
	top: -48px;
}

.hidden_div
{
	display: none;
}

/*****************************************/
/************** Navigation ***************/
/*****************************************/
.div_nav
{
	font-size: 12px;
	width: 1000px;
	margin: auto;
	padding-left: 20px;
}

.a_nav
{
	color: black;
	text-decoration: underline;
}

.a_nav:hover
{
	text-decoration: none;
}

.img_arrow_link
{
	margin-left: 10px;
	margin-right: 10px;
	width: 17px;
}

.div_next_prev_links
{
	width: 100%;
	padding-top: 20px;
}

.div_next_prev_links a
{
	text-decoration: underline;
}

.div_next_prev_links a:hover
{
	text-decoration: none;
}

.div_prev_link
{
	float: left;
	margin-left: 30px;
}

.div_next_link
{
	float: right;
	margin-right: 30px;
}

#div_back_to_top
{
	width: 100%;
}

#div_back_to_top_a
{
	float: right;
	margin-right: 30px;
}

.arrow_top
{
	width: 25px;
}



/*****************************************/
/********** Single album mode ************/
/*****************************************/
#div_single_album
{
	width: 1000px;
	margin: auto;
	margin-bottom: 20px;
	text-align: center;
	padding-bottom: 40px;
	border-radius: 30px;
}

.a_h2_album
{
	color: black;
}

.img_cover_album
{
	height: 500px;
}

.img_cover_album:hover
{
	cursor: pointer;
}

#div_message_album
{
	width: 800px;
	text-align: justify;
	margin: auto;
	margin-top: 50px;
}

.new_date_in_message
{
	font-size: 18px;
	margin-left: 20px;
	margin-bottom: -20px;
}

.full_div_mini_pictures_album
{
	display: inline-block;
	margin: 10px 20px 10px 20px;
	line-height: 0px;
}

.mini_pictures_album
{
	font-size: 10px;
	line-height: 0px;
	
	-moz-transition: all .4s ease;
    -webkit-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

.mini_pictures_album:hover
{
	cursor: pointer;
	transform: scale(1.1);
}

.icon_message
{
	position: relative;
	top: 5px;
	right: 25px;
	margin-right: -20px;
	vertical-align: top;
	width: 20px;
}

.trash_icon_mini_pictures
{
	position: relative;
	top: -40px;
	width: 30px;
	margin-bottom: -30px;
}

.form_modify_message, .form_modify_image_cover
{
	display: none;
}

.div_display_form_modify_message, .div_display_form_modify_image_cover
{
	font-style: italic;
	margin-top: 8px;
	margin-bottom: 8px;
}

.div_display_form_modify_message:hover, .div_display_form_modify_image_cover:hover
{
	cursor: pointer;
}

.button_check
{
	width: 25px;
	position: relative;
	top: 10px;
}

#textarea_message_cover_modified
{
	width: 800px;
	height: 100px;
}

/* Commentaires */

#comments_album
{
	margin-top: 20px;
}

.div_comment, .div_comment_new_com
{
	width: 800px;
	margin: auto;
	margin-top: 20px;
	margin-bottom: 20px;
	border-left: 2px black solid;
	border-bottom: 2px black solid;
	border-radius: 30px;
	padding-bottom: 10px;
	padding-top: 10px;
}

.div_nom_comment
{
	font-size: 18px;
	margin-left: 20px;
	text-align: left;
}

.span_date_comment
{
	font-size: 12px;
}

.div_message_comment
{
	color: rgb(60,60,60);
	margin-right: 20px;
	margin-left: 20px;
	text-align: justify;
}

#message_comment
{
	width: 97%;
	text-align: justify;
}

.icon_plus
{
	width: 25px;
}


/*****************************************/
/********* Multiple album mode ***********/
/*****************************************/
#div_no_photo
{
	width: 1000px;
	margin: auto;
	text-align: center;
}

.div_album_by_country
{
	width: 1000px;
	margin: auto;
	text-align: center;
	padding-bottom: 10px;
}

.div_album
{
	color: white;
	background-image: linear-gradient(to top, rgba(200,200,200, 0), rgb(85,85,85) 100px);
	display: inline-block;
	margin: 20px 10px 20px 10px;
	padding-bottom: 10px;
	
	-moz-transition: all .4s ease;
    -webkit-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

.div_album:hover
{
	transform: scale(1.1);
}

.div_titre_album
{
	text-align: left;
	margin-left: 10px;
	font-size: 20px;
}

.div_date_album
{
	text-align: right;
	margin-right: 10px;
	font-size: 15px;
	color: black;
}

.trash_icon
{
	position: relative;
	top: 5px;
	width: 25px;
}

.icon_add_album
{
	width: 50px;
	padding-top: 20px;
}

.div_titre_add_album
{
	text-align: center;
	font-size: 20px;
	padding-left: 10px;
	padding-right: 10px;
}


/*****************************************/
/**************** Overlay ****************/
/*****************************************/
#div_overlay
{
	position: fixed;
	top: 48px;
	z-index: 4;
	background-color: rgba(20,20,20,0.9);
	height: 100%;
	width: 100%;
	display: none;
	text-align: center;
	vertical-align: middle;
}

#box_in_overlay
{
	margin: auto;
	margin-top: 10px;
}

#box_data_overlay
{
	color: rgb(200,200,200);
	position: relative;
	top: -5px;
	background-color: rgba(10,10,10,0.6);
	padding: 10px;
	text-align: center;
}

#div_mini_in_overlay_full_length
{	
	position: fixed;
	bottom: 20px;
	width: 100%;
}

#div_nav_img_in_overlay
{
	max-height: 200px;
	width: 750px;
	margin: auto;
	text-align: center;
	overflow-y: hidden;
}

.div_arrow_overlay
{
	display: inline-block;
	vertical-align: middle;
	margin: 20px;
}

#div_mini_in_overlay
{
	display: inline-block;
	vertical-align: middle;
	width: 600px;
	max-height: 200px;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
}

.img_nav_overlay
{
	width: 35px;
	display: inline;
}

.img_nav_overlay:hover
{
	cursor: pointer;
}

.mini_img_in_overlay
{
	display: inline;
	height: 70px;
	margin-left: 5px;
	margin-right: 5px;
	margin-bottom: 20px;
	border: 6px solid rgba(255,255,255,0);

	-moz-transition: all .4s ease;
    -webkit-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

.mini_img_in_overlay:hover
{
	cursor: pointer;
	transform: scale(1.1);
}






/***********************************************************************************************************************************/
/********************************************************** CSS MINI ***************************************************************/
/***********************************************************************************************************************************/
@media screen and (max-width: 720px)
{
	#div_no_photo, .div_album_by_country, #div_single_album
	{
		width: 100%;
	}
	
	.div_comment, .div_comment_new_com, .div_nav
	{
		width: 90%;
	}
	
	#div_message_album
	{
		width: 90%;
	}
	
	.div_album:hover, .mini_pictures_album:hover
	{
		transform: scale(1.0);
	}
	
	.img_cover_album
	{
		width: 100%;
		height: auto;
	}
	
	
	/********** OVERLAY ******************/
	#div_overlay
	{
		top: 0px;
		height: 100%;
		z-index: 6;
	}
	
	#div_mini_in_overlay_full_length
	{
		bottom: 0px;
	}
	
	#div_mini_in_overlay
	{
		display: none;
	}
	
	#div_nav_img_in_overlay
	{
		width: 100%;
	}
}