.mkd-portfolio-list-holder-outer.mkd-ptf-standard .mkd-ptf-item-title {
    font-size: 12px; /* Taille de la police */
    line-height: 20px !important; /* Interligne à 20px */
}
.mkd-portfolio-list-holder-outer.mkd-info-center .mkd-portfolio-list-holder .mkd-ptf-item-text-holder {
    padding: 3% 3% !important;
}

.mkd-accordion-holder .mkd-accordion-content p {
    line-height: 20px !important;
    margin: 20px 0 0 0 !important;
}

.single.single-portfolio-item .mkd-two-columns-66-33 .mkd-column1 .mkd-column-inner {
    padding: 0 0 0 50px; 
}



/* code ajouté pour le bouton retour au menu en version mobile sur le portfolio */

@media only screen and (max-width: 600px) {
.mkd-portfolio-single-holder .mkd-portfolio-single-nav .mkd-portfolio-back-btn {
display: initial;
}
}

@media only screen and (max-width: 600px) {
    .mkd-portfolio-single-holder .mkd-portfolio-single-nav .mkd-portfolio-single-next {
        margin-top: 0;
    }

    .mkd-portfolio-single-nav {
        display: flex;
    }

    .mkd-portfolio-single-holder .mkd-portfolio-single-nav .mkd-portfolio-back-btn{
        margin-top: 5px;
    }
}

@media only screen and (max-width: 600px) {
    .mkd-portfolio-single-holder .mkd-portfolio-single-nav .mkd-portfolio-single-prev {
         text-align: left;
    }
    
    .mkd-portfolio-single-holder .mkd-portfolio-single-nav .mkd-portfolio-single-next {
         text-align: right;
    }
}

@media (max-width: 768px) {
    #entete_bleue, 
    .vc_custom_1737053401793 {
        display: none !important;
    }
}



@media only screen and (min-width: 480px) and (max-width: 768px) {
    .mkd-section.mkd-parallax-section-holder {
        height: auto !important;
        min-height: 10px;
    }
}

@media only screen and (max-width: 480px) {
    .mkd-section-title-holder .mkd-section-title {
        font-size: 30px !important;
        line-height: 40px !important;
    }
}

/* couleur hover portfolio acceuil*/
.page-id-7009 .mkd-portfolio-list-holder-outer.mkd-ptf-standard.mkd-hover-dark .mkd-ptf-item-hover-holder .mkd-ptf-portfolio-overlay-bg {
    background-color: rgba(94, 214, 193, 0.95); /* Couleur différente pour cette page */
}

/* couleur hover portfolio page portfolio */
.page-id-5724 .mkd-portfolio-list-holder-outer.mkd-ptf-standard.mkd-hover-dark .mkd-ptf-item-hover-holder .mkd-ptf-portfolio-overlay-bg {
    background-color: rgba(255, 255, 255, 0.9); /* Couleur différente pour une autre page */
}

/* Ajouter le texte "Voir le projet" avec majuscules, changer la police */
.mkd-ptf-item-image-holder .mkd-ptf-item-hover-holder::after {
    content: "Voir"; /* Texte en majuscules */
    font-family: 'Quicksand', sans-serif; /* Police Quicksand */
    font-size: 16px; /* Taille du texte */
    font-weight: bold; /* Mettre le texte en gras */
    color: white; /* Couleur du texte */
    background-color: rgba(0, 0, 0, 0.7); /* Fond semi-transparent */
    padding: 10px 15px; /* Espacement autour du texte */
    border-radius: 5px; /* Coins arrondis */
    display: none; /* Cacher par défaut */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* Centrer le texte */
    z-index: 10; /* Placer au-dessus de l'image */
}

/* Afficher le texte au survol */
.mkd-ptf-item-image-holder .mkd-ptf-item-hover-holder:hover::after {
    display: flex; /* Afficher le texte au survol */
    background-color: rgba(0, 0, 0, 0.9); /* Fond plus sombre au survol */
}

/* Styles pour les écrans standards (ordinateur) */
.yarpp-thumbnails-horizontal .yarpp-thumbnail {
    width: 130px !important;
    height: 168px !important;
    margin: 0px !important;
    margin-left: 0px !important;
    border: 0px !important;
}

.yarpp-related {
    margin-top: 4em !important;
}

/* Styles spécifiques aux écrans mobiles */
@media (max-width: 768px) {
    .yarpp-thumbnails-horizontal .yarpp-thumbnail {
        width: 140px !important;
        height: 171px !important;
        margin: 5px !important;
        margin-left: 0px !important;
        border: 0px !important;
    }
}

@media (max-width: 768px) {
  /* Ajuste les marges et les espacements */
  .mkd-portfolio-list-holder-outer.mkd-info-center .mkd-portfolio-list-holder .mkd-ptf-item-text-holder {
    padding: 5% 8% !important; /* Augmente légèrement les marges internes */
  }

  .mkd-portfolio-list-holder-outer.mkd-ptf-with-spaces .mkd-portfolio-list-holder article {
    margin: 0 0 12%; /* Ajoute plus d'espace entre les articles */
  }
}

/*fix hauteur de la bannière bleu sur la page portfolio*/
@media only screen and (max-width: 480px) {
    .mkd-section.mkd-parallax-section-holder {
        height: auto !important;
        min-height: 0px;
    }
}

.touch .mkd-parallax-section-holder.mkd-parallax-section-holder-touch-disabled {
    height: auto !important;
    min-height: 0px;
}

@media (max-width: 768px) {
    .mkd-custom-font-holder {
        letter-spacing: 4px !important;
    }
}

