@charset "utf-8";
/* CSS Document */
@font-face {
	font-family: "Tangerine";
	src: url('fonts/Tangerine-Regular.ttf');
}
@font-face {
	font-family: "Parisienne";
	src: url('fonts/Parisienne-Regular.ttf');
}

@font-face {
	font-family: "Roboto-Bold";
	src: url('fonts/Roboto-Bold.ttf');
}
@font-face {
	font-family: "Roboto-Medium";
	src: url('fonts/Roboto-Medium.ttf');
}
@font-face {
	font-family: "Roboto-Regular";
	src: url('fonts/Roboto-Regular.ttf');
}

html::-webkit-scrollbar {
  width: 0.8rem;
  background-color: rgba(0,0,0,.15); 
}
html::-webkit-scrollbar-thumb {
    background: #ddb5ba; 
}
/* scrollbar styling standard version */
html {
  scrollbar-color: #000 rgba(0,0,0,.15);
  scrollbar-width: thin;
}


	body {
  margin: 0 auto;
	padding:0;
  font-family: Helvetica, sans-serif;
  background-color: hsla(332,100%,97%,0.32);
}

a {
  color: #000;
}
h1{
font-family: 'Parisienne', cursive;
	color: #ddb5ba;
	text-align: center;
 			 font-size: clamp(25px, 3vw, 40px);
		border-top: 2PX solid hsla(353,37%,79%,0.42);

	border-bottom: 2PX solid hsla(353,37%,79%,0.42);
line-height: 1.5;
}
.contenu2 h1{
			color: #474747;

}

h2{
font-family: 'Parisienne', cursive;
	 			 font-size: clamp(20px, 2.5vw, 30px);

	margin-bottom: 20px;

	color: #ddb5ba;
 	
}
h3{

font-family: 'Parisienne', cursive;
 			 font-size: 2.5em;
		color: #474747;
	
	}
 p {
	list-style-type: none;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-top: 0px;
	font-family: 'Roboto-Regular', sans-serif;
	padding-top: 4px;
	padding-right: 0px;
	padding-bottom: 4px;
	padding-left: 0px;
	text-decoration:none;
	color: hsla(0,0%,6%,0.83);
	 font-size: clamp(12px, 1.5vw, 20px);


}
 .location-70 li {
	list-style-type: none;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-top: 0px;
	font-family: 'Roboto-Regular', sans-serif;
	padding-top: 4px;
	padding-right: 0px;
	padding-bottom: 4px;
	padding-left: 0px;
	text-decoration:none;
	color: hsla(0,0%,6%,0.83);
	 font-size: clamp(12px, 1.5vw, 20px);


}
.textegauche1{
	
	text-align: left;
}
.textedroite{
	
	text-align: right;
}

/* header */
.divmenu {
	width: 100%;
	text-align: center;
	margin: 0px;
	padding: 0px;
	float: left;
	display: block;

}

.header {
	background-color: white;
	box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1);
	position: fixed;
	width: 100%;
	float: center;
	display: block;
overflow: hidden;
	margin: 0px;
	padding: 0px;
	 	z-index: 5;


}

