header{
    background-color: #ffce00!important;
}
.header_bottom{
    background-color: #ffce00!important;
}

h4 {
    color:#ffffff!important;
}

.text_footer{
    color:#ffffff!important;
}

.titre_anime {
  position: relative;
  top: 0;
  
  
}

.q_logo {
    
    top: 60%!important;
     
}
.titre_anime:hover {
 top: -5px;

 animation: bounce 0.5s ease-out infinite alternate;
}

@keyframes bounce {
  0% {
    top: -5px;
}
100% {
    top: 0;
}
}


.txt_blanc_anime{
    color:#ffffff;
    transition: transform 0.3s ease;
}

.txt_blanc_anime:hover{
    color:#ffffff;
    transform: translateY(-5px);
    font-weight: bold;
}

 

 .txt_blanc_titre3 {
    color: #ffffff; /* Blanc uniquement pour ceux avec la classe */
    font-size: 25px!important;
}

.titre_anime2 {
  animation-name: monteDescend;
  animation-duration: 2s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

@keyframes monteDescend {
  0% {
    transform: translateY(0);
}
50% {
    transform: translateY(-10px);
}
100% {
    transform: translateY(0);
}
}



.page_header.fixed.scrolled .header_inner.clearfix .header_top_bottom_holder .header_bottom.clearfix .container .container_inner.clearfix nav.main_menu > ul > li>a{
    color:#fff!important;
}



.vc_custom_1682932871746{
   padding-top:102px!important;   
}

/*CUSTOM MOBILE DBURO */
/* Pour les écrans de taille inférieure ou égale à 768px (tablettes et mobiles) */
@media screen and (max-width: 768px) {
    h1 {
        font-size: 30px!important;
    }
}

/* Pour les écrans de taille inférieure ou égale à 480px (mobiles uniquement) */
@media screen and (max-width: 480px) {
    h1 {
       font-size: 30px!important;
   }
}




.circle_1::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-image: url('https://dburo.design/fr/wp-content/uploads/2024/12/dubeau.jpg'); /* Remplacez par l'URL de l'image 1 */
        background-position: center;
        opacity: 0.50; /* Opacité à 65 % */
        z-index: 0; /* Derrière le contenu */
        background-size: cover; /* L'image remplit tout le cercle */
        background-position: center; /* Centre l'image */
        z-index: 0; /* Derrière le contenu */
    }


    .circle_2::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-image: url('https://dburo.design/fr/wp-content/uploads/2024/12/dubien.jpg'); /* Remplacez par l'URL de l'image 2 */
            background-position: center;
            opacity: 0.50; /* Opacité à 65 % */
            z-index: 0; /* Derrière le contenu */
            background-size: cover; /* L'image remplit tout le cercle */
            background-position: center; /* Centre l'image */
            z-index: 0; /* Derrière le contenu */
        }

        .circle_3::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-size: cover;
            background-image: url('https://dburo.design/fr/wp-content/uploads/2024/12/dubio.jpg'); /* Remplacez par l'URL de l'image 3 */
                background-position: center;
                opacity: 0.50; /* Opacité à 65 % */
                z-index: 0; /* Derrière le contenu */
                background-size: cover; /* L'image remplit tout le cercle */
                background-position: center; /* Centre l'image */
                z-index: 0; /* Derrière le contenu */
            }

/* Styles pour chaque texte dans les cercles */
.text_circle_1, .text_circle_2, .text_circle_3 {
    position: relative;
    z-index: 1; /* Au-dessus du fond */
    text-align: center;
    color: #000000; /* Couleur dorée */
}

.text_circle_1 h2, .text_circle_2 h2, .text_circle_3 h2 {
    margin: 0;
    font-size: 1.2em;
    font-weight: bold;
    color: #a58013; /* Couleur dorée */
}

.text_circle_1 p, .text_circle_2 p, .text_circle_3 p {
    margin: 0;
    font-weight: bold;
    color: #000000;
}