.page-id-5724.mkd-header-standard .mkd-page-header .mkd-menu-area .mkd-grid .mkd-vertical-align-containers {
    border-bottom: none !important;
}

/* Pour page à propos - Appliquer uniquement à la page*/
/* Appliquer uniquement sur mobile (max 480px) */
@media only screen and (max-width: 480px) {
    /* Ajuster le texte "À propos" */
    .page-id-8587 h2 span {
        font-size: 63px !important;
        line-height: 33px !important;
        letter-spacing: 2px !important;
    }
}

/* Appliquer uniquement sur tablettes (768px à 1024px) */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .page-id-8587 .mkd-elements-holder-item-content.mkd-elements-holder-custom-725470 {
        padding: 4% 0 34% 0 !important;
    }
}

/* cacher l'espace laissé en haut de la page portfolio car cache des 6 pictos et textes */
@media (max-width: 768px) {
    body.page-id-5724 .vc_custom_1738600679908 {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .yarpp-thumbnails-horizontal .yarpp-thumbnail {
        width: 125px !important;
    }
}

@media only screen and (min-width: 480px) and (max-width: 768px) {
    h1 {
        line-height: 31px;
        line-height: 38px !important;
    }
}

/* h1 du titre plus petit sur l'acceuil : la communication visuelle illustrée... */
@media only screen and (max-width: 480px) {
h1 {
        font-size: 30px !important;
        line-height: 38px !important;
    }
}



/* enlever l'espace padding autour du slider avec les logos des clients */
.page-id-7009 .mkd-zooming-slider-holder .slick-list {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

/* mise en page header contact ecran 480px */
@media only screen and (max-width: 480px) {
    .page-id-8879 .mkd-elements-holder-item-content h1 span {
        font-size: 20px !important; /* Ajuste la taille du texte */
        line-height: 22px !important; /* Ajuste l'interligne */
        letter-spacing: 2px !important; /* Ajuste l'espacement des lettres */
    }
}
/* mise en page header contact ecran 768-1024px */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .page-id-8879 .mkd-elements-holder-item-content h1 span {
        font-size: 45px !important; /* Taille du texte */
        line-height: 69px !important; /* Espacement des lignes */
        letter-spacing: 2px !important; /* Espacement des lettres */
    }
}

/* mise en page header contact ecran 480 et 768 */
@media only screen and (min-width: 480px) and (max-width: 768px) {
    .page-id-8879 .mkd-elements-holder-item-content h1 span {
        font-size: 42px !important; /* Taille du texte */
        line-height: 81px !important; /* Espacement des lignes */
        letter-spacing: 0px !important; /* Espacement des lettres */
    }
}
/* mise en page header contact ecran 1024 - 1280 */
@media only screen and (min-width: 1024px) and (max-width: 1280px) {
    .page-id-8879 .mkd-elements-holder-item-content h1 span {
        font-size: 44px !important; /* Taille du texte */
        line-height: 70px !important; /* Espacement des lignes */
        letter-spacing: 3px !important; /* Espacement des lettres */
    }
}

/* texte footer doit être blanc */
.wp-block-heading {
  color: #ffffff;
}


/* passer le texte en noir sur les accordéons FAQ */
.mkd-accordion-holder .mkd-accordion-content p {
    color: #000;
}

/* taille texte h1 sur page portfolio */
.page-id-5724 h1 {
    margin-top: 5px!important; /* Marge supérieure */
    margin-bottom: 4px!important; /* Marge inférieure */
    line-height: 34px!important; /* Interlignage */
    letter-spacing: 1px!important; /* Espacement entre les lettres */
}

/* taille texte h1 sur page portfolio version mobile */
@media only screen and (max-width: 760px) {
    .page-id-5724 h1 {
        font-family: 'Quicksand', sans-serif; /* Police Quicksand */
        font-size: 16px !important; /* Taille ajustée pour la version mobile */
        padding: 0px 0px !important; /* Espacement autour du texte */
        letter-spacing: 0.1em!important; /* Ajuster l'interlettrage */
        line-height: 1.2!important; /* Ajuster l'interlignage pour mobile */
    }
}

/* Pour les écrans 4K (3840px et plus) */
@media screen and (min-width: 3840px) { 
    .page-id-8879 .mkd-parallax-section-holder {
        background-image: url(https://www.sophiadessine.fr/illustrateur-motion-video-freelance/wp-content/uploads/2025/02/contact_grand.png) !important; /* Image optimisée pour 4K */
        background-size: 100% auto !important; /* Largeur à 170%, hauteur auto */
        background-position: center top !important; /* Centre en haut */
        background-repeat: no-repeat !important; /* Empêche la répétition */
        background-attachment: fixed !important; /* Fixe l’image en fond */
        background-color: #fafafa !important; /* Couleur de fond */
    }
}

/* Pour les écrans entre 3200px et 3839px (résolution proche de 2K) */
@media only screen and (min-width: 3200px) and (max-width: 3839px) { 
    .page-id-8879 .mkd-parallax-section-holder {
        background-image: url(https://www.sophiadessine.fr/illustrateur-motion-video-freelance/wp-content/uploads/2025/02/contact_grand.png) !important; /* Image optimisée pour 2K */
        background-size: 115% auto !important; /* Largeur à 175%, hauteur auto */
        background-position: center top !important; /* Centre en haut */
        background-repeat: no-repeat !important; /* Empêche la répétition */
        background-attachment: fixed !important; /* Fixe l’image en fond */
        background-color: #fafafa !important; /* Couleur de fond */
    }
}
/* cacher le titre du site sur les mobiles */
@media (max-width: 768px) {
    .mob-menu-logo-holder {
        display: none;
    }
}