.divimagelogo{
	width: 185px;
	margin: 0 auto;
}
.divimagelogo.scroll{
	width: 75px;
	margin: 0 auto;
}
.badeau-image {
	width: 100%;
	height: 600px;
	text-align: center;
	margin: 0px;
	padding: 0px;
	background: url(bandeau2.jpg) ;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	background-position: center;
	float: left;
	display: block;
	overflow: hidden;
border-bottom: 5PX solid #ddb5ba;
border-top: solid #ddb5ba;}

.principal{
width: 100%;
		  margin: 0 auto;

background-color: white;
	clear: both;
	padding: 20px 0px;
			
}
 .contenu{
	 width: 1600px; 
	  margin: 0 auto;
	 background-color: white;
text-align: center;
	 clear: both;
}
.principalbandeau{
width: 100%;
		  margin: 0 auto;
		height: 400px;

background: url(images/mariage-vexin.jpg) no-repeat center center fixed;
	 -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;	
		background-position: center;
	float: left;
	text-align: center;
	vertical-align: middle;
	display: block;
	overflow: hidden;
	display: table;


}
.principalbandeau h2{
font-family: 'Parisienne', cursive;
 			 font-size: 3.5vw;
		color: #FFFFFF;
	vertical-align: middle;
line-height: 100%;
	margin: 0 5%;

}
.principalbandeau span {
/* Aligne le texte verticalement au milieu */
vertical-align:middle;
display: table-cell;
}
.principal1{
width: 100%;
		  margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content:center;
    align-items: center;
    min-height: 50vh;
    background: #474747;
    font-family: sans-serif;
		padding: 20px 0px;
			
}
.principal2{
width: 100%;
		  margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content:center;
    align-items: center;
    min-height: 50vh;
    background: #ddb5ba;
    font-family: sans-serif;
		padding: 20px 0px;

				
}
.principal3{
width: 100%;
		  margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content:center;
    align-items: center;
    min-height: 50vh;
    background: #CEDEC1;
    font-family: sans-serif;
		padding: 20px 0px;

				
}
.principal4{
	height: 150px;
	    background: #ddb5ba;

}
.contenu1{
	 width: 1600px; 
	  margin: 0 auto;
	 background-color: #474747;
text-align: center;
		 padding: 20px 0px;


}
.contenu2{
	 width: 1600px; 
	  margin: 0 auto;
	 background-color: #ddb5ba;
text-align: center;
		color: #474747;
		 padding: 20px 0px;


}

.contenu3{
	 width: 1600px; 
	  margin: 0 auto;
	 background-color: #CEDEC1;
text-align: center;
		color: #474747;
		 padding: 20px 0px;


}

.grid-item-atout ul {
  list-style: square url(images/star.png) inside;
	vertical-align: middle;
}
.grid-item-atout h2{
font-family: 'Parisienne', cursive;
 			 font-size: 2.5em;
	color: #474747;}
.contenu2 h2{
font-family: 'Parisienne', cursive;
 			 font-size: 2.5em;
		color: #474747;


}
.contenu3 h2{
font-family: 'Parisienne', cursive;
 			 font-size: 2.5em;
		color: #474747;


}
.contenu50{
	width: 48%;
	padding: 0 10px;
	float: left;
	
}
.contenu30{
	width: 30%;
	padding: 0 1%;
	float: left;
	
}
.onglet{
	width: 100%;
	max-width: 1600px;
	display: block;
	margin: 0 auto;
	align-content: center;	
	
	
}
.bouton-onglet{
	width: 20%;
	display: inline-block;
	margin: 2%;
	padding: 8px 0;
	align-content: center;	
	text-align: center;
		background-color: #ddb5ba;
	border-radius: 20px;

}

.onglet a{
	text-decoration: none;
	font-size: clamp(14px, 1.5vw, 20px);
	color: white;
	font-weight: bold;
	
}
.onglet span{
	width: 17%;
	display: inline-block;
	margin: 1%;
	padding: 8px 0;
	align-content: center;	
	text-align: center;
	background-color: #ddb5ba;
	border-radius: 10px;
	text-decoration: none;
	font-size: clamp(14px, 1.5vw, 20px);
	color: white;
	font-weight: bold;
	
}
.footer{
	width: 100%;
	display: block;
	float: left;
	margin: 0 auto;
	text-align: center;
	background-color: #474747;
	color: #ddb5ba;
	font-size: 1.5em;
	padding: 0 0 1% 0;
}
.minifooter{
	width: 100%;
	display: block;
	float: left;
	margin: 0 auto;
	text-align: center;
	background-color: #606060;
	color: #ddb5ba;
	font-size: 1.1em;
	padding: 0.5% 0;
	vertical-align:middle;

}

.minifooter img{
	
	  vertical-align:middle;

}
.location-30{
	width: 33%;
	padding: 1%;
	border-radius: 50%;
	display: inline-block;
}
.principallocation{
	
	max-width: 1600px;
    width: 95%;
    height: auto;
    margin: 30px auto;
    /* border: 1px solid #333; */
   
    justify-content: center;
}
.location-30 img{
	
	border-radius: 5%;
}


.location-70{
	width: 63%;
	padding: 1%;
	display: inline-block;
	vertical-align: top;
}

.decoration-mariage{
	width: 1600PX;
	height: 500px;
	margin: 0 auto;
	background-image: url("images/decoration_mariage.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	align-content: center;


	
}
.decoration-exterieur{
	width: 1600PX;
	height: 500px;
	margin: 0 auto;
	background-image: url(images/decoration_exterieur.jpg);
	background-position: center center;
	background-repeat: no-repeat;


	
}

.decoration-babyshower{
	width: 1600PX;
	height: 500px;
	margin: 0 auto;
	background-image: url(images/decoration_babyshower.jpg);
	background-position: center center;
	background-repeat: no-repeat;


	
}
.decoration-anniversaire{
	width: 1600PX;
	height: 500px;
	margin: 0 auto;
	background-image: url(images/decoration_anniversaire.jpg);
	background-position: center center;
	background-repeat: no-repeat;


	
}
.decoration-fleurs{
	width: 1600PX;
	height: 500px;
	margin: 0 auto;
	background-image: url(images/decoration_fleurs.jpg);
	background-position: center center;
	background-repeat: no-repeat;


	
}
.decoration-prive{
	width: 1600PX;
	height: 500px;
	margin: 0 auto;
	background-image: url(images/decoration_prive.jpg);
	background-position: center center;
	background-repeat: no-repeat;


	
}
.decoration-texte-gauche-border{
    background-color: rgba(255,255,255,0.35);
	width: 30%;
	height: 70%;
    position: relative;
    left: 5%;
	top: 15%;
	
}

.decoration-texte-gauche-border h2{

 margin: 0;
   padding: 0;
   font-weight: 600;
font-size: clamp(25px, 3vw, 40px);
	text-align: center;
	
	}
.decoration-texte-gauche-border-droite p{
font-size: clamp(15px, 2vw, 20px);
	font-family: 'Roboto', sans-serif;
	color: #606060;
	
	}

.decoration-texte-gauche-border p{


font-size: clamp(15px, 2vw, 20px);
	font-family: 'Roboto', sans-serif;
	color: #606060;

	}
.decoration-texte-gauche-border-droite h2{

 margin: 0;
   padding: 0;
   font-weight: 600;
font-size: clamp(25px, 3vw, 40px);
	text-align: center;
	
	}
.decoration-texte-gauche{
	
	background-color: white;
	width: 90%;
	height: 90%;
	margin: 5%;
		top: 5%;
	    position: relative;
	padding: 2%;
	
}
.decoration-texte-gauche-border-droite{
    background-color: rgba(255,255,255,0.35);
	width: 30%;
	height: 70%;
    position: relative;
    left: 65%;
	top: 15%;
	
}

/*voirplus*/
.location-image{
	
	width: 350px;
	height: 350px;
	margin: 0;
	padding: 0;
	cursor: pointer;
        position: relative;
        overflow: hidden;
        text-align: center;
}
   .location-image .fadedbox {
        background-color: #666666;
        position: absolute;
        top: 0;
        left: 0;
        color: #fff;
        -webkit-transition: all 300ms ease-out;
        -moz-transition: all 300ms ease-out;
        -o-transition: all 300ms ease-out;
        -ms-transition: all 300ms ease-out;
        transition: all 300ms ease-out;
        opacity: 0;
        width: 350px;
        height: 350px;
        padding: 130px 20px;
      }
      .location-image:hover .fadedbox {
        opacity: 0.8;
      }
      .location-image .text {
        -webkit-transition: all 300ms ease-out;
        -moz-transition: all 300ms ease-out;
        -o-transition: all 300ms ease-out;
        -ms-transition: all 300ms ease-out;
        transition: all 300ms ease-out;
        transform: translateY(30px);
        -webkit-transform: translateY(30px);
      }
      .location-image .title {
        font-size: 2.5em;
        opacity: 0;
        transition-delay: 0.2s;
        transition-duration: 0.3s;
      }
      .location-image:hover .title,
      .location-image:focus .title {
        opacity: 1;
        transform: translateY(0px);
        -webkit-transform: translateY(0px);
      }



.grille {
    max-width: 1600px;
    width: 95%;
    height: auto;
    margin: 30px auto;
    /* border: 1px solid #333; */
    display: grid;
    grid-template-columns: repeat(auto-fill, 350px);
    justify-content: center;
    grid-gap: 20px;
}
.grid-item {
    width: 350px;
box-shadow: 0px 0px 6px 1px rgba(0,0,0,0.41);
-webkit-box-shadow: 0px 0px 6px 1px rgba(0,0,0,0.41);
-moz-box-shadow: 0px 0px 6px 1px rgba(0,0,0,0.41);
	position:relative;}

.grid-item a{
    text-decoration: none;}

.grille-image {
    max-width: 1600px;
    width: 95%;
    height: auto;
    margin: 30px auto;
    /* border: 1px solid #333; */
    display: grid;
    grid-template-columns: repeat(auto-fill, 450px);
    justify-content: center;
    grid-gap: 20px;
}
.grid-item-image {
    width: 450px;
    background: hsla(0,0%,50%,0.07);
}

.grille-atout {
    max-width: 1600px;
    width: 95%;
    height: auto;
    margin: 30px auto;
    /* border: 1px solid #333; */
    display: grid;
    grid-template-columns: repeat(auto-fill, 400px);
    justify-content: center;
    grid-gap: 75px;
}
.grid-item-mariage {
    width: 450px;
	height: 450px;
    background: #fff;
	padding: 10px;
	text-align: left;
	box-shadow: 0px 0px 14px 1px rgba(0,0,0,0.41);
-webkit-box-shadow: 0px 0px 14px 1px rgba(0,0,0,0.41);
-moz-box-shadow: 0px 0px 14px 1px rgba(0,0,0,0.41);
	position:relative;

}
.grid-item-mariage li{
   font-size: 16px;
	line-height: 25px;
	'Roboto', sans-serif;
}
.grid-item-atout {
    width: 450px;
    background: #fff;
	padding: 10px;
	text-align: center;

	position:relative;

}
.grid-item-atout h3{
   text-align: center;
	line-height: 3em;
}
.grid-item h3{
   margin: 0;
   padding: 0;
   font-weight: 600;
   font-size: 1.2em;
   color: #777;
	text-align: center;
  } 
.grid-item h2{
   margin: 2px;
   padding: 0;
   font-weight: 600;
   font-size: 1.8em;
	text-align: left;
  } 
.grid-item-mariage a{
   color: #474747;
		font-weight: 600;
   		font-size: 1.2em;
		text-align: center;

  } 
	
	.reserver{
		width: 450px; 
		background-color: #ddb5ba;
		color: #474747;
	
		text-align: center;
		overflow: hidden;
		padding: 20px;
 		position:absolute;
    	bottom:0;
		margin: -50px 0 0 -10px;
		
		
	}
.image3col{
	width: calc(94%/3);
	padding: 1%;
	
	display: block;
	float: left;


	
}

.col3location{
	width: calc(88%/3);
	margin: 2%;
	display: block;
	float: left;
	border: 1px solid #ddb5ba;
	
}
.image3col p{
	text-align: left;

}
.image3col li{
	text-align: left;

}
.imageronde{
    overflow:hidden;
    -webkit-border-radius:50px;
    -moz-border-radius:50px;
    border-radius:50%;
    width:400px;
    height:400px;
	float:right;
	shape-outside: circle();
}
.imagerondeleft{
    overflow:hidden;
    -webkit-border-radius:50px;
    -moz-border-radius:50px;
    border-radius:50%;
    width:300px;
    height:300px;
	float:left;
	shape-outside: circle();
}
.imagerondeleftpetite{
    overflow:hidden;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
    width:100px;
    height:100px;
	float:left;
	shape-outside: circle();
	margin: 10px;
}

.textegauche{
	float: left;
		font-family: Poppins-Regular;
	font-size: 14px;
	line-height: 1.2;
	color: #666666;
	margin: 0px;
}
#conteneur {
; 	top: 0px;
	top: 0px;
  /* Rien de spécial ici. */
}
#conteneur > .clear {
  clear: both;
  height: 0; overflow: hidden; /* Précaution pour IE 7 */
}

#logoscroll {
	max-height: 150px;
	display: inline;
}

