/* For smartphone----------------------------- */
@media only screen and (max-width: 1100px) {

/* Section */
section
{
	width:100%;

	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-items:center;
}

.section_container
{
	width:100%;

	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}

.bloc_section
{
	width:100%;
}

.bloc_section img
{
	width:100%;
	height:auto;
}

.bloc_section:nth-child(1)
{
	width:90%;
	padding:5% 0 2% 0;
	text-align: center;
}

.bloc_section:nth-child(2)
{
	display:flex;
	flex-direction:column;
	justify-content:space-around;
	align-items:center;

	text-align: center;
	margin:5% 0 5% 0;
	padding:5% 0 5% 0;
}

.sub_section_photo
{
	display:flex;
	flex-direction:column;
	justify-content:space-around;
	align-items:center;
}

.nom_famille
{
	font-weight: bold;
}

.generation
{
	font-style: italic;
}

.photo
{
	width:100%;
}

/* Bloc 3/4/7/8 - Chapter I/II/III/IV */
.bloc_section:nth-child(3), .bloc_section:nth-child(4), .bloc_section:nth-child(7), .bloc_section:nth-child(8)
{
	width:90%;
	padding:5% 0 5% 0;

	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-items: center;
}

.sub_section
{
	width:90%;
	padding:5% 0 5% 0;
}

.sub_section a
{
	text-decoration:none;
	color: rgb(81,109,117); /* Color 6 - Blue */
}

.sub_section a:hover
{
	text-decoration: underline;
}

.sub_section img
{
	width:100%;
	height:auto;
	box-shadow: 5px 5px 5px #aaaaaa;
}

/* Bloc Section 5 - Background Image */
.bloc_section:nth-child(5)
{
	background-image: url("../photos/pierre_philippe_person_2.jpg");

	/* Full height */
	height: 300px;
	width:90%;

	/* Center and scale the image nicely */
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

/* Bloc Section 6 - Main Title */
.bloc_section:nth-child(6)
{
	padding:10% 0 5% 0;
	text-align:center;
	width:90%;
}

}

/* For desktop----------------------------- */
@media only screen and (min-width: 1100px) {

/* Slideshow Container */
.slideshow_container
{
	background-image: url("../photos/slideshow_histoire.jpg");
}

/* Nav */
.dropdown:nth-child(1) a
{
	color: rgb(81,109,117); /* Color 6 - Blue*/
	font-weight: bold;
	background-color: rgba(255,255,255,1);
}

/* Section */
section
{
	width:100%;

	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-items:center;
}

.section_container
{
	width:100%;

	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}

.bloc_section
{
	width:100%;
}

/* Bloc Section 1 - Main Title */
.bloc_section:nth-child(1)
{
	padding:4% 0 2% 0;
	text-align:center;
}

/* Bloc Section 2 */
.bloc_section:nth-child(2)
{
	display:flex;
	flex-direction:column;
	justify-content:space-around;
	align-items:center;

	text-align: center;

	padding:5% 0 10% 0;
	width:100%;
}

.sub_section_photo
{
	display:flex;
	flex-direction:row;
	justify-content:space-around;
	align-items:center;
	width:100%;
}

.sub_section a
{
	text-decoration:none;
	color: rgb(81,109,117); /* Color 6 - Blue */
}

.sub_section a:hover
{
	text-decoration: underline;
}

.nom_famille
{
	font-weight: bold;
}

.generation
{
	font-style: italic;
}

.photo
{
	width:20%;

    -webkit-transition: all 1s ease; /* Safari and Chrome */
    -moz-transition: all 1s ease; /* Firefox */
    -ms-transition: all 1s ease; /* IE 9 */
    -o-transition: all 1s ease; /* Opera */
    transition: all 1s ease;
}

.photo:hover 
{
    -webkit-transform:scale(1.1); /* Safari and Chrome */
    -moz-transform:scale(1.1); /* Firefox */
    -ms-transform:scale(1.1); /* IE 9 */
    -o-transform:scale(1.1); /* Opera */
     transform:scale(1.1);
}

.photo img
{
	max-width:100%;
	height:auto;
}

/* Bloc 3/4/7/8 - Chapter I/II/III/IV */
.bloc_section:nth-child(3), .bloc_section:nth-child(4), .bloc_section:nth-child(7), .bloc_section:nth-child(8)
{
	display:flex;
	justify-content:space-around;
	flex-direction:row;
	align-items:center;
	padding:5% 0 5% 0;
}

.sub_section
{
	width:40%;
}

.sub_section img
{
	width:100%;
	height:auto;
	box-shadow: 5px 5px 5px #aaaaaa;
}

/* Bloc Section 5 - Background Image */
.bloc_section:nth-child(5)
{
	background-image: url("../photos/pierre_philippe_person_2.jpg");

	/* Set a specific height */
	min-height: 600px; 

	/* Create the parallax scrolling effect */
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

/* Bloc Section 6 - Main Title */
.bloc_section:nth-child(6)
{
	padding:4% 0 2% 0;
	text-align:center;
}

}