:root{
	--gilroy: Gilroy;
	--justlovely: JustLovely;
	--bleu:#00385e;
	--framboise:#ff3859;
	--vert:#33eab5;
	--soleil:#ffd154;
}


*{
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	scroll-behavior: smooth;
}


/*-----------Général-----------*/
body{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 100vh;
}


a,a:link{
	text-decoration: none;
}


section{
	padding-left: 40px;
	padding-right: 40px;
}


main{
	font-weight: 300;
}


.gilroy-bold{
	font-weight: bold;
}


#font-main{
	font-family: var(--gilroy);
	color: var(--bleu);
}


#h2{
	text-align: center;
	font-size: 40px;
	margin-bottom: 80px;
}


.wrapper-commun{
	max-width: 1600px;
	margin: 0 auto;
}


h3{
	text-transform: uppercase;
	color: var(--framboise);
	font-weight: bold !important;
}



/*Responsive*/
@media screen and (max-width: 600px) {
	section{
		padding-left: 30px;
		padding-right: 30px;
	}
}

/*-----------Section Vous allez aimer acheter-----------*/
#aimer-acheter{
	padding-top: 60px;
}


.wrapper-aimer-acheter{
	max-width: 1600px;
	margin: 0 auto;
	background-color: var(--bleu);
	border-radius: 10px;
	display: flex;
	flex-wrap: wrap;
	column-gap: 40px;
	padding: 100px 0px 100px 60px;
}


.conteneur-h1-liens{
	width: 50%;
}


#h1-aimer-acheter{
	color: white;
	font-family: var(--justlovely);
	font-size: 140px;
	text-align: center;
}


.acte-vente-responsive{
	display: none;
}


.conteneur-boutons-aimer-acheter{
	display: flex;
	justify-content: center;
	column-gap: 100px;
	margin-top: 40px;
}


.boutons-aimer-acheter{
	text-align: center;
	border-radius: 5px;
	overflow: hidden;
	display: block;
	font-size: 18px;
	color: white;
	background-color: var(--framboise);
	padding: 10px 20px;
}


.boutons-aimer-acheter:hover{
	filter: brightness(0.9);
	color: white;	
}


.fa-arrow-down-long{
	margin-left: 10px;
	position: relative;
	animation: arrow-down 1s ease-in-out infinite running alternate;
}


@keyframes arrow-down{
	0%{
		top: -10px;
	}

	50%{
		top: 5px;
	}

	100%{
		bottom:-5px;
	}
}


.boutons-framboise:hover{
	filter: brightness(0.9);
	color: white;
}



.acte-vente-desktop{
	position: relative;
	top: -130px;
	border-radius: 10px;
	left: 20px;
}


/*Responsive*/
@media screen and (max-width: 1670px) {
	.wrapper-aimer-acheter{
		justify-content: center;
		padding: 40px 50px 10px 50px;
	}

	#h1-aimer-acheter{
		font-size: 120px;
		margin-bottom: 40px;
	}

	.acte-vente-desktop{
		display: none;
	}

	.acte-vente-responsive{
		display: block;
		margin: 0 auto;
		border-radius: 10px;
		height: 350px;
	}

	.conteneur-h1-liens{
		width: 100%;
	}

	.conteneur-boutons-aimer-acheter{
		justify-content: space-evenly;
		column-gap: 20px;
		margin-top: 40px;
		margin: 40px 0 0 0;
		position: relative;
		top: 30px;
	}
}



@media screen and (max-width: 900px) {
	#h1-aimer-acheter{
		font-size: 100px;
	}

	.acte-vente-responsive{
		height: auto;
		width: 100%;
	}
}



@media screen and (max-width: 800px) {
	#h1-aimer-acheter{
		font-size: 80px;
	}

	.boutons-aimer-acheter{
		font-size: 16px;
	}
}



@media screen and (max-width: 650px) {
	#h1-aimer-acheter{
		font-size: 70px;
	}

	.boutons-aimer-acheter{
		font-size: 14px;
	}
}