.header ul {
  margin: 0 auto;
  padding: 0;
  list-style: none;
  overflow: hidden;
  background-color: #fff;
	text-align: center;
}

.header li a {
  display: block;
  padding: 20px 20px;
  border-right: 1px solid #f4f4f4;
  text-decoration: none;
	  margin: 0 auto;
	color: #636363;
		font-weight: bold;
	font-size: 1.2em;

transition-duration: 2s;
}

.header li img {
 
  padding: 0px 20px;

}
.header li a:hover,
.header .menu-btn:hover {
  background-color: #ddb5ba;
	font-weight: bold;
}

.header .logo {
  display: block;
  float: left;
  font-size: 2em;
  padding: 10px 20px;
  text-decoration: none;
}

/* menu */

.header .menu {
  clear: both;
  max-height: 0;
  transition: max-height .2s ease-out;
	    float: center;
	margin: auto;

}

/* menu icon */
.menu-responsiv{
	width: 100%;
	
	
}
.header .menu-icon {
  cursor: pointer;
  display: inline-block;
  float: right;
  padding: 40px 20px;
  position: relative;
  user-select: none;
}

.header .menu-icon .navicon {
  background: #333;
  display: block;
  height: 5px;
  position: relative;
  transition: background .2s ease-out;
  width: 40px;
}

