/* ------------------- Général --------------------*/

body {
	/*max-width: 1500px;*/

	margin: 0px;
	padding: 0px;

	font-family: "Dotum", sans-serif;
}

section, a {
	margin: 0px;
	padding: 0px;

	text-decoration: none;
	color: inherit;
}


ul {
	list-style-type: none;
	text-align: center;
	padding: 0px;
}


li {
	padding: 0px;
	margin: 10px;

	font-weight: bold;
	font-size: 110%;
}

h1,h2,h3,h4,h5,p {
	text-align: center;
	font-size: 140%;
	font-weight: lighter;
}
h1,h2,h3 {
	text-transform: uppercase;
}
.souligne {
	margin-left: 10%;
	margin-right: 10%;
	padding: 10px 20px;
	border-bottom: 1px solid black ;
}

.justifie {
	text-justify: auto;
}

.flex {
	display: flex;
}

.full_place {
	display: block;
	height: 100%;
}

.selec_degrad:hover {
	background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.5));
}

.selec_souli_blanc:hover {
	color: inherit;
	text-decoration: underline;
}

.gris {
	background-color: rgba(100,100,100,0.8);	
}

.img_c_c {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.img_contain {
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

  /* photo 1-2 */
.pht_1-2 {
	margin-top: 5px;
	height: 120vh;
	display: flex;
}
.pht_1-2 > div {
	height: 100%;
	width: calc(50% - 2.5px);
}
.pht_1-2 div div {
	height: calc(50% - 2.5px);
}
.pht_1-2 div  div + div {
	margin-top: 5px;
}
.pht_1-2 > div+div {
	margin-left: 5px;
}
@media screen and (max-width : 600px) {
	.pht_1-2 {
		display: block;
		height: unset;
	}
	.pht_1-2 div, .pht_1-2 > div+div {
		width: 100%;
		height: 90vh;
		margin: 5px 0px 0px 0px;
	}
}

/* description */
.description-g, .description-d {
	display: flex;

	margin-top: 5px;
}
.description-g div { 
	margin-right: 5%;
	margin-left: 10%;

	padding: 25px 0px;
	width: 25%;

	text-align: right;
}
.description-g div + div {
	margin: 0px;
	padding: 0px;
	width: 60%; 
}
.description-d div {
	width: 60%;
	margin: 0px;
}
.description-d div + div {
	margin-right: 10%;
	margin-left: 5%;

	padding: 25px 0px;
	width: 25%;

	text-align: left;
}

.description-g ul, .description-d ul {
	text-align: inherit;
}

@media screen and (max-width: 600px) {
	.description-d, .description-g {
		display: block;
	}

	.description-d div, .description-g div {
		display: block;

		width: unset !important;
		min-height: 230px;
		padding: 25px 30px 0px !important;
		margin: 0px !important;
	}
	.description-d ul, .description-g ul {
		text-align: center;
	}
}


/* -------------------- Design de l'en-tête ------------------ */

header {
	position: fixed;
	top: 0;

	width: 100%;
	padding: 0px;
	margin: 0px;

	background: rgba(0, 0, 0, 0.6);

	text-transform: uppercase;
}

header > * {
	margin: 0px;
	padding: 0px;
	color: white;
}

#logo {
	display: block;
	height: max(15vh, 80px);
	margin: 10px 0px;

	background-image: url("images_chalet/logo_taupe.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

#choix_langue {
	position: absolute;
	right: 20px;
	top: 10px;
}
#choix_langue * {
	margin: 0px;
	padding: 3px 5px;

	text-transform: none;
}

header > p {
	font-size: 100%;
}

header nav {
	margin: auto;
}

nav button {
	display: none;

	padding: 0px;
	margin: 0px 40%;
	border: none;
	width: 20%;

	background-color: inherit;
	color: inherit;
	text-transform: uppercase;
	font-size: 130%;
	font-weight: lighter;
}
nav button:hover {
	background-color: rgba(100, 100, 100, 0.8);
}

header ul {
	margin: 5px;
}

header li{
	display: inline-block;
	margin: 10px 0px 0px 0px;
	font-weight: unset;
}

header a {
	padding: 5px 20px;
	margin: 0px;

	color: white;
	font-size: 150%;
	text-decoration: none;
}


header a:hover {
	background-color: rgba(100,100,100,0.8);
}

@media screen and (max-width: 800px) {
	nav {
		padding-top: 10px;
	}

	nav button {
		display: block;
	}
	nav ul {
		display: none;
		position: absolute;
		margin: 0px;
		padding: 0px 15px 5px;
		max-height: calc(100vh - 157px);
		text-align: left;

		background-color: rgba(0, 0, 0, 0.6);

		overflow: scroll;
	}	

	nav li {
		width: 100%;
		margin-top: 10px;
		float: left;
	}
	nav a {
		display: block;
	}
}
@media screen and (min-width: 800px) {
	nav ul {
		display: block !important;
	}
}

/* -------------------- Design du footer ------------------ */

footer {
	margin: 0px;
	margin-top: 5px;
	padding: 30px 0px 0px 0px;
	background-color: black;

	text-align: center;
	color: white;
}

footer ul {
	margin: 0px;
}

footer a {
	text-decoration: underline;
}


footer li {
	display: inline-block;
	margin: 0px;

	width: 30%;
}
@media screen and (max-width: 840px) {
	footer li {
		width: 100%;
	}
}

#brochure {
	display: none;
}