@media screen and (max-width: 580px) {
	#h1-aimer-acheter{
		font-size: 60px;
	}

	.wrapper-aimer-acheter{
		padding-left: 30px;
		padding-right: 30px;
		border-radius: 5px;
	}

	.acte-vente-responsive{
		border-radius: 5px;
	}

	.conteneur-boutons-aimer-acheter{
		flex-direction: column;
		row-gap:30px;

	}

	.boutons-aimer-acheter{
		margin: 0 auto;
		width: 210px;
	}

	.bouton-achat-residentiel i{
		margin-left: 35px;
	}

}




/*-----------Section Vous allez aimer acheter-----------*/
#achat-residentiel{
	padding-top: 160px;
}



.img-icones{
	display: block;
	width: 80%;
	margin: 0 auto;
}


.img-icones-responsive{
	display: none;
}


.conteneur-p-img-icones{
	display: flex;
	justify-content: space-between;
	text-align: center;
	font-size: 18px;
	margin: 0 auto;
	padding: 30px 0 70px 0;
	width: 100%;
}


.conteneur-p-img-icones p{
	width: 30%;
}


.bouton-voir-services,.boutons-framboise{
	display: block;
	font-size: 18px;
	color: white;
	background-color: var(--framboise);
	border-radius: 5px;
	padding: 10px 20px;
	width: max-content;
	margin: auto;
}


.fa-arrow-right-long{
	margin-left: 10px;
}



/*Responsive*/
@media screen and (max-width: 1050px) {
	.conteneur-p-img-icones{
		font-size: 16px;
		column-gap: 60px;
	}

	#h2{
		font-size: 30px;
	}

	.img-icones{
		width: 90%;
	}

	.bouton-voir-services{
		font-size: 16px;
	}
}


@media screen and (max-width: 699px) {
	#achat-residentiel{
		padding-top: 150px;
	}

	.conteneur-p-img-icones{
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
		text-align: left;
		padding: 40px 0;
		height: 500px;
	}

	.img-icones{
		display: none;
	}

	.img-icones-responsive{
		display: block;
		height: 500px;
	}

	.conteneur-img-icones-p{
		display: flex;
		column-gap: 30px;
	}

	.conteneur-p-img-icones p{
		width: 100%;
	}

	.bouton-voir-services{
		margin-top: 50px;
	}
}



@media screen and (max-width: 550px) {
	#h2{
		font-size: 25px;
		margin-bottom: 60px;
	}

	.conteneur-p-img-icones{
		height: 490px;
	}

	.img-icones-responsive{
		height: 470px;
	}
}


@media screen and (max-width: 480px) {
	#h2{
		margin-bottom: 40px;
	}


	.conteneur-p-img-icones{
		height: 430px;
	}

	.img-icones-responsive{
		height: 400px;
	}
}



@media screen and (max-width: 390px) {
	.conteneur-p-img-icones{
		height: 300px;
	}

	.img-icones-responsive{
		height: 330px;
		align-self: center;
	}

	.conteneur-p-img-icones p{
		font-size: 14px;
	}

	.conteneur-p-img-icones{
		padding: 0;
		align-self: flex-end;
	}
}



/*--------------Section Bannière texte-----------*/
#banniere-texte{
	margin-top: 150px;
	background-color: var(--bleu);
	color: white;
	padding: 100px 40px;
	font-size: 24px;
	text-align: center;
}


/*Responsive*/
@media screen and (max-width: 1400px) {
	#banniere-texte{
		font-size: 20px;
	}
}


@media screen and (max-width: 800px) {
	#banniere-texte{
		margin-top: 120px;
		font-size: 18px;
		padding: 60px 40px;
	}
}


@media screen and (max-width: 550px) {
	#banniere-texte{
		font-size: 16px;
		padding: 40px 40px;
	}
}



/*------------Section sur les services d'investissement locatif----------*/
#investissement-locatif{
	margin-top: 150px;
}

/*Offre 360*/
.conteneur-h3-360,.conteneur-h3-outils{
	display: flex;
	column-gap: 20px;
	align-items: center;
	margin-bottom: 60px;
}


.img-h3-360,.img-h3-outils{
	width: 50px;
}


/*Outils digitaux*/
.conteneur-h3-outils{
	justify-content: flex-end;
	margin-top: 80px;
}