.header .menu-icon .navicon:before,
.header .menu-icon .navicon:after {
  background: #333;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  transition: all .2s ease-out;
  width: 100%;
}

.header .menu-icon .navicon:before {
  top: 12px;
}

.header .menu-icon .navicon:after {
  top: -12px;
}

/* menu btn */

.header .menu-btn {
  display: none;
}

.header .menu-btn:checked ~ .menu {
  max-height: 600px;
}

.header .menu-btn:checked ~ .menu-icon .navicon {
  background: transparent;
}

.header .menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}

.header .menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}

.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  top: 0;
}




/* card */

	

  .box{
    width: 1600px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    grid-gap: 15px;
    margin: 0 auto;
	  padding: 10px;
  }
		
  .card{
    position: relative;
    width: 500px;
    height: 500px;
    background: #fff;
    margin: 0 auto;
    border-radius: 4px;
    box-shadow:0 2px 10px rgba(0,0,0,.2);
  }
  .card:before,
  .card:after
  {
    content:"";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    background: #fff;
    transition: 0.5s;
    z-index:-1;
  }

  .card .imgBx{
  position: absolute;
  top: 10px;
  left: 10px;
  bottom: 80px;
  right: 10px;
  background: #222;
  transition: 0.5s;
  z-index: 1;
  }
  
  .card:hover .imgBx
  {
    bottom: 10px;
  }

  .card .imgBx img{
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
  }

  .card .details{
      position: absolute;
      left: 10px;
      right: 10px;
      bottom: 10px;
      height: 60px;
      text-align: center;
  }

  .card .details h3{
   margin: 0;
   padding: 0;
   font-weight: 600;
   font-size: 30px;
   color: #777;
   line-height: 30px;
  } 

  .card .details h3 span{
  font-weight: 400;
  font-size: 25px;
  color: #f38695;
  display: block;
  margin-top: 2px;
   } 
   