#brochure a {
	display: inline-block;
	margin: 5px 20px;

	max-width: 300px;

	font-size: 90%;
	text-transform: uppercase;
	text-decoration: none;
	background-color: rgb(100, 100, 100);
}
#brochure a:hover {
	background-color: rgb(200, 200, 200);
	color: black;
}


/* -------------------- Design du main - général ------------------ */

main {
	margin: 0px;
	padding: 0px;
}

section:first-child {
	height: 100vh;
	box-sizing: border-box;
	padding: 70vh 0px 0px;

	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
	
	color: white;
	font-size: 200%;
	text-shadow: white 2px 2px 5px;
	text-transform: uppercase;
}

/*-------------------------------------------------------------------------------------------------------------------*/

/* -------------------- Design du main - accueil ------------------ */

#image_entrée {
	height: 130vh;

	background-image: url("images_chalet/Espaces_vie/salon.jpg");
	background-attachment: scroll;
}

#description p {
	margin: 0px;
	padding: 10px 10%;

	font-size: 120%;
	line-height: 200%;
}

#photo_chalet{
	display: flex;
}
	#photo1 {
		height: 80vh;
		width: 50%;
		padding: 0px;
		margin: 0px;

		background-image: url("images_chalet/Chambres/master_vue.jpg");
	}

	#photo2 {
		height: 80vh;
		width: 50%;
		padding: 0px;
		margin: 0px;

		background-image: url("images_chalet/Equipements/piscine.jpg");
	}

#chiffres li {
	display: inline-block;
	margin: 30px 5%;
}

#hub_photo li {
	display: inline-grid;

	margin: 5px 3px;
	width: max(calc((100vw - 5vw)/4), 175px) ;
	height: max(calc((100vw - 5vw)/4), 175px);
	min-width: 30px;
	min-height: 30px;
	color: white;
}

#hub_photo li a {
	display: grid;

	align-items: center;
}


#hub_photo li p {
	height: 20px;
	margin: 0px;

	text-transform: uppercase;
	color: white;
	font-size: 120%;
	font-weight: lighter;
}

#accueil_photo_vue_ext {
	background-image: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0.5)), url("images_chalet/Vue_exterieur/dent_villard.jpg");
}
#accueil_photo_chambres {
	background-image: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0.5)),url("images_chalet/Chambres/oreiller.jpg");
}
#accueil_photo_espaces_vie {
	background-image: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0.5)),url("images_chalet/Espaces_vie/entree.jpg");
}
#accueil_photo_spa {
	background-image: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0.5)),url("images_chalet/Equipements/salle_sport.jpg");
}

