.header{
	position: relative;
}

.header .overlay{
    background-image: linear-gradient(180deg, #056839, rgb(4 4 4 / 80%));
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    top: 0;
    width: 100%;
    z-index: 0;
    opacity: 0.5;	
}

.header img{
	object-fit: cover;
    object-position: center center;
    height: 55vh;
	width: 100%;
}

.titre_modele{
    text-align: center;
    width: 100%;
    margin: 0;
    padding-bottom: 5vw;
}

.intro{
    display: flex;
    flex-wrap: wrap;
    padding: 5vw 10vw;
	justify-content: space-between;	
}

section.modele > img{
	    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.intro .titre{
    width: 100%;
}

.intro .colonne_01{
    width: 47%;
}

.intro .colonne_02{
    width: 47%;
}

.modele{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 5vw 10vw;
	position: relative;
}

.modele .single_modele {
    width: 47%;
    padding: 0vw;
    
}



.modele .single_modele .contenu{
	    padding: 25px 0 50px;
}

.modele .single_modele .contenu .b1{
	    background-color: var(--color2);
}

div.boite_popup{
	display: none;
	position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.7);
    width: 100%;
    height: 100%;
    z-index: 100;
}


div.boite_popup > div{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    width: 100%;
    height: 100%;
    -ms-align-items: flex-start;
    align-items: flex-start;
    justify-content: center;
    max-height: 100%;
    overflow-y: scroll;
padding: 5vh 10vw;
}

div.boite_popup > div .contenu_popup{
    background-color: #fff;
    padding: 4vw;
    max-width: 900px;
    margin: 0 auto;
	position: relative;
}

div.boite_popup .splide__pagination__page.is-active {
    background: #ccc;
    transform: scale(1.4);
}



.boite_popup  .close {

    position: absolute;
    top: 0;
    right: -29px;
    color: #fff;
    font-weight: 900;
    font-size: calc(28px + 0.5vw);
    text-transform: uppercase;
    /* pointer-events: none; */
    cursor: pointer;
    margin: 0;
}


@media screen and (max-width:640px){
	.modele .single_modele {
		width: 100%;
		padding: 0vw;
	}	
	
	.intro .colonne_01 ,
	.intro .colonne_02 {
    	width: 100%;
	}
	
	.header img {
		object-fit: cover;
		object-position: center center;
		height: 35vh;
		width: 100%;
	}	
}