.elementor-kit-8{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-b5aeb33:#F3F8FF;--e-global-color-c58817e:#1A2641;--e-global-color-5420d44:#3073d4;--e-global-color-58be983:#ffffff;--e-global-color-09cc561:#0d141a;--e-global-color-a495fd4:#B8C0CC;--e-global-color-dff8941:#6EC1E4;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;--e-global-typography-5535e8e-font-family:"Manrope";--e-global-typography-5535e8e-font-size:3rem;--e-global-typography-5535e8e-font-weight:700;--e-global-typography-c83476d-font-family:"Manrope";--e-global-typography-c83476d-font-size:2.5rem;--e-global-typography-c83476d-font-weight:bold;--e-global-typography-ff8f921-font-family:"Manrope";--e-global-typography-ff8f921-font-size:2.3rem;--e-global-typography-ff8f921-font-weight:bold;--e-global-typography-887fca2-font-family:"DMSans";--e-global-typography-887fca2-font-size:1rem;--e-global-typography-887fca2-font-weight:400;--e-global-typography-2142591-font-family:"DMSans";--e-global-typography-2142591-font-size:1rem;--e-global-typography-2142591-font-weight:700;--e-global-typography-6e52843-font-family:"DMSans";--e-global-typography-6e52843-font-size:1rem;--e-global-typography-6e52843-font-weight:500;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}.entry-title, .wp-block-post-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-8{--e-global-typography-c83476d-font-size:1.9rem;--e-global-typography-ff8f921-font-size:1.9rem;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* =====================================
   ANIMATION DES TITRES
   ===================================== */

.titre-reveal {
    opacity: 1;
    transform: none;
}

html.animation-titres-active .titre-reveal {
    opacity: 0;
    transform: translateY(20px) scale(0.7);

    transition:
        opacity 1.5s cubic-bezier(0.22, 1, 0.36, 1) 0.2s,
        transform 1.5s cubic-bezier(0.22, 1, 0.36, 1) 0.2s;

    will-change: opacity, transform;
}

html.animation-titres-active .titre-reveal.titre-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}


/* =====================================
   DÉCORATIONS
   ===================================== */

.deco-smiley,
.deco-fleur,
.deco-coeur {
    will-change: transform;
}


/* =====================================
   SMILEY
   ===================================== */

.deco-smiley {
    animation: flottement-smiley 4s ease-in-out infinite;
    margin-right: 50px;
}

@keyframes flottement-smiley {

    0%, 100% {
        transform: translate(0, 0) rotate(-3deg);
    }

    25% {
        transform: translate(-8px, -12px) rotate(5deg);
    }

    50% {
        transform: translate(8px, 10px) rotate(-5deg);
    }

    75% {
        transform: translate(-5px, -7px) rotate(4deg);
    }
}


/* =====================================
   FLEUR
   ===================================== */

.deco-fleur {
    animation: flottement-fleur 4.8s ease-in-out infinite;
}

@keyframes flottement-fleur {

    0%, 100% {
        transform: translate(0, 0) rotate(-4deg);
    }

    25% {
        transform: translate(8px, -12px) rotate(7deg);
    }

    50% {
        transform: translate(-8px, 10px) rotate(-6deg);
    }

    75% {
        transform: translate(5px, -7px) rotate(5deg);
    }
}


/* =====================================
   COEUR
   ===================================== */

.deco-coeur {
    animation: flottement-coeur 4.3s ease-in-out infinite;
}

@keyframes flottement-coeur {

    0%, 100% {
        transform: translate(0, 0) rotate(-3deg);
    }

    25% {
        transform: translate(-8px, -12px) rotate(6deg);
    }

    50% {
        transform: translate(8px, 10px) rotate(-6deg);
    }

    75% {
        transform: translate(-5px, -7px) rotate(5deg);
    }
}


/* =====================================
   MOBILE UNIQUEMENT
   ===================================== */

@media only screen and (max-width: 767px) {

    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: clip !important;
    }


    /* =====================================
       TAILLE DES DÉCORATIONS
       ===================================== */

    .deco-smiley,
    .deco-fleur,
    .deco-coeur {
        width: 100px !important;
        min-width: 100px !important;
        max-width: 100px !important;
        height: auto !important;
    }

    .deco-smiley img,
    .deco-fleur img,
    .deco-coeur img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
    }


    /* =====================================
       POSITION DU SMILEY
       ===================================== */

    .deco-smiley {
        margin-left: 10px !important;
    }


    /* =====================================
       POSITION DE LA FLEUR
       ===================================== */

    .deco-fleur {
        margin-left: 15px !important;
    }


    /* =====================================
       POSITION DU COEUR
       BEAUCOUP PLUS À GAUCHE
       ET PLUS BAS
       ===================================== */

    .deco-coeur {
        margin-right: 30px !important;
        margin-top: 110px !important;
        margin-bottom:17px !important;
    }


    /* =====================================
       ANIMATION SMILEY MOBILE
       ===================================== */

    @keyframes flottement-smiley {

        0%, 100% {
            transform: translate(0, 0) rotate(-4deg);
        }

        25% {
            transform: translate(-5px, -8px) rotate(7deg);
        }

        50% {
            transform: translate(5px, 8px) rotate(-7deg);
        }

        75% {
            transform: translate(-3px, -5px) rotate(5deg);
        }
    }


    /* =====================================
       ANIMATION FLEUR MOBILE
       ===================================== */

    @keyframes flottement-fleur {

        0%, 100% {
            transform: translate(0, 0) rotate(-5deg);
        }

        25% {
            transform: translate(5px, -8px) rotate(8deg);
        }

        50% {
            transform: translate(-5px, 8px) rotate(-8deg);
        }

        75% {
            transform: translate(3px, -5px) rotate(6deg);
        }
    }


    /* =====================================
       ANIMATION COEUR MOBILE
       ===================================== */

    @keyframes flottement-coeur {

        0%, 100% {
            transform: translate(0, 0) rotate(-4deg);
        }

        25% {
            transform: translate(-5px, -8px) rotate(7deg);
        }

        50% {
            transform: translate(5px, 8px) rotate(-7deg);
        }

        75% {
            transform: translate(-3px, -5px) rotate(6deg);
        }
    }
}


/* =====================================
   TEXTES AU SCROLL
   ===================================== */

.anim-scroll {
    opacity: 1;
    transform: none;
}

html.anim-scroll-active .anim-scroll {
    opacity: 0;
    transform: translateY(30px);

    transition:
        opacity 1s ease,
        transform 1s ease;
}

html.anim-scroll-active .anim-scroll.anim-visible {
    opacity: 1;
    transform: translateY(0);
}


/* =====================================
   ACCESSIBILITÉ
   ===================================== */

@media (prefers-reduced-motion: reduce) {

    html.anim-scroll-active .anim-scroll {
        opacity: 1;
        transform: none;
        transition: none;
    }
}/* End custom CSS */