/*
 Theme Name:     Divi Child
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Elegant Themes
 Author URI:     https://www.elegantthemes.com
 Template:       Divi
 Version:        1.0.0
*/
 
 
/* =Theme customization starts here
------------------------------------------------------- */
/* PRELOAD IMAGE */

@charset "UTF-8";

:root {
  --coul-titre: #FFF;
  --coul-titre2: #000;
  --coul-accroche: #ff0030;
  --coul-accroche_hover: #d50028;
  --coul-accroche2: #FFF;

  --coul-logo: #FFF;
  --coul-logo-accroche: #FF0030;
  --color-grey: #eaeaea;
  --color-red: #ff0030;
  --color-red-strong: #e9032e;
  font-size: 19px;
  --espace-vertical: 5px;
  --espace-horizontal: 10px; 
}

*,
*::before,
*::after {
  padding:0;
  margin: 0;
  box-sizing: border-box;
}

html { font-size: 100%; }

/* REINIT DE TOUS LES ESPACEMENT DES DIVS DE DIVI */
/* .et_pb_section { margin:0 !important; padding:0 !important; }
.et_pb_row { margin:0 !important; padding:0 !important; } */

/*
Dégradé : #843674 vers #2c1632 vers #000000 diago haut gauche vers bas droite
Dégradé : #15071c vers #0e0b10 gauche vers droite
*/


/*
Theme Name : Mon Thème
transform: rotate
*/



.lang-item a {
  color: white !important;
  font-size: 30px !important;
  text-decoration: underline;
}

.dn-newsletter-form label {
  font-size: 0.80rem;
  line-height: 1.4rem;
}

/* Conteneur général du formulaire */
.dn-newsletter-form-container {
  background-color: #111; /* Fond très sombre */
  padding: 40px 20px;
  max-width: 500px;
  margin: 0 auto;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0,0,0,0.5);
  color: #fff; /* Texte en blanc */
  font-family: Arial, sans-serif;
}

/* Titre du formulaire */
.dn-newsletter-form-container h2 {
  margin-bottom: 30px;
  font-size: 24px;
  text-align: center;
  color: #fff;
}

/* Styles pour les champs de saisie (input et textarea) */
.dn-newsletter-form input[type="text"],
.dn-newsletter-form input[type="email"],
.dn-newsletter-form textarea {
  width: 100%;
  padding: 12px 15px;
  margin-bottom: 20px;
  background-color: transparent;
  border: 1px solid #444;
  border-radius: 4px;
  color: #fff;
  font-size: 16px;
  box-sizing: border-box;
  transition: border-color 0.2s;
}

/* Lorsque le champ est en focus, éclaircir la bordure */
.dn-newsletter-form input[type="text"]:focus,
.dn-newsletter-form input[type="email"]:focus,
.dn-newsletter-form textarea:focus {
  border-color: #888;
  outline: none;
}

/* Style pour le textarea (message éventuel) */
.dn-newsletter-form textarea {
  min-height: 120px;
  resize: vertical;
}

/* Style pour la case à cocher + label */
.dn-newsletter-form .dn-checkbox-container {
  margin-bottom: 25px;
  display: flex;
  align-items: center;
}

.dn-newsletter-form .dn-checkbox-container input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin-right: 10px;
  accent-color: #fff;
}

.dn-newsletter-form .dn-checkbox-container label {
  color: #fff;
  font-size: 16px;
}

/* Style pour le bouton de soumission */
.dn-newsletter-form button[type="submit"] {
  width: 100%;
  padding: 14px;
  background-color: var(--coul-accroche);
  border: none;
  border-radius: 4px;
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  transition: background-color 0.2s;
}

.dn-newsletter-form button[type="submit"]:hover {
  background-color: var(--coul-accroche_hover);
}

/* Message d’erreur / succès */
.dn-newsletter-form-container .message-html {
  margin-bottom: 20px;
  font-size: 14px;
}