.expression {
 width: 100%;
 min-height: 441px; /* Hauteur minimale */
 background-image: url(https://dburo.design/fr/wp-content/uploads/2024/12/Design-expression.png);
 background-size: contain; /* Adapte le fond pour qu'il ne soit pas coupé */
 background-position: center;
 background-repeat: no-repeat; /* Empêche la répétition */
 display: flex;
 align-items: center;
 justify-content: center;
 text-align: center;
 padding: 20px; /* Ajoute un peu de marge pour le texte */
 box-sizing: border-box; /* Inclut le padding dans les dimensions */
}

.expression p {
    margin-top: 15px; /* Ajout de la marge spécifiée */
    color: white; /* Couleur du texte (modifiable selon vos besoins) */
    font-size: 32px; /* Taille du texte (modifiable) */
    line-height: 1.5; /* Espacement entre les lignes */
    padding-right:80px;
    padding-left:80px;
    color:#000000;
}
.doree_texte{
    color:#a58013;
}

/* si mobile tablette ACCUEIL*/
@media (max-width: 800px) {

    .circle {
        width: 100%;
    }

    .expression {
        height: auto; /* S'ajuste automatiquement pour les écrans plus petits */
        padding: 20px; /* Ajoute du padding pour éviter que le contenu touche les bords */
    }

    .expression p {
        font-size: 1.2em; /* Réduit la taille du texte sur les écrans plus petits */
    }
    
    .text_circle_1 p, .text_circle_2 p, .text_circle_3 p {
        margin: 0;
        font-weight: bold;
        color: #000000;
        font-size: 10px!important;
    }

    .text_circle_1 h2, .text_circle_2 h2, .text_circle_3 h2 {
        margin: 0;
        font-size: 13px;
        font-weight: bold;
        color: #a58013; /* Couleur dorée */
    }


}


/* Pour les écrans plus petits */
@media screen and (max-width: 768px) {
  .expression {
    min-height: auto; /* Permet à l'élément de s'étendre si nécessaire */
    background-size: cover; /* Maintient le fond centré et étendu */
    padding: 10px; /* Réduit les marges */
}
.expression p {
    font-size: 1.5em; /* Adapte la taille du texte */
}
.content .container .container_inner.default_template_holder{
    padding-top:2px!important;
}
}

@media screen and (max-width: 480px) {
  .expression {
    min-height: auto;
    padding: 10px;
    font-size: 6px;
}
.expression p {
    font-size: 1.2em; /* Réduit encore la taille du texte pour les petits écrans */
}

}


@media (max-width: 468px) {

    .circle {
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        width: 100%;
        height:260px;
        border: 2px solid #a58013; /* Bordure dorée */
        border-radius: 50%;
        overflow: hidden; /* Pour contenir l'image de fond */
        margin: 2px; /* Espacement entre les cercles */
    }
    .text_circle_1 p, .text_circle_2 p, .text_circle_3 p {
        margin: 0;
        font-weight: bold;
        color: #000000;
        font-size: 12px!important;
    }
    .content .container .container_inner.default_template_holder{
        padding-top:2px!important;
    }

}

.content .container .container_inner.default_template_holder{
    padding-top:102px;
}

/* fond header 
VERT : #C1E14F
orange : #FA5E01
bleu : #0b1942

*/
.header_bottom {
    background-color: #C1E14F!important;
}

nav.main_menu ul li:hover, nav.main_menu ul li:hover a.current {
    background-color: #0b1942!important;
}

h4 {
    color:#000000!important;
}
body{

    color:#000000!important;
}

.header_bottom{
    height:10px!important;
}


h5 {
    color: #04ad14!important;
    font-weight: bold;
    
    text-transform: none !important;
}

.wp-block-button__link{
    background-color:#FA5E01!important;
}
.footer_top_holder{
    color:#fff!important;
}
nav.mobile_menu{
    background-color:#0b1942!important;
    border-radius: 5px;
	 box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.4);
}


nav.mobile_menu ul li{
	padding:5px!important;
}

/* effet menu haut */
@keyframes fade-to-black {
  0% {
    background-color: #FA5E01!important; /* couleur bordeaux */
}
100% {
    background-color: #dd9933!important; /* couleur noire */
}
}




/* formulaire contact */
input.wpcf7-form-control.wpcf7-text{

    box-sizing: border-box;
    width: 100%;
    margin: 0 0 27px;
    padding: 13px 17px;
    border: 0 none;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
    outline: 0 none;
    color: #ffffff;
    background-color: #001b42;
    resize: none;

}

textarea.wpcf7-form-control.wpcf7-textarea {
    box-sizing: border-box;
    width: 100%;
    margin: 0 0 27px;
    padding: 13px 17px;
    border: 0 none;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
    outline: 0 none;
    color: #ffffff;
    background-color: #001b42;
    resize: none;
    height: 100px;
}

input.wpcf7-form-control.wpcf7-submit {
    background-color: #ffce00!important;
    color:#ffffff!important;
}

input.wpcf7-form-control.wpcf7-submit:not([disabled]):hover {
    border-color: #ffce00;
    text-decoration: none;
    color: #001b42;
    background-color: transparent;
}

 
div.wpcf7-response-output {
    position: relative;
    margin-right: 0;
    margin-left: 0;
    padding: 17px 30px 17px 55px;
    border: 0;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 1px;
    color: #001b42!important;
}

.wpcf7-not-valid-tip {
    color:#04ad14!important;
    font-size: 13px!important;
    font-weight: bold!important;
}


/* FIN formulaire contact */


/* Footer COLONE */

.footer_top_holder {
    display: block;
    background-color:#1b3677!important;
    padding-top: 6px;
}
/*footer text*/
.footer_bottom_holder{
    background-image: linear-gradient(to bottom, #1b3677, #007aeb 68%);
}

/* fin Footer */