/* 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 5/8/9 - Main Title */
.bloc_section:nth-child(5), .bloc_section:nth-child(8), .bloc_section:nth-child(9)
{
	padding:10% 0 5% 0;
	text-align:center;
	width:90%;
}

/* Bloc 2/3/6/7/9 - Chapter I/II/III/IV/V */
.bloc_section:nth-child(2), .bloc_section:nth-child(3), .bloc_section:nth-child(6), .bloc_section:nth-child(7), .bloc_section:nth-child(10)
{
	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 4 - Background Image */
.bloc_section:nth-child(4)
{
	background-image: url("../photos/gd.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 8 - Background Image */
.bloc_section:nth-child(8)
{
	background-image: url("../photos/2024_London_Pierre_Person.jpg");
	
	/* Full height */
	height: 300px;
	width:90%;

	/* Center and scale the image nicely */
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

}

/* For desktop----------------------------- */
@media only screen and (min-width: 1100px) {

/* Slideshow Container */
.slideshow_container
{
	background-image: url("../photos/slideshow_clients.jpg");
}

/* Nav */
.dropdown:nth-child(5) 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/5/9 - Main Title */
.bloc_section:nth-child(1), .bloc_section:nth-child(5), .bloc_section:nth-child(8), .bloc_section:nth-child(9)
{
	padding:4% 0 2% 0;
	text-align:center;
}


/* Bloc 2/3/6/7/10 - Chapter I/II/III/IV/V */
.bloc_section:nth-child(2), .bloc_section:nth-child(3), .bloc_section:nth-child(6), .bloc_section:nth-child(7), .bloc_section:nth-child(10)
{
	display:flex;
	justify-content:space-around;
	flex-direction:row;
	align-items:center;
	padding:5% 0 5% 0;
}

.sub_section
{
	width:40%;
}

.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;
}

.sub_section:nth-child(2) img
{
	box-shadow: 5px 5px 5px #aaaaaa;
}

/* Bloc Section 4 - Background Image */
.bloc_section:nth-child(4)
{
	background-image: url("../photos/gd.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 8 - Background Image */
.bloc_section:nth-child(8)
{
	background-image: url("../photos/2024_London_Pierre_Person.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;
}

}