/*Responsive*/
@media screen and (max-width: 700px) {
	#investissement-locatif{
		margin-top: 110px;
	}
}


@media screen and (max-width: 600px) {
	#investissement-locatif{
		margin-top: 90px;
	}

	h3{
		font-size: 22px!important;
	}
}


@media screen and (max-width: 460px) {
	h3{
		font-size: 20px!important;
	}
}





/*------------Section Pourquoi acheter?----------*/
#pourquoi-acheter{
	padding-top: 150px;
}


.wrapper-pourquoi-acheter{
	display: grid;
	grid-template-columns: 30% 60%;
	grid-template-rows: 0.2fr 1fr;
}



.h2-pourquoi-acheter{
	grid-column-start: 2;
	grid-row-start: 1;
	text-align: left!important;
}


.img-pourquoi-acheter{
	grid-column-start: 1;
	grid-row: 1 / span 2;
	width: 300px;
	justify-self:center;
	align-self: center;
}


.conteneur-raisons-acheter{
	grid-column-start: 2;
	grid-row-start: 2;
}


.conteneur-icone-raison{
	display: flex;
	align-items: center;
	column-gap: 15px;
	margin-bottom: 30px;
	margin-left: 30px;
}


.conteneur-icone-raison i{
	font-size: 30px;
	background-color: var(--vert);
	color: white;
	width: 60px;
	line-height: 60px;
	border-radius: 150px;
	text-align: center;
}


.conteneur-icone-raison p{
	font-size: 20px;
}



/*Responsive*/
@media screen and (max-width: 900px) {
	.conteneur-clients-satisfaits{
		margin-bottom: 0;
	}

	.conteneur-raisons-acheter{
		align-self: center;
	}

	.conteneur-icone-raison i{
		font-size: 22px;
		width: 44px;
		line-height: 44px;
	}

	.conteneur-icone-raison p{
		font-size: 18px;
		margin-bottom: 0px;
	}

	.h2-pourquoi-acheter{
		grid-column-start: 1;
		grid-column-end: 3;
		align-self: center;
		justify-self:center;
		margin-bottom: 0!important;
	}

	.img-pourquoi-acheter{
		grid-row-start: 2;
		width: 220px;
	}

	.wrapper-pourquoi-acheter{
		grid-row-gap: 50px;
	}
}



@media screen and (max-width: 710px) {
	.conteneur-icone-raison i{
		font-size: 20px;
		width: 40px;
		line-height: 40px;
	}


	.conteneur-icone-raison p{
		font-size: 16px;
	}
}



@media screen and (max-width: 690px) {
	.wrapper-pourquoi-acheter{
		grid-template-rows: 0.2fr 1fr 1fr;
		justify-content: center;
		grid-row-gap: 0;
		grid-column-gap: 0;
	}

	.conteneur-raisons-acheter{
		grid-row-start: 3;
		grid-column-start: 1;
		grid-column-end: 3;
		justify-self:center;
		margin-top: 20px;
	}

	.img-pourquoi-acheter{
		grid-column-start: 1;
		grid-column-end: 3;
		align-self: start;
		margin-top: 30px;
	}

	.h2-pourquoi-acheter{
		text-align: center!important;
	}

	.conteneur-icone-raison{
		margin-left: 0;
	}
}



@media screen and (max-width: 420px) {
	.conteneur-raisons-acheter{
		margin-top: 10px;
	}

	.img-pourquoi-acheter{
		width: 200px;
	}

	.conteneur-icone-raison i{
		font-size: 16px;
		width: 30px;
		line-height: 30px;
	}

	.conteneur-icone-raison p{
		width: 80%;
	}
}



/*--------Bouton fixed--------*/
.conteneur-bouton-fixed{
	display: flex;
	justify-content: center;
}


#bouton-parlons-fixed{
	position: fixed;
	bottom: 40px;
	display: block;
	font-size: 18px;
	color: white;
	background-color: var(--framboise);
	border-radius: 5px;
	padding: 10px 20px;
	width: max-content;

	box-shadow: 0 0 15px rgba(100,100,100,0.5);
}


@media screen and (max-width: 550px) {
	#bouton-parlons-fixed{
		font-size: 16px;
	}
}

