*
{
	text-decoration: none;
	list-style: none;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    outline: 0; /*contour sur les liens à enlever*/
    border: 0;
}

body
{
	color: white;
	background-color: black;
}

.logo-haut
{
	width: auto;
	/*height: 7.3vh;
	padding-top: 0.4vh;*/
	height: 3.7vw;
	padding-top: 0.2vw;
	transition: all 500ms;
} 

#cercle-noir:hover .logo-haut
{
	width: auto;
	height: 90%;
	margin: 0.5vw;
	transition: all 500ms;
}

#cercle-noir
{
	background-color: rgb(26, 26, 26);
	margin-left: 1.6vw;
	border-radius: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 3.7vw;
	width: 3.7vw;
	transition: all 500ms;
}

#cercle-noir:hover
{
	height: 6vw;
	width: 6vw;
	padding: 0.5vw;
	transition: all 500ms;
}

#header
{
	background-color: rgb(26, 26, 26);
	/*height: 8.4vh;*/
	height: 4.05vw;
	display: flex;
	justify-content: space-between;
	position: fixed;
	width: 100%;
	top: 0;
	z-index: 2;
}

a
{
	color: white;
	font-family: 'Asap', Arial;
}

header a 
{
	height: 100%;
	display: flex;
	align-items: center;
	width: 100%;
}

.bouton-nav
{
	padding-left: 1.1vw;
	padding-right: 1.1vw;
}

nav ul 
{
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 1.2vw;
	padding-right: 1.6vw;
	height: 100%;
}

nav
{
	display: flex;
	align-items: center;
}

nav ul li 
{
	height: 100%;
	transition: all 600ms;
}

nav ul li:hover 
{
	background-color: rgba(255, 255, 255, 0.15);
	transition: all 500ms;
}

nav ul li a
{
	transform: translateY(0);
	transition: transform 300ms ease-in 100ms;
}

nav ul li a:hover
{
	/*margin-bottom: 0.3vw;*/
	transform: translateY(-0.15vw);
	transition: transform 150ms ease-in 50ms;
}

/*#icone-home
{
	width: 1.4vw;
}

#lien-home
{
	background-color: white;
	border-radius: 100%;
	height: 2.6vw;
	width: 2.6vw;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: 0.55vw;
	margin-right: 0.55vw;
}

#parent-home
{
	display: flex;
	align-items: center;
	justify-content: center;
}*/

#menu-burger
{
	display: none;
}



#main 
{
	margin-top: 4.05vw;
	background-color: rgb(99, 69, 148);
}

#haut-main
{
	display: flex;
	align-items: center;
	flex-direction: column;
}

#haut-main h1
{
	font-family: 'Asap', Arial;
	font-size: 5.3vw;
	text-align: center;
	font-weight: normal;
	padding-top: 0.4vw;
}

#img-general
{
	padding-top: 0.66vw;
	display: flex;
	justify-content: center;
	height: 33vw;	
	margin-right: 0;
	position: relative;
}

#barriere
{
	background-color: rgb(26 26 26);
	height: 100%;
	width: 20vw;
	z-index: 0;
	margin-top: 0.66vw;
	top: 0;
	position: absolute;
}

#img-1
{
	clip-path: polygon(0 0, 100% 0, 88% 100%, 0% 100%);
	border: solid rgb(26 26 26)0.4vw;
	border-radius: 2.5vw 0 0 0;
	border-right: 0;
	height: 33vw;
	width: 46.6vw;
	/*background-color: #7271a7;*/
	background-image: url("images/sliders/professionnel/entretien du batiment/entretien-1.jpg");
	background-size: cover;
	margin-right: 46.1vw;
	z-index: 1;
}

#img-2
{
	clip-path: polygon(11% 0, 100% 0, 100% 100%, 0% 100%);
	border: solid rgb(26 26 26)0.4vw;
	border-radius: 0 2.5vw 0 0;
	border-left: 0;
	height: 33vw;
	width: 51.26vw;
	/*background-color: #a77171;*/
	background-image: url("images/sliders/professionnel/entretien du batiment/entretien-2.jpg");
	background-size: cover;
	position: absolute;
	margin-left: 41.5vw;
	z-index: 1;
}

.cartes 
{
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-direction: column;
	padding-top: 3vw;
	overflow: hidden;
	position: relative;
}

.stock-images
{
	display: flex;
	padding-top: 3vw;
	position: absolute;
	transition: left 1.2s ease-out;
}

.bordure-image
{
	position: relative;
	width: 33.3vw;
	height: 55vw;
}