/* -------------------- Design du main - equipements --------------- */

#equipements {
	background-image: url("images_chalet/Equipements/piscine.jpg");
}

#photo_master_lit {
	background-image: url("images_chalet/Chambres/master_lit.jpg");
}

#photo_salle_manger {
	background-image: url("images_chalet/Espaces_vie/salle_manger.jpg");
}

#photo_sport {
	background-image: url("images_chalet/Equipements/salle_sport.jpg");
}

#photo_cine {
	background-image: url("images_chalet/Equipements/salle_cine.jpg");
}

/* -------------------- Design du main - galerie ------------------ */

#galerie {
	background-image: url("images_chalet/Vue_exterieur/terrasse (2).jpg");
}

/* -------------------- Design du main - contact ------------------- */

#contact {
	background-image: url("images_chalet/Vue_exterieur/irish_vanoise.jpg");
}

#carte {
	display: flex;

	height: 100vh;
}
#carte iframe, #carte div {
	width: 50%;
}
@media screen and (max-width: 1000px) {
	#carte {
		display: block;

		height: auto;
		text-align: center;
	}
	#carte iframe {
		width: 75%;
		height: 75vw;
	}
	#carte div {
		width: 100%;
	}
}

/* -------------------- Design du main - services ------------------ */

#services {
	background-image: url("images_chalet/Chambres/oreiller.jpg");
}

#photo_service_1 {
	background-image: url("images_chalet/Chambres/chambre8.jpg");
}
#photo_service_2 {
	background-image: url("images_chalet/Espaces_vie/salle_manger.jpg");
}
#photo_service_3 {
	background-image: url("images_chalet/Espaces_vie/skiroom.jpg");
}

/* -------------------- Design du main - Vue & Extérieur ------------ */

#vue_ext {
	background-image: url("images_chalet/Vue_exterieur/crepuscule.jpg");
	background-position: top;
}

#photo_vue_1{
	background-image: url("images_chalet/Vue_exterieur/montgolfiere.jpg");
}
#photo_vue_2 {
	background-image: url("images_chalet/Vue_exterieur/dent_villard.jpg");
}
#photo_vue_3 {
	background-image: url("images_chalet/Vue_exterieur/leger_soir.jpg");
}
#photo_vue_7 {
	background-image: url("images_chalet/Vue_exterieur/master_vue.jpg");	
}

#photo_ext_1 {
	background-image: url("images_chalet/Vue_exterieur/chalet_den_bas (3).jpg");
}
#photo_ext_2 {
	background-image: url("images_chalet/Vue_exterieur/terrasse (3).jpg");
}
#photo_ext_3 {
	background-image: url("images_chalet/Vue_exterieur/chalet_den_haut.jpg");
}
#photo_ext_4 {
	background-image: url("images_chalet/Vue_exterieur/chalet_sud.jpg");
}
#photo_ext_5 {
	background-image: url("images_chalet/Vue_exterieur/terrasse (2).jpg");
}
#photo_ext_6 {
	background-image: url("images_chalet/Vue_exterieur/logo_ext.jpg");
}
#photo_ext_7 {
	background-image: url("images_chalet/Vue_exterieur/terrasse.jpg");
}
#photo_ext_8 {
	background-image: url("images_chalet/Equipements/sauna_bain.jpg");
}
#photo_ext_9 {
	background-image: url("images_chalet/Vue_exterieur/chalet_sud (2).jpg");
}

/* -------------------- Design du main - Chambres ----------------- */

#chambres {
	background-image: url("images_chalet/Chambres/master_lit.jpg");
}