@media (min-width: 1024px) {
  .header {
padding: 0; 
margin: 0;
text-align: center; /* centrer le texte */
 
}
	.header li {
    float: center;
	display: inline;
	list-style: none;
  }
  .header li a {
   padding: 20px 30px;
display:inline-block;

  }
  .header .menu {
    clear: none;
    float: center;
    max-height: none;
  }
  .header .menu-icon {
    display: none;
  }
	
.divcol1violet{
	width: 100%;
background-color: blueviolet;	
		float: left;
	}
	.divcol1rouge{
	width: 100%;
background-color: brown;
		display: block;
		float: left;
	}
	.divcol1blanc{
	width: 100%;
background-color: white;	
		float: left;

	}
	.menu-responsiv{
	width: 100%;
	
	display: none;
	
}
	.divcol3{
	width: calc((100% - 6%) / 3);
	background-color: white;
		margin: 1%;
		float: left;
				border-radius: 5px;

-webkit-box-shadow: 0 4px 20px 2px rgba(0,0,0,0.4);
-moz-box-shadow: 0 4px 20px 2px rgba(0,0,0,0.4);
box-shadow: 0 4px 20px 2px rgba(0,0,0,0.4);
	}
	.divcol3 :hover{

-webkit-box-shadow: inset 0 4px 20px 2px rgba(0,0,0,0.4);
-moz-box-shadow: inset 0 4px 20px 2px rgba(0,0,0,0.4);
box-shadow: inset 0 4px 20px 2px rgba(0,0,0,0.4);
	}
	
	
			
.principal1{
width: 100%;
	
				
}
 .contenu1{
	 width: 100%; 
	 


}
}

