/* TEMPLATE-PARTS - IMAGE TITRE BOUTON ---------------------------------------------------------------------*/

.background-colored{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 50%;
	z-index: -1;
}


.image-titre-bouton,
.image-titre-bouton .container{
	position: relative;
}

.image-titre-bouton .container{
	padding: unset;
}

.image-titre-bouton picture img{
	object-fit: cover;
	max-height: 850px;
}

.image-titre-bouton .container > div{
	max-width: 80%;
	padding-left: 40px;
	position: absolute;
	width: auto;
	left: 0;
	bottom: 1rem;
}

.image-titre-bouton .container > div > *,
.image-titre-bouton .container > div > p,
.image-titre-bouton .container > div > p span,
.image-titre-bouton .container > div > div > p span{
	color: #fff;
	font-size: 16px;
}

.image-titre-bouton .container > div > h2{
	margin-bottom: 24px;
	font-size: 28px;
	line-height: 1.1;
}

.image-titre-bouton .container > div > p{
	font-size: 16px;
}

.image-titre-bouton .container div p strong{
	font-weight: 500;
}


@media screen and (min-width : 400px) {
	.image-titre-bouton .container > div{
		bottom: 56px;
		top: unset;
		transform: none;
	}
}

@media screen and (min-width : 576px){
	.image-titre-bouton .container > div > h2{
		font-size: 38px;
	}
}

@media screen and (min-width : 992px){
	.image-titre-bouton .container{
		padding: 0 1rem;
	}

	.image-titre-bouton .container > div{
		max-width: 55%;
		padding-left: 97px;
		top: 50%;
		bottom: unset;
		transform: translate(0, -50%);
	}

	.image-titre-bouton .container > div > h2{
		margin-bottom: 32px;
		font-size: 28px;
		line-height: 52px;
	}
}

@media screen and (min-width : 1400px){
	.image-titre-bouton .container > div > h2{
		font-size: 48px;
	}
}