#photo_master_1 {
	background-image: url("images_chalet/Chambres/master_vue (2).jpg");
}
#photo_master_2 {
	background-image: url("images_chalet/Chambres/master_lit (2).jpg");
}
#photo_master_3 {
	background-image: url("images_chalet/Chambres/master_bain (2).jpg");
}
/*
#photo_master_4 {
	background-image: url("images_chalet/Chambres/master_bain.jpg");
}
#photo_master_5 {
	background-image: url("images_chalet/Chambres/master_bain.jpg");
}
#photo_master_6 {
	background-image: url("images_chalet/Chambres/master_bain.jpg");
}
*/
#photo_2_1 {
	background-image: url("images_chalet/Chambres/chambre2.jpg");
}
#photo_2_2 {
	background-image: url("images_chalet/Chambres/bain2.jpg");
}
#photo_2_3 {
	background-image: url("images_chalet/Chambres/chambre2 (2).jpg");
}
#photo_3_1 {
	background-image: url("images_chalet/Chambres/chambre3 (3).jpg");
}
#photo_3_2 {
	background-image: url("images_chalet/Chambres/chambre3.jpg");
}
#photo_3_3 {
	background-image: url("images_chalet/Chambres/bain3.jpg");
}
#photo_4_1 {
	background-image: url("images_chalet/Chambres/chambre9 (2).jpg");
}
#photo_4_2 {
	background-image: url("images_chalet/Chambres/bain.jpg");
}
#photo_4_3 {
	background-image: url("images_chalet/Chambres/chambre9.jpg");
}
#photo_5_1 {
	background-image: url("images_chalet/Chambres/chambre5 (3).jpg");
}
#photo_5_2 {
	background-image: url("images_chalet/Chambres/chambre5.jpg");
}
#photo_5_3 {
	background-image: url("images_chalet/Chambres/chambre5 (2).jpg");
}
#photo_6_1 {
	background-image: url("images_chalet/Chambres/chambre6 (2).jpg");
}
#photo_6_2 {
	background-image: url("images_chalet/Chambres/bain56.jpg");
}
#photo_6_3 {
	background-image: url("images_chalet/Chambres/chambre6.jpg");
}
#photo_7_1 {
	background-image: url("images_chalet/Chambres/chambre7 (2).jpg");
}
#photo_7_2 {
	background-image: url("images_chalet/Chambres/chambre7.jpg");
}
#photo_7_3 {
	background-image: url("images_chalet/Chambres/bain7.jpg");
}

/* -------------------- Design du main - Espaces de vie ------------- */

#espaces_vie {
	background-image: url("images_chalet/Espaces_vie/salon (3).jpg");	
}
#photo_rez_1 {
	background-image: url("images_chalet/Espaces_vie/entree.jpg");	
}
#photo_rez_2 {
	background-image: url("images_chalet/Espaces_vie/salon.jpg");	
}
#photo_rez_3 {
	background-image: url("images_chalet/Espaces_vie/skiroom.jpg");	
}
#photo_rez_4 {
	background-image: url("images_chalet/Espaces_vie/cuisine (2).jpg");	
}
#photo_rez_5 {
	background-image: url("images_chalet/Espaces_vie/salle_manger.jpg");	
}
#photo_rez_6 {
	background-image: url("images_chalet/Espaces_vie/cuisine.jpg");	
}
#photo_rez_7 {
	background-image: url("images_chalet/Espaces_vie/salle_manger (2).jpg");	
}
#photo_rez_8 {
	background-image: url("images_chalet/Espaces_vie/salon (4).jpg");	
}
#photo_rez_9 {
	background-image: url("images_chalet/Espaces_vie/espace_jeu (3).jpg");	
}


/* -------------------- Design du main - Spa & Bien-être ----------- */

#Spa_Bien-etre {
	background-image: url("images_chalet/Equipements/piscine (2).jpg");
}

#photo_spa_1 {
	background-image: url("images_chalet/Equipements/salle_sport.jpg");
}
#photo_spa_2 {
	background-image: url("images_chalet/Equipements/sauna_bain (3).jpg");
}
#photo_spa_3 {
	background-image: url("images_chalet/Equipements/piscine.jpg");
}
#photo_spa_4 {
	background-image: url("images_chalet/Equipements/sauna_bain (2).jpg");
}
#photo_spa_5 {
	background-image: url("images_chalet/Equipements/salle_cine (2).jpg");
}
#photo_spa_6 {
	background-image: url("images_chalet/Equipements/piscine (2).jpg");
}