@media (max-width: 940px) {
	.badeau-principal{
			width: 100%;
	height: 600px;
		
	}	

	
	
 .contenu{
	 width: 90%; 
	  margin: 0 auto;
	 background-color: white;
	 text-align: center;
	 clear: both;


}	
	
	
.image3col{
	width: 100%;
	padding: 1% 10%;
	margin: 0 auto;

	display: block;
	float: left;


	
}
.decoration-texte-gauche-border{
    background-color: rgba(255,255,255,0.35);
	width: 45%;
	height: 70%;
    position: relative;
    left: 5%;
	top: 15%;
	
}	
	.decoration-texte-gauche-border-droite{
    background-color: rgba(255,255,255,0.35);
	width: 45%;
	height: 70%;
    position: relative;
    left: 50%;
	top: 15%;
	
}
	
}	

@media (min-width: 940px) and (max-width: 1200px) {

 .contenu{
	 width: 90%; 
	  margin: 0 auto;
	 background-color: white;
	 text-align: center;
	 clear: both;


}	
	
	
.image3col{
	width: calc(100%/2);
	padding: 1%;
	
	display: block;
	float: left;


	
}

.decoration-texte-gauche-border{
    background-color: rgba(255,255,255,0.35);
	width: 40%;
	height: 70%;
    position: relative;
    left: 5%;
	top: 15%;
	
}	
	.decoration-texte-gauche-border-droite{
    background-color: rgba(255,255,255,0.35);
	width: 40%;
	height: 70%;
    position: relative;
    left: 55%;
	top: 15%;
	
}

}

@media (max-width: 1600px) {
		
		
.principal{
width: 100%;
		  margin: 0 auto;

background-color: white;
				
}
	
	
 .contenu{
	 width: 90%; 
	  margin: 0 auto;
	 background-color: white;
	 text-align: center;
	 clear: both;


}
 .contenu1{
	 width: 90%; 
		  margin: 0 auto;
	 background-color: #474747;
text-align: center;
		 padding: 20px 0px;





}
 .contenu2{
	 width: 90%; 
		  margin: 0 auto;
	 background-color: #ddb5ba;
text-align: center;
		color: #474747;
		 padding: 20px 0px;


}	
	.contenu3{
	 width: 90%; 
	


}	
	
.decoration-mariage{
	width: 100%;
	margin: 0 auto;
	background-image: url(images/decoration_mariage.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	align-content: center;


	
}
.decoration-exterieur{
	width: 100%;
	height: 500px;
	margin: 0 auto;
	background-image: url(images/decoration_exterieur.jpg);
	background-position: center center;
	background-repeat: no-repeat;


	
}

.decoration-babyshower{
	width: 100%;
	height: 500px;
	margin: 0 auto;
	background-image: url(images/decoration_babyshower.jpg);
	background-position: center center;
	background-repeat: no-repeat;


	
}
.decoration-anniversaire{
	width: 100%;
	height: 500px;
	margin: 0 auto;
	background-image: url(images/decoration_anniversaire.jpg);
	background-position: center center;
	background-repeat: no-repeat;


	
}
.decoration-fleurs{
	width: 100%;
	height: 500px;
	margin: 0 auto;
	background-image: url(images/decoration_fleurs.jpg);
	background-position: center center;
	background-repeat: no-repeat;


	
}
.decoration-prive{
	width: 100%;
	height: 500px;
	margin: 0 auto;
	background-image: url(images/decoration_prive.jpg);
	background-position: center center;
	background-repeat: no-repeat;


	
}
	
	 .box{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    grid-gap: 15px;
    margin: 0 auto;
	  padding: 10px;
  }
		
  .card{
    position: relative;
    width: 400px;
	  height: 400px;
    background: #fff;
    margin: 0 auto;
    border-radius: 4px;
    box-shadow:0 2px 10px rgba(0,0,0,.2);
  }	
	
	 .card .imgBx img{
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
  }
	
	
}

	@media (min-width: 1920px) {
		
		
.principal{
width: 100%;
		  margin: 0 auto;

background-color: white;
				
}
 .contenu{
	 width: 1600px; 
	  margin: 0 auto;
	 background-color: white;
	 text-align: center;


}

		
		
}