/* Exemple d’utilisation responsive */
@media (max-width: 600px) {
  .dn-newsletter-form-container {
    padding: 30px 15px;
  }

  .dn-newsletter-form-container h2 {
    font-size: 20px;
  }

  .dn-newsletter-form button[type="submit"] {
    font-size: 16px;
  }
}


@font-face {
    font-family: 'Josefin Sans';
    src: url('fonts/JosefinSans/JosefinSans-Regular.eot');
    src: url('fonts/JosefinSans/JosefinSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/JosefinSans/JosefinSans-Regular.woff2') format('woff2'),
        url('fonts/JosefinSans/JosefinSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Josefin Sans';
    src: url('fonts/JosefinSans/JosefinSans-SemiBold.eot');
    src: url('fonts/JosefinSans/JosefinSans-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('fonts/JosefinSans/JosefinSans-SemiBold.woff2') format('woff2'),
        url('fonts/JosefinSans/JosefinSans-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Water Brush';
    src: url('fonts/Waterbrush/WaterBrush-Regular.eot');
    src: url('fonts/Waterbrush/WaterBrush-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/Waterbrush/WaterBrush-Regular.woff2') format('woff2'),
        url('fonts/Waterbrush/WaterBrush-Regular.woff') format('woff'),
        url('fonts/Waterbrush/WaterBrush-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Jost';
    src: url('fonts/Jost/Jost-Light.eot');
    src: url('fonts/Jost/Jost-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/Jost/Jost-Light.woff2') format('woff2'),
        url('fonts/Jost/Jost-Light.woff') format('woff'),
        url('fonts/Jost/Jost-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Jost';
    src: url('fonts/Jost/Jost-Regular.eot');
    src: url('fonts/Jost/Jost-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/Jost/Jost-Regular.woff2') format('woff2'),
        url('fonts/Jost/Jost-Regular.woff') format('woff'),
        url('fonts/Jost/Jost-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}




.centrage { display:flex; }

.sep-coeur-1 { display:inline-block; position:relative;  transform-origin: center center; width:9rem; margin: 2rem auto 0 auto; }
.sep-coeur-2 { display:inline-block; position:relative; width:9rem; transform-origin: center center; margin: 2rem auto 0 auto; }
.sep-coeur-3 { display:inline-block; position:relative; width:100px; }

.sep-coeur-a {  width:100%; }
.sep-coeur-b { position:absolute;  width:100%; left:0; transform:scale(100%); color:white; }

	.anim-heartbeat1 { animation: heartbeat 1.1s infinite; }
	.anim-heartbeat2 { animation: heartbeat 1.2s infinite; }

	.sep-coeur-b:hover {
		animation: heartbeat 1.2s infinite;
	}

	.st0{display:none;} /** COULEUR COEUR INTERIEUR **/
	.st1{fill:currentColor;} /** COULEUR PETIT COEUR **/
  .st3{fill:currentColor;} /** COULEUR DU TRAIT ET POINTS **/

	@keyframes heartbeat
	{
	0%
	{
		transform: scale( 1 );
	}
	20%
	{
		transform: scale( 0.75 );
	}
	40%
	{
		transform: scale( 1 );
	}
	60%
	{
		transform: scale( 0.75 );
	}
	80%
	{
		transform: scale( 1 );
	}
	100%
	{
		transform: scale( 1 );
	}
	}


.header {
  background: #000 url('/wp-content/themes/divi-child/images/murielle_background.webp');
  background-repeat: no-repeat;

  background-size: cover;

}

.header .et_pb_row {
  display: block;
  padding-top: 11vh;
}


.header-box-titre {
  font-family: 'Josefin Sans';
  font-size: 6.5rem;
  letter-spacing: 0.2rem;
  color: var(--coul-titre);
  font-weight: 400;
}

.header-box-accroche {
  letter-spacing : 0.3rem;
  font-size: 3rem;
  top: -2.8rem;
  left: 2.5rem;
  color: var(--coul-accroche);
}

.accroche {
  position: relative;
  font-family: 'Water Brush';
  display: inline-block;
  transform-origin: center center;
  transform:rotate(-6deg);
  font-weight: 400;
  font-style: italic;
}

.rot-titre {
  transform:rotate(-4deg);
}

p {
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  color: #FFF;
}

.header p {
  font-size: 1.07rem;
  line-height: 1.7rem;
  letter-spacing: 0.08rem;
  width: 50%;
}



.presentation {
  background: #000;
}


.presentation-col1 {
  padding: 0;
}

.presentation2 .presentation-titre {
  color: var(--coul-titre2);
}

.presentation .accroche, .presentation3 .accroche, .newsletter .accroche {
  color: var(--coul-accroche);
}

.presentation3 .et_pb_text img {
  display: flex;
  margin: auto;
}

.presentation2 .accroche {
  color: var(--coul-accroche2);
}

.parag-txt p {
  font-size: 0.92rem;
  line-height: 1.4rem;
}

.wrapper-titre {
  position:relative;
  display:inline-block;
}

.presentation-titre {
  font-family: 'Josefin Sans';
  font-size: 3.3rem;
  font-weight: 600;
  color: var(--coul-titre);
}

.presentation-accroche {
  position:relative;
  letter-spacing : 0.2rem;
  font-size: 3.3rem;
}

.presentation .presentation-accroche {
  top: -2.4rem;
  left: 5rem;
}

.presentation2 .presentation-accroche {
  top: -1.3rem;
  left: 7.5rem;
}

.presentation3 .presentation-accroche {
  top: -1.7rem;
  left: 5.2rem;
}

.newsletter .presentation-accroche {
  top: -2.5rem;
  left: 2rem;
}

.texte-lorem {
    font-family: 'Jost';
    font-size: 1.2rem;
    color: #fff;
    font-weight: 300;
    padding: 15%;
}

.presentation-section {
  justify-content: center;
  align-content: center;
}

.image-rotation {
  transform:rotate(-1.5deg);
  padding: 5% 5%;
}

.rotation-cw {
  transform:rotate(1.5deg);
}

.centrage-vertical {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
}

.parag-txt p:nth-of-type(1) {
  margin-top: 2rem;
}

.boite-blog {
  background: #cecece;
  height: 30vh;
  padding:1% !important; 
}

  img.separation-coeur {
    display: block;
    width: 230px;
    margin: auto;
    margin-top: 2rem;
  }

  .espace1, .espace2 {
    border-top: 0.1rem solid white;
    border-bottom: 0.1rem solid white;
  }

  .presentation3 {
    border-top: 0.15rem solid white;
  }

  .presentation span.gras, .presentation3 span.gras {
    color: var(--coul-accroche);
    font-weight: 400;
  }

  .presentation2 span.gras {
    color: var(--coul-titre);
    font-weight: bold;
  }

/* MISE EN PLACE DES CONTAINERS */

.packphotos .et_pb_column:nth-child(odd) {
  transform:rotate(-2.5deg);
}

.packphotos .et_pb_column:nth-child(even) {
  transform:rotate(2.5deg);
}

.packphotos .et_pb_main_blurb_image {
  padding-bottom: 5px;
  margin-bottom: 10px;
}

.packphotos .et_pb_blurb_container {
  font-family: 'Josefin Sans';
  font-weight: 400;
  color: white;
  text-align: center;
}

.packphotos .et_pb_blurb_container h4 {
  color: #FFF;
  padding-bottom: 0;
  text-align: center;
  font-size: 1rem;
}

.packphotos .et_pb_blurb_description p {
  text-align: center;
  font-size: 0.6rem;
  font-weight: 400;
  color: var(--coul-accroche);
}

.packphotos .et_pb_blurb_content:nth-child(even) .woocommerce-loop-product__title {
  font-family: 'Josefin Sans';
  font-weight: 400 !important;
  font-size: 1.3rem !important;
  letter-spacing: 0.1em !important;
  color: white;
  text-align: center;
}

.packphotos .et_pb_blurb_content:nth-child(odd) .woocommerce-loop-product__title {
  font-family: 'Josefin Sans';
  font-weight: 400;
  font-size: 1.4rem !important;
  letter-spacing: 0.1em;
  color: white;
  text-align: center;
}

.packphotos .et_pb_column:nth-child(odd):hover {
  animation-name: example1;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
}

.packphotos .et_pb_column:nth-child(even):hover {
  animation-name: example2;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
}

.packphotos .et_pb_main_blurb_image img {
  border: 7px solid white;
  border-radius: 6px;
}

@keyframes example1 {
  0% { transform:rotate(0deg); }
  100% { transform:rotate(1deg); }
}

@keyframes example2 {
  0% { transform:rotate(0deg); }
  100% { transform:rotate(-1deg); }
}


/*** Responsive Styles Large Desktop And Above ***/
@media all AND (min-width: 1600px) {
  :root {
    font-size: 25px;
  }

  .header {
    background-position: top 1% right 50%;
  }
}

/*** Responsive Styles Large Desktop And Above ***/
@media all AND (min-width: 1405px) AND (max-width: 1599px){

  :root {
    font-size: 25px;
  }

  .header {
      background-position: top 0% right 40%;
  }
}

/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 1100px) AND (max-width: 1404px) {

  :root {
    font-size: 1.5vw;
  }

  .header {
      background-position: top 0% right 35%;
  }



}

/*** Responsive Styles Tablet And Below ***/
@media all and (min-width: 980px) and (max-width: 1099px) {

  :root {
    font-size: 16px;
  }

  .header {
    background: #000 url('/wp-content/themes/divi-child/images/murielle_background_50p.webp');
    background-position: top 0% right 40%;
    background-repeat: no-repeat;
    background-size: cover;
  }

}

/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 768px) and (max-width: 979px) {
  :root {
    font-size: 3vw;
  }

  .header {
    background: #000 url('/wp-content/themes/divi-child/images/murielle_background_50p.webp');
    background-position: top 0% right 50%;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .header p {
    width: 100%;
  }

  .presentation2 .et_pb_row {
    display: flex;
    flex-direction: column-reverse;
  }

  .header .et_pb_row {
    padding-top: 7vh;
  }

  .header-box-titre {
    font-size: 6.5rem;
  }

  .header-box-accroche {
    font-size: 3rem;
    line-height: 1rem;
  }

  .presentation p, .presentation2 p, .presentation3 p  {
    font-size: 1.4rem;
    line-height: 1.8rem;
  }

  .presentation .presentation-titre, .presentation2 .presentation-titre, .presentation3 .presentation-titre {
    font-size: 3.5rem;
  }

  .presentation .presentation-accroche {
    top: -1.7rem;
    left: 4rem;
    font-size: 3.2rem;
  }

  .presentation2 .presentation-accroche {
    top: -1rem;
    left: 6.3rem;
    font-size: 3.2rem;
  }

    .presentation3 .presentation-accroche {
    top: -1.4rem;
    left: 6.3rem;
    font-size: 3.2rem;
  }

}

/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {

  :root {
    font-size: 3vw;
  }

  .header {
    background: #000 url('/wp-content/themes/divi-child/images/murielle_background_50p.webp');
    background-position: top 0% right 30%;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .presentation2 .et_pb_row {
    display: flex;
    flex-direction: column-reverse;
  }
 
  .header .et_pb_row {
    padding-top:7vh;
  }

  .header p {
    width: 100%;
    font-size: 1.7rem;
    line-height: 2.2rem;
  }

  .header-box-titre {
    font-size: 6.5rem;
  }

  .header-box-accroche {
    font-size: 3rem;
    line-height: 1.7rem;
  }

  .presentation p, .presentation2 p, .presentation3 p {
    font-size: 1.7rem;
    line-height: 2.2rem;
  }

  .presentation .presentation-titre, .presentation2 .presentation-titre, .presentation3 .presentation-titre {
    font-size: 4rem;
  }

  .presentation .presentation-accroche {
    top: -2.5rem;
    left: 6rem;
    font-size: 4.2rem;
  }

  .presentation2 .presentation-accroche {
    top: -1.5rem;
    left: 8.3rem;
    font-size: 4.2rem;
  }

  .presentation3 .presentation-accroche {
    top: -2rem;
    left: 8.3rem;
    font-size: 4.2rem;
  }

}

/*** Responsive Styles Smartphone Portrait ***/
@media all and (max-width: 479px) {

  :root {
    font-size: 2.7vw;
  }

  .header {
      background-position: top 0% right 30%;
  }

  .header .et_pb_row {
    padding-top: 7vh;
  }

  .header p {
    font-size: 2.2rem;
    line-height: 2.7rem;
  }

  .presentation p {
    font-size: 1.5rem;
    line-height: 2.1rem;
  }

  .header-box-titre {
    font-size: 6.5rem;
  }

  .header-box-accroche {
    font-size: 3rem;
    line-height: 1rem;
  }

  .presentation p, .presentation2 p, .presentation3 p {
    font-size: 2.2rem;
    line-height: 2.7rem;
  }

  .presentation .presentation-titre, .presentation2 .presentation-titre, .presentation3 .presentation-titre {
    font-size: 5rem;
  }

  .presentation .accroche, .presentation2 .accroche, .presentation3 .accroche {
    font-size: 4rem;
      top: -2rem;
      right: -0.5rem;
  }

}











.main-content .item {
  display: grid;
  grid-template-rows: 1fr min-content;
  align-items: center;
  justify-content: center;
  height: 50vh;
  flex-wrap: wrap;
  background: var(--bg-color);
}
.main-content .item:not(.footer) {
  padding-top: 1rem;
}

.button-don-murielle {
  background: url('/wp-content/uploads/2023/02/background-button.webp');
  background-size: cover;
  color: #fff;
  border: 3px solid #fff;
  border-radius: 50px;
  padding: 0.8rem 2rem;
  font: 24px "Margarine", sans-serif;
  outline: none;
  cursor: pointer;
  position: relative;
  transition: 0.2s ease-in-out;
  letter-spacing: 2px;
}

.name {
  width: 100%;
  text-align: center;
  padding: 0 0 3rem;
  font: 500 14px "Rubik", sans-serif;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
}

.button__wrapper {
  display: inline-block;
  position: relative;
  width: 200px;
  height: 65px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.button-jittery button {
  animation: jittery 4s infinite;
}
.button-jittery button:hover {
  animation: heartbeat 0.2s infinite;
}

@keyframes jittery {
  5%, 50% {
    transform: scale(1);
  }
  10% {
    transform: scale(0.9);
  }
  15% {
    transform: scale(1.15);
  }
  20% {
    transform: scale(1.15) rotate(-5deg);
  }
  25% {
    transform: scale(1.15) rotate(5deg);
  }
  30% {
    transform: scale(1.15) rotate(-3deg);
  }
  35% {
    transform: scale(1.15) rotate(2deg);
  }
  40% {
    transform: scale(1.15) rotate(0);
  }
}
@keyframes heartbeat {
  50% {
    transform: scale(1.1);
  }
}

#copyright {
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  color: #FFF;
  font-size: 0.6rem;
}

/*** Mise en forme du footer ***/
@media all and (min-width:980px) {

    #mon_footer .et_pb_column:nth-child(1) {
      width: 45%!important;
    }
    #mon_footer .et_pb_column:nth-child(2) {
      width: 20%!important;
    }
    #mon_footer .et_pb_column:nth-child(3) {
      width: 35%!important;
    }

}

#footer_titre p {
  font-family: 'Josefin Sans';
  font-size: 1.8rem;
  font-weight: 600;
  color: var(--coul-accroche);
}

#footer_texte p {
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  color: #FFF;
  font-size: 0.8rem;
  line-height: 1.3rem;
}


#footer_photo img {
  border: 4px solid white;
  border-radius: 6px;
  rotate: 2deg;
}

@media all and (max-width: 479px) {

}