.barre-slider
{
	height: 1.6vw;
	min-width: 10vw;
	max-width: 20vw;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-left: 0.6vw;
	padding-right: 0.6vw;
	border-radius: 10vw;
	position: absolute;
	top: 2.5vw;
	left: 50%;
	transform: translateX(-50%);
	display: none;
}

.selecteur
{
	background-color: rgba(255, 255, 255, 0.5);
	border-radius: 100%;
	height: 0.6vw;
	width: 0.6vw;
	margin-left: 0.2vw;
	margin-right: 0.2vw;
}

.selectionnate
{
	background-color: rgb(255, 255, 255);
	height: 1.2vw;
	width: 1.2vw;
	transition: all 350ms ease-out;
}

.adjselect 
{
	background-color: rgb(255, 255, 255);
	height: 0.9vw;
	width: 0.9vw;
}

.selecteur-fleche
{
	width: 100%;
	height: 100%;
	padding: 0.4vw;
	display: none;
}

.selecteur, .selecteur-fleche
{
	cursor: pointer;
}

.precedent 
{
	left: 36%;
	bottom: 6.4vw;
}

.suivant
{
	right: 36%;
	bottom: 6.4vw;
}


.cartes h1
{
	text-align: center;
	font-size: 2vw;
	font-weight: normal;
	font-family: 'Asap', Arial;
	padding-top: 0.5vh;
	padding-bottom: 0.5vh;
}

.selecteur-fleche:hover 
{
	cursor: pointer;
}

.conteneur-carte
{
	width: 33.3vw;
	display: flex;
	justify-content: center;
}

.carte 
{
	width: 29.6vw;
	background-color: rgba(26, 26, 26, 0.2);
	display: flex;
	align-items: center;
	flex-direction: column;
	border-radius: 1.7vw;
	min-height: 35vw;
	height: fit-content;
}

.conteneur-image
{
	width: 27.7vw;
	height: 16.5vw;
	position: relative;
}

.carre
{
	height: 100%;
	width: 100%;
	border-radius: 0.4vw;
	object-fit: cover;
	object-position: bottom;
}

.cartes p 
{
	font-family: 'Asap', Arial;
	font-size: 1.5vw;
	padding-left: 0.95vw;
	padding-right: 0.95vw;
	padding-top: 1.5vw;
	padding-bottom: 0.95vw;
	font-weight: medium;
	text-align: justify;
	width: 100%;
}

.cartes ul
{
	font-family: 'Asap', Arial;
	font-size: 1.5vw;
	font-weight: medium;
	text-align: justify;
	padding-left: 1.9vw;
	padding-right: 0.95vw;
	width: 100%;
}

.cartes li 
{
	list-style: "- ";
}

#fleche-nava
{
	border-radius: 100%;
	background-color: rgb(130, 69, 229);
	display: flex;
	justify-content: center;
	align-items: center;
	height: 3.2vw;
	width: 3.2vw;
	position: absolute;
	left: 0.4vw;
	transform: translatey(-50%) rotate(180deg);
	animation: bounce-l 0.4s infinite alternate;
	z-index: 1;
	display: none;
}

@keyframes bounce-l
{
	from
	{
		top: 32.5%;
	}
	to
	{
		top: 31.5%;
	}
} 

@keyframes bounce-r
{
	from 
	{
		top: 32.5%;
	}
	to 
	{
		top: 31.5%;
	}
} 

#fleche-nava a
{
	height: 100%;
	width: 100%;
	border-radius: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

#fleche-navb a
{
	height: 100%;
	width: 100%;
	border-radius: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

#fleche-navb
{
	border-radius: 100%;
	background-color: rgb(130, 69, 229);
	display: flex;
	justify-content: center;
	align-items: center;
	height: 3.2vw;
	width: 3.2vw;
	position: absolute;
	top: 50%;
	right: 0.4vw;
	transform: translatey(-50%);
	animation: bounce-r 0.4s infinite alternate;
	z-index: 1;
	display: none;
}

.cta-button 	
{
	display: inline-block;
	background-color: rgb(130, 69, 229);
	padding-left: 1.8em;
	padding-right: 1.8em;
	padding-top: 1em;
	padding-bottom: 1em;
	border-radius: 0.625vw;
	font-weight: bold;
	transition: transform 150ms ease-in 50ms;
}	

.cta-button:hover
{
	transform: translateY(-5px);
	transition: transform 150ms ease-in 50ms;
}


.cta-buttonb 	
{
	display: inline-block;
	background-color: rgb(228, 93, 91);
	padding-left: 1.8em;
	padding-right: 1.8em;
	padding-top: 1em;
	padding-bottom: 1em;
	border-radius: 0.625vw;
	font-weight: bold;
	font-size: 1.4vw;
	font-family: 'Asap', Arial;
	font-weight: bold;
	transition: transform 150ms ease-in 50ms;
}	

.cta-buttonb:hover
{
	transform: translateY(-5px);
	transition: transform 150ms ease-in 50ms;
}


#bouton
{
	display: flex;
	justify-content: center;
	padding-top: 2.2vw;
	padding-bottom: 2.5vw;
}

.fleche 
{
	height: 0.9vw;
	vertical-align: middle;
	padding-bottom: 0.21vh;
	margin-left: 1.1vw;
}



@media screen and (min-width: 3000px)
{
	#footer-general 
	{
		padding-bottom: 1vw;
	}
}

@media screen and (min-width: 500px) and (max-width: 950px)
{

	#header 
	{
		height: 10vw;
		align-items: center;
	}

	#header li a 
	{
		font-size: 2.8vw;
		padding-top: 3.4vw;
		padding-bottom: 3.4vw;
	}

	#main 
	{
		margin-top: 10vw;
	}

	.logo-haut 
	{
		height: 7.4vw;
		padding-left: 1vw;
		transition: none;
	}

	#cercle-noir:hover
	{
		transition: none;
		height: 0;
		width: 0;
		padding: 0;
	}

	#cercle-noir:hover .logo-haut
	{
		width: auto;
		height: 7.4vw;
		margin: 0;
		transition: unset;
	}

	.cta-button 
	{
		font-size: 4vw;
		border-radius: 3.5vw;
		margin-left: 5vw;
	}

	.fleche 
	{
		height: 3vw;
	}

	#footer-principal
	{
		display: flex;
		flex-direction: column;
		width: 85%;
		position: relative;
		padding-bottom: 8vw;
	}

	#footer-principal h2
	{
		font-size: 5.8vw;
	}

	#footer-a 
	{
		width: 100%;
	}

	#footer-b
	{
		width: 100%;
		padding-top: 7vw;
	}

	#footer-c 
	{
		width: 100%;
	}

	#footer-c h2 
	{
		font-size: 7vw;
	}

	.logos-a 
	{
		height: 3vh;
		padding-right: 1.5vw;
	}

	#sous-contact li 
	{
		font-size: 4vw;
		width: 55vw;
		padding-top: 2vw;
	}

	#logo-mail
	{
	margin-top: 0vh;
	}


	#logo-map
	{
	margin-bottom: 1vh;
	}

	#carte 
	{
		width: 100%;
		height: 45vw;
	}

	#sous-reseaux
	{
		width: 100%;
		margin-right: 0;
	}

	#sous-reseaux ul
	{
		display: flex;
		justify-content: center;
		width: 100%;
	}

	.logos-b 
	{
		height: 13vw;
		padding-right: 4vw;
		padding-left: 4vw;
	}

	#mentions
	{
		font-size: 3vw;
		position: absolute;
		bottom: 0;
	}

	.barre-slider
	{
		display: none;
	}

	.bordure-image
	{
		width: 80vw;
		height: 90vw;
	}

	.conteneur-carte 
	{
		width: 80vw;
	}

	.carte 
	{
		width: 60vw;
		min-height: 70vw;
		height: fit-content;
	}

	.conteneur-image
	{
	width: 57.4vw;
	height: 35.84vw;
	position: relative;
	}

	.cartes p
	{
		font-size: 3.2vw;
		padding-left: 1.8vw;
		padding-right: 1.8vw;
		padding-top: 2.5vw;
		padding-bottom: 1.8vw;
	}

	.cartes ul
	{
	font-family: 'Asap', Arial;
	font-size: 3.2vw;
	font-weight: medium;
	text-align: justify;
	padding-left: 3.6vw;
	padding-right: 1.8vw;
	width: 100%;
	}

	.cartes h1
	{
		font-size: 4.3vw;
	}

	#fleche-nava
	{
		height: 13vw;
		width: 13vw;
		left: 2vw;
		display: flex;
	}

	#fleche-navb
	{
		height: 13vw;
		width: 13vw;
		right: 2vw;
		display: flex;
	}

	#fleche-nava img 
	{
		display: block;
	}

	#fleche-navb img 
	{
		display: block;
	}

	.fleche2
	{
		height: 7vw;
	}

	.cta-buttonb
	{
		font-size: 2.6vw;
	}
}

@media screen and (max-width: 500px)
{
	.floute 
	{
		filter: blur(2.6px);
	}

	#menu-burger
	{
		display: block;
		height: 8vw;
		width: 8vw;
		margin-right: 5vw;
		position: relative;
		z-index: 1;
	}

	#menu-burger.banger ~ nav 
	{
		display: block;
	}

	#header  
	{
		height: 12vw;
		display: flex;
		align-items: center;
	}

	#header nav  
	{
		width: 65vw;
		position: absolute;
		right: 0;
		top: 12vw;
		display: none;
	}

		#header nav li:last-child
	{
		border-bottom-left-radius: 30px;

	}

	header ul
	{
		flex-direction: column;
		padding-right: 0;
	}

	header ul li  
	{
		font-size: 4.5vw;
		background-color: rgb(26, 26, 26);
		width: 100%;
	}

	.bouton-nav 
	{
		padding-top: 12vw;
		padding-bottom: 12vw;
		padding-right: 8vw;
		padding-left: 8vw;
		justify-content: center;
	}

	nav ul li:hover 
	{
	background-color: rgb(26, 26, 26);
	transition: unset;
	}

	nav ul li a:hover
	{
	/*margin-bottom: 0.3vw;*/
	transform: unset;
	}

	#main 
	
	{
		margin-top: 12vw;
	}

	.logo-haut
	{
		height: 10vw;
		padding-left: 3vw;
	}

	#cercle-noir:hover .logo-haut
	{
	width: auto;
	height: 10vw;
	margin: 0;
	transition: unset;
	}

	#cercle-noir:hover
	{
	height: 0;
	width: 0;
	padding: 0;
	transition: unset;
	}

	#img-1
	{
		border: solid rgb(26 26 26)1.3vw;
	}

	#img-2
	{
		border: solid rgb(26 26 26)1.3vw;
	}

	.barre-slider
	{
		display: none;
	}

	.bordure-image
	{
		width: 80vw;
		height: 90vw;
	}

	.conteneur-carte 
	{
		width: 80vw;
	}

	.carte 
	{
		width: 60vw;
		min-height: 70vw;
		height: fit-content;
	}

	.conteneur-image
	{
	width: 57.4vw;
	height: 35.84vw;
	position: relative;
	}

	.cartes p
	{
		font-size: 3.2vw;
		padding-left: 1.8vw;
		padding-right: 1.8vw;
		padding-top: 2.5vw;
		padding-bottom: 1.8vw;
	}

	.cartes ul
{
	font-family: 'Asap', Arial;
	font-size: 3.2vw;
	font-weight: medium;
	text-align: justify;
	padding-left: 3.6vw;
	padding-right: 1.8vw;
	width: 100%;
}

	.cartes h1
	{
		font-size: 4.3vw;
	}

	.cta-buttonb 	
	{
		font-size: 4vw;
		border-radius: 3.5vw;
	}

	.cta-button 
	{
		font-size: 4vw;
		border-radius: 3.5vw;
		margin-left: 5vw;
	}

	.fleche 
	{
		height: 3vw;
	}

	#fleche-nava
	{
		height: 13vw;
		width: 13vw;
		left: 2vw;
		display: flex;
	}

	#fleche-navb
	{
		height: 13vw;
		width: 13vw;
		right: 2vw;
		display: flex;
	}

	#fleche-nava img 
	{
		display: block;
	}

	#fleche-navb img 
	{
		display: block;
	}

	.fleche2
	{
		height: 7vw;
	}

	#footer-principal
	{
		display: flex;
		flex-direction: column;
		width: 85%;
		position: relative;
		padding-bottom: 8vw;
	}

	#footer-principal h2
	{
		font-size: 5.8vw;
	}

	#footer-a 
	{
		width: 100%;
	}

	#footer-b
	{
		width: 100%;
		padding-top: 7vw;
	}

	#footer-c 
	{
		width: 100%;
	}

	#footer-c h2 
	{
		font-size: 7vw;
	}

	.logos-a 
	{
		height: 3vh;
		padding-right: 1.5vw;
	}

	#sous-contact li 
	{
		font-size: 4vw;
		width: 55vw;
		padding-top: 2vw;
	}

	#logo-mail
	{
	margin-top: 0vh;
	}


	#logo-map
	{
	margin-bottom: 1vh;
	}

	#carte 
	{
		width: 100%;
		height: 45vw;
	}

	#sous-reseaux
	{
		width: 100%;
		margin-right: 0;
	}

	#sous-reseaux ul
	{
		display: flex;
		justify-content: center;
		width: 100%;
	}

	.logos-b 
	{
		height: 13vw;
		padding-right: 4vw;
		padding-left: 4vw;
	}

	#mentions
	{
		font-size: 3vw;
		position: absolute;
		bottom: 0;
	}

}