{"id":3971,"date":"2026-07-22T15:51:09","date_gmt":"2026-07-22T15:51:09","guid":{"rendered":"https:\/\/nobrainnogain.org\/graphiste\/?post_type=projets&#038;p=3971"},"modified":"2026-08-27T22:30:48","modified_gmt":"2026-08-27T22:30:48","slug":"75h-de-la-serigraphie","status":"publish","type":"projets","link":"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/75h-de-la-serigraphie\/","title":{"rendered":"75h de la S\u00e9rigraphie"},"content":{"rendered":"\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"elementor-element elementor-element-8b4cb2d elementor-widget elementor-widget-heading\" data-id=\"8b4cb2d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n<div class=\"elementor-widget-container\">\n<h2 class=\"elementor-heading-title elementor-size-default\">75h de la S\u00e9rigraphie<\/h2>\n<\/div>\n<\/div>\n<div class=\"elementor-element elementor-element-b27ae09 elementor-widget elementor-widget-text-editor\" data-id=\"b27ae09\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n<div class=\"elementor-widget-container\">\n<p>En 2022, le festival Kraft rejoignait le festival <a href=\"https:\/\/www.lemonstre.ch\/agenda.html\" target=\"_blank\" rel=\"noopener\">Monstre<\/a> dans l\u2019atelier de <a href=\"https:\/\/www.usine.ch\/espaces\/crache-papier\" target=\"_blank\" rel=\"noopener\">Crache papier<\/a> \u00e0 Gen\u00e8ve ! et les deux ateliers organisaient les 75 heures de la s\u00e9rigraphie. Trois jours de cr\u00e9ation effr\u00e9n\u00e9e dans le milieu underground genevois !<\/p>\n<\/div>\n<\/div>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"684\" height=\"1012\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie.webp\" alt=\"\" class=\"wp-image-3703\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie.webp 684w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie-203x300.webp 203w\" sizes=\"auto, (max-width: 684px) 100vw, 684px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:50%\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"662\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/Perfectionement-serigraphie.webp\" alt=\"\" class=\"wp-image-3845\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/Perfectionement-serigraphie.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/Perfectionement-serigraphie-300x194.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/Perfectionement-serigraphie-768x497.webp 768w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<style data-wp-block-html=\"css\">\n```css\n\/* =====================================================\n   CONTENEUR DU CARROUSEL\n   ===================================================== *\/\n\n.custom-carousel {\n\n    \/*\n     * IMPORTANT :\n     *\n     * 100% = largeur du bloc HTML GeneratePress.\n     *\n     * On n'utilise PAS 100vw.\n     *\/\n\n    width: 100%;\n    max-width: 100%;\n\n    \/*\n     * Le carrousel ne peut jamais d\u00e9passer\n     * son propre bloc.\n     *\/\n\n    overflow: hidden;\n\n    \/*\n     * S\u00e9curit\u00e9 contre les marges\/paddings\n     * h\u00e9rit\u00e9s du th\u00e8me.\n     *\/\n\n    margin: 0;\n    padding: 0;\n\n    position: relative;\n\n    box-sizing: border-box;\n}\n\n\n\/* =====================================================\n   SWIPER\n   ===================================================== *\/\n\n.custom-carousel .customSwiper {\n\n    \/*\n     * Prend exactement la largeur du bloc parent.\n     *\/\n\n    width: 100%;\n    max-width: 100%;\n\n    \/*\n     * Hauteur du carrousel.\n     *\n     * \u00c0 adapter selon ton design.\n     *\/\n\n    height: 70vh;\n\n    \/*\n     * Limites raisonnables.\n     *\/\n\n    min-height: 450px;\n    max-height: 750px;\n\n    \/*\n     * Emp\u00eache tout d\u00e9bordement.\n     *\/\n\n    overflow: hidden;\n\n    margin: 0;\n    padding: 0;\n\n    box-sizing: border-box;\n}\n\n\n\/* =====================================================\n   WRAPPER\n   ===================================================== *\/\n\n.custom-carousel .swiper-wrapper {\n\n    width: 100%;\n    height: 100%;\n}\n\n\n\/* =====================================================\n   SLIDES\n   ===================================================== *\/\n\n.custom-carousel .swiper-slide {\n\n    \/*\n     * Une slide = exactement la largeur\n     * disponible dans le bloc.\n     *\/\n\n    width: 100%;\n\n    height: 100%;\n\n    position: relative;\n\n    overflow: hidden;\n\n    margin: 0;\n    padding: 0;\n\n    box-sizing: border-box;\n}\n\n\n\/* =====================================================\n   IMAGES\n   ===================================================== *\/\n\n.custom-carousel .swiper-slide img {\n\n    \/*\n     * L'image prend toute la slide.\n     *\/\n\n    display: block;\n\n    width: 100%;\n    height: 100%;\n\n    \/*\n     * L'image remplit le cadre\n     * sans \u00eatre d\u00e9form\u00e9e.\n     *\/\n\n    object-fit: cover;\n\n    \/*\n     * Supprime les styles potentiels\n     * de GeneratePress.\n     *\/\n\n    margin: 0;\n    padding: 0;\n\n    border: 0;\n\n    box-sizing: border-box;\n}\n\n\n\/* =====================================================\n   FL\u00c8CHES\n   ===================================================== *\/\n\n.custom-carousel .swiper-button-prev,\n.custom-carousel .swiper-button-next {\n\n    \/*\n     * Blanc\n     *\/\n\n    color: #ffffff !important;\n\n    \/*\n     * Emp\u00eache GeneratePress de modifier\n     * leur apparence.\n     *\/\n\n    opacity: 1 !important;\n\n    background: transparent !important;\n\n    border: 0 !important;\n\n    box-shadow: none !important;\n\n    z-index: 10;\n}\n\n\n\/*\n * Ic\u00f4nes des fl\u00e8ches\n *\/\n\n.custom-carousel .swiper-button-prev::after,\n.custom-carousel .swiper-button-next::after {\n\n    color: #ffffff !important;\n\n    font-size: 30px !important;\n\n    font-weight: 400;\n}\n\n\n\/* =====================================================\n   PAGINATION\n   ===================================================== *\/\n\n.custom-carousel .swiper-pagination {\n\n    z-index: 10;\n}\n\n\n\/*\n * Bullet normal\n *\/\n\n.custom-carousel .swiper-pagination-bullet {\n\n    width: 9px;\n    height: 9px;\n\n    background: #ffffff !important;\n\n    opacity: 0.45 !important;\n\n    margin: 0 5px !important;\n}\n\n\n\/*\n * Bullet actif\n *\/\n\n.custom-carousel .swiper-pagination-bullet-active {\n\n    background: #ffffff !important;\n\n    opacity: 1 !important;\n}\n\n\n\/* =====================================================\n   MOBILE\n   ===================================================== *\/\n\n@media (max-width: 768px) {\n\n    .custom-carousel .customSwiper {\n\n        \/*\n         * Hauteur mobile\n         *\/\n\n        height: 55vh;\n\n        min-height: 350px;\n\n        max-height: 600px;\n    }\n\n\n    \/*\n     * Fl\u00e8ches plus petites\n     *\/\n\n    .custom-carousel .swiper-button-prev::after,\n    .custom-carousel .swiper-button-next::after {\n\n        font-size: 24px !important;\n    }\n\n\n    \/*\n     * Bullets plus petits\n     *\/\n\n    .custom-carousel .swiper-pagination-bullet {\n\n        width: 8px;\n        height: 8px;\n\n        margin: 0 4px !important;\n    }\n\n}\n\n\n\/* =====================================================\n   PETITS SMARTPHONES\n   ===================================================== *\/\n\n@media (max-width: 480px) {\n\n    .custom-carousel .customSwiper {\n\n        height: 50vh;\n\n        min-height: 300px;\n\n        max-height: 500px;\n    }\n\n}\n```\n<\/style>\n\n<!-- =====================================================\n     SWIPER - CSS EXTERNE\n     ===================================================== -->\n\n<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.css\">\n\n\n<!-- =====================================================\n     CARROUSEL\n     \n     Le carrousel reste STRICTEMENT dans\n     les dimensions du bloc HTML.\n     ===================================================== -->\n\n<div class=\"custom-carousel\">\n\n    <div class=\"swiper customSwiper\">\n\n        <div class=\"swiper-wrapper\">\n\n\n            <!-- ================= SLIDE 1 ================= -->\n\n            <div class=\"swiper-slide\">\n\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-1.webp\" alt=\"Projet graphique nudiste 1\">\n\n            <\/div>\n\n\n            <!-- ================= SLIDE 2 ================= -->\n\n            <div class=\"swiper-slide\">\n\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudistes-2.webp\" alt=\"Projet graphique nudiste 2\">\n\n            <\/div>\n\n\n            <!-- ================= SLIDE 3 ================= -->\n\n            <div class=\"swiper-slide\">\n\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-3.webp\" alt=\"Projet graphique nudiste 3\">\n\n            <\/div>\n\n\n            <!-- ================= SLIDE 4 ================= -->\n\n            <div class=\"swiper-slide\">\n\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-4.webp\" alt=\"Projet graphique nudiste 4\">\n\n            <\/div>\n\n\n            <!-- ================= SLIDE 5 ================= -->\n\n            <div class=\"swiper-slide\">\n\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-5.webp\" alt=\"Projet graphique nudiste 5\">\n\n            <\/div>\n\n\n            <!-- ================= SLIDE 6 ================= -->\n\n            <div class=\"swiper-slide\">\n\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-6.webp\" alt=\"Projet graphique nudiste 6\">\n\n            <\/div>\n\n\n            <!-- ================= SLIDE 7 ================= -->\n\n            <div class=\"swiper-slide\">\n\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-7.webp\" alt=\"Projet graphique nudiste 7\">\n\n            <\/div>\n\n\n            <!-- ================= SLIDE 8 ================= -->\n\n            <div class=\"swiper-slide\">\n\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-8.webp\" alt=\"Projet graphique nudiste 8\">\n\n            <\/div>\n\n\n        <\/div>\n\n\n        <!-- =================================================\n             NAVIGATION\n             ================================================= -->\n\n        <div class=\"swiper-button-prev\"><\/div>\n\n        <div class=\"swiper-button-next\"><\/div>\n\n\n        <!-- =================================================\n             PAGINATION\n             ================================================= -->\n\n        <div class=\"swiper-pagination\"><\/div>\n\n    <\/div>\n\n<\/div>\n\n\n<!-- =====================================================\n     SWIPER - JAVASCRIPT EXTERNE\n     ===================================================== -->\n\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.js\">\n<\/script>\n\n\n<!-- =====================================================\n     INITIALISATION\n     ===================================================== -->\n\n<script>\n\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n\n    const carousel = document.querySelector(\".customSwiper\");\n\n    \/*\n     * On v\u00e9rifie que le carrousel existe.\n     *\/\n\n    if (!carousel) {\n        return;\n    }\n\n\n    \/*\n     * On v\u00e9rifie que Swiper a bien \u00e9t\u00e9 charg\u00e9.\n     *\/\n\n    if (typeof Swiper === \"undefined\") {\n\n        console.error(\"Swiper n'est pas charg\u00e9.\");\n\n        return;\n    }\n\n\n    \/*\n     * Cr\u00e9ation du carrousel\n     *\/\n\n    new Swiper(carousel, {\n\n        \/*\n         * Boucle infinie\n         *\/\n\n        loop: true,\n\n\n        \/*\n         * Lecture automatique\n         *\/\n\n        autoplay: {\n\n            delay: 5000,\n\n            \/*\n             * Continue apr\u00e8s un clic\n             *\/\n\n            disableOnInteraction: false\n\n        },\n\n\n        \/*\n         * Vitesse de transition\n         *\/\n\n        speed: 900,\n\n\n        \/*\n         * Une slide \u00e0 la fois\n         *\/\n\n        slidesPerView: 1,\n\n\n        \/*\n         * Navigation\n         *\/\n\n        navigation: {\n\n            nextEl: carousel.querySelector(\".swiper-button-next\"),\n\n            prevEl: carousel.querySelector(\".swiper-button-prev\")\n\n        },\n\n\n        \/*\n         * Pagination\n         *\/\n\n        pagination: {\n\n            el: carousel.querySelector(\".swiper-pagination\"),\n\n            clickable: true\n\n        },\n\n\n        \/*\n         * Animation classique\n         *\/\n\n        effect: \"slide\",\n\n\n        \/*\n         * Mise \u00e0 jour automatique lorsque\n         * la largeur du bloc change.\n         *\/\n\n        observer: true,\n\n        observeParents: true,\n\n        resizeObserver: true\n\n    });\n\n});\n\n<\/script>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h3>Visitez LGBTQUIA+<\/h3>\n<p>S\u00e9rigraphie Tentez le voyage<br \/>Th\u00e8me :Le voyage Contrainte : Fond de pot<br \/>Un travail autour du d\u00e9grad\u00e9 et du contraste avec la profondeur du noir. Une illustration vectoriel avec un design inspir\u00e9 des cartoons des ann\u00e9es 80. Une s\u00e9rigraphie militante qui c\u00e9l\u00e8bre les fiert\u00e9s r\u00e9alis\u00e9es en 2022 en format carte postale (toute \u00e9coul\u00e9e).<\/p>\n\n\n\n<h3>Les nudistes \u00e0 Gen\u00e8ve<\/h3>\n<p>Th\u00e8me : Naturisme Contrainte : Sans calage<br \/>le concept graphique s\u2019articule autour du point d\u2019attention de l\u2019image. Les photo en noir et blanc en trame de demi-teintes viennent contraster avec le fluo de la feuille de vigne d\u00e9pos\u00e9 au hasard par la contrainte sans calage. Le regard est automatiquement attir\u00e9 par la vibrance du fluo. Mais ces derni\u00e8res ne cachent rien, un joli pied de nez \u00e0 la pudibonderie ! <br \/>Un tirage durant l\u2019\u00e9v\u00e9nement en carte postale (toute \u00e9coul\u00e9e) et un retirage en carte postale avec une d\u00e9fonce pour faire ressortir le fluo.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:25%\">\n<style data-wp-block-html=\"css\">\n.button-link {\n  display: inline-flex;\n  text-decoration: none;\n  color: inherit;\n  line-height: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  line-height: 0;\n\n\n}\n\n.button-icon {\n  display: flex;\n  align-items: stretch;\n  border: 10px #fff solid;\n  width: fit-content;\n  height: fit-content;\n  cursor: pointer;\n}\n\n.icon {\n  background-color: #fff;\n  padding: 10px 10px 5px 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.icon img {\n  display: block;\n  width: 25px;\n  height: 25px;\n  object-fit: contain;\n}\n\n.cube {\n  transition: all 0.4s;\n  transform-style: preserve-3d;\n  width: 200px;\n  height: 20px;\n}\n\n.button-icon:hover {\n  border-color: #e6921c;\n}\n\n.button-icon:hover .cube {\n  transform: rotateX(90deg);\n}\n\n.side {\n  position: absolute;\n  height: 47px;\n  width: 200px;\n  display: flex;\n  font-size: 0.8em;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  font-weight: bold;\n}\n\n.top {\n  background: #e6921c;\n  color: #fff;\n  transform: rotateX(-90deg) translate3d(0, 13.5px, 2em);\n}\n\n.front {\n  background: #222229;\n  color: #fff;\n  transform: translate3d(0, 0, 1em);\n}\n<\/style>\n\n<a href=\"https:\/\/nobrainnogain.org\/graphiste\/serigraphie\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"button-link\">\n\n  <div class=\"button-icon\">\n    \n    <div class=\"icon\">\n      <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/07\/serig.svg\" alt=\"Proposer un projet\">\n    <\/div>\n\n    <div class=\"cube\">\n      <span class=\"side front\">S\u00e9rigraphie<\/span>\n      <span class=\"side top\">En savoir plus<\/span>\n    <\/div>\n\n  <\/div>\n\n<\/a>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:25%\">\n<style data-wp-block-html=\"css\">\n.button-link {\n  display: inline-flex;\n  text-decoration: none;\n  color: inherit;\n  line-height: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  line-height: 0;\n\n\n}\n\n.button-icon {\n  display: flex;\n  align-items: stretch;\n  border: 10px #fff solid;\n  width: fit-content;\n  height: fit-content;\n  cursor: pointer;\n}\n\n.icon {\n  background-color: #fff;\n  padding: 10px 10px 5px 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.icon img {\n  display: block;\n  width: 25px;\n  height: 25px;\n  object-fit: contain;\n}\n\n.cube {\n  transition: all 0.4s;\n  transform-style: preserve-3d;\n  width: 200px;\n  height: 20px;\n}\n\n.button-icon:hover {\n  border-color: #e6921c;\n}\n\n.button-icon:hover .cube {\n  transform: rotateX(90deg);\n}\n\n.side {\n  position: absolute;\n  height: 47px;\n  width: 200px;\n  display: flex;\n  font-size: 0.8em;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  font-weight: bold;\n}\n\n.top {\n  background: #e6921c;\n  color: #fff;\n  transform: rotateX(-90deg) translate3d(0, 13.5px, 2em);\n}\n\n.front {\n  background: #222229;\n  color: #fff;\n  transform: translate3d(0, 0, 1em);\n}\n<\/style>\n\n<a href=\"https:\/\/nobrainnogain.org\/graphiste\/prendre-rendez-vous-graphiste-freelance-nantes-44\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"button-link\">\n\n  <div class=\"button-icon\">\n    \n    <div class=\"icon\">\n      <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/07\/rdv.svg\" alt=\"Prendre rendez-vous\">\n    <\/div>\n\n    <div class=\"cube\">\n      <span class=\"side front\">prendre rdv<\/span>\n      <span class=\"side top\">gratuitement<\/span>\n    <\/div>\n\n  <\/div>\n\n<\/a>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:25%\">\n<style data-wp-block-html=\"css\">\n.button-link {\n  display: inline-flex;\n  text-decoration: none;\n  color: inherit;\n  line-height: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  line-height: 0;\n\n\n}\n\n.button-icon {\n  display: flex;\n  align-items: stretch;\n  border: 10px #fff solid;\n  width: fit-content;\n  height: fit-content;\n  cursor: pointer;\n}\n\n.icon {\n  background-color: #fff;\n  padding: 10px 10px 5px 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.icon img {\n  display: block;\n  width: 25px;\n  height: 25px;\n  object-fit: contain;\n}\n\n.cube {\n  transition: all 0.4s;\n  transform-style: preserve-3d;\n  width: 200px;\n  height: 20px;\n}\n\n.button-icon:hover {\n  border-color: #e6921c;\n}\n\n.button-icon:hover .cube {\n  transform: rotateX(90deg);\n}\n\n.side {\n  position: absolute;\n  height: 47px;\n  width: 200px;\n  display: flex;\n  font-size: 0.8em;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  font-weight: bold;\n}\n\n.top {\n  background: #e6921c;\n  color: #fff;\n  transform: rotateX(-90deg) translate3d(0, 13.5px, 2em);\n}\n\n.front {\n  background: #222229;\n  color: #fff;\n  transform: translate3d(0, 0, 1em);\n}\n<\/style>\n\n<a href=\"https:\/\/nobrainnogain.org\/graphiste\/contact-graphiste-nantes\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"button-link\">\n\n  <div class=\"button-icon\">\n    \n    <div class=\"icon\">\n      <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/07\/mail.svg\" alt=\"Proposer un projet\">\n    <\/div>\n\n    <div class=\"cube\">\n      <span class=\"side front\">Proposer un projet<\/span>\n      <span class=\"side top\">Contactez-moi<\/span>\n    <\/div>\n\n  <\/div>\n\n<\/a>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:25%\">\n<style data-wp-block-html=\"css\">\n.button-link {\n  display: inline-flex;\n  text-decoration: none;\n  color: inherit;\n  line-height: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  line-height: 0;\n\n\n}\n\n.button-icon {\n  display: flex;\n  align-items: stretch;\n  border: 10px #fff solid;\n  width: fit-content;\n  height: fit-content;\n  cursor: pointer;\n}\n\n.icon {\n  background-color: #fff;\n  padding: 10px 10px 5px 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.icon img {\n  display: block;\n  width: 25px;\n  height: 25px;\n  object-fit: contain;\n}\n\n.cube {\n  transition: all 0.4s;\n  transform-style: preserve-3d;\n  width: 200px;\n  height: 20px;\n}\n\n.button-icon:hover {\n  border-color: #e6921c;\n}\n\n.button-icon:hover .cube {\n  transform: rotateX(90deg);\n}\n\n.side {\n  position: absolute;\n  height: 47px;\n  width: 200px;\n  display: flex;\n  font-size: 0.8em;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  font-weight: bold;\n}\n\n.top {\n  background: #e6921c;\n  color: #fff;\n  transform: rotateX(-90deg) translate3d(0, 13.5px, 2em);\n}\n\n.front {\n  background: #222229;\n  color: #fff;\n  transform: translate3d(0, 0, 1em);\n}\n<\/style>\n\n<a href=\"https:\/\/nobrainnogain.org\/graphiste\/devis\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"button-link\">\n\n  <div class=\"button-icon\">\n    \n    <div class=\"icon\">\n      <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/07\/devis.svg\" alt=\"Demander un devis\">\n    <\/div>\n\n    <div class=\"cube\">\n      <span class=\"side front\">Demander un devis<\/span>\n      <span class=\"side top\">En ligne<\/span>\n    <\/div>\n\n  <\/div>\n\n<\/a>\n<\/div>\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading has-text-align-center has-x-large-font-size\">Voir d&rsquo;autres projets<\/h3>\n\n\n\n    <!-- data-uid identifie cette instance pr\u00e9cise du shortcode, utilis\u00e9 par le CSS et le JS plus bas -->\n    <div class=\"portfolio-select-wrapper\" data-uid=\"psf-1-bPhMMP\">\n\n        <!-- ========================= -->\n        <!-- SELECT DE FILTRE -->\n        <!-- ========================= -->\n        <div class=\"portfolio-select-filter\">\n            <select class=\"portfolio-filter-select\" id=\"psf-1-bPhMMP-filter\">\n\n                <!-- Option par d\u00e9faut : affiche tous les projets -->\n                <option value=\"*\">Toutes les cat\u00e9gories<\/option>\n\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"affiche\">\n                        Affiche                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"atelier\">\n                        Atelier                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"etiquette\">\n                        Etiquette                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"fanzine\">\n                        Fanzine                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"illustration\">\n                        Illustration                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"logo\">\n                        Logo                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"mise-en-page\">\n                        Mise en page                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"motion-design\">\n                        motion design                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"packaging\">\n                        Packaging                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"peinture-murale\">\n                        Peinture murale                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"residences\">\n                        R\u00e9sidences                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"serigraphie\">\n                        S\u00e9rigraphie                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"tatouages\">\n                        Tatouages                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"typographie\">\n                        Typographie                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"web-design\">\n                        web design                    <\/option>\n                \n            <\/select>\n        <\/div>\n\n        <!-- ========================= -->\n        <!-- GRILLE DE PROJETS -->\n        <!-- ========================= -->\n        <div class=\"portfolio-grid\">\n                                <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/miskatonic-university\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item illustration serigraphie\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"768\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/miskatonic-university-2-768x768.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"miskatonic university\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/miskatonic-university-2-768x768.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/miskatonic-university-2-300x300.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/miskatonic-university-2-150x150.webp 150w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/miskatonic-university-2.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Miskatonic University<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/logo-titan\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item logo\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"1086\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/logo-titan-768x1086-1.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"logo titan\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/logo-titan-768x1086-1.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/logo-titan-768x1086-1-212x300.webp 212w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/logo-titan-768x1086-1-724x1024.webp 724w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Logo titan<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/jump-of-rescue\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item motion-design\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"398\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/motion-design-jump-of-rescue-768x398.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"jump of rescue\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/motion-design-jump-of-rescue-768x398.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/motion-design-jump-of-rescue-300x155.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/motion-design-jump-of-rescue.webp 778w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Jump of rescue<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/tous-en-mer-logo-2\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item logo\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"768\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Tous-en-mer-logo.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Tous en mer logo\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Tous-en-mer-logo.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Tous-en-mer-logo-300x300.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Tous-en-mer-logo-150x150.webp 150w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>tous en mer logo<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/carte-de-presse-4\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item logo\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"724\" height=\"1024\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/carte-de-presse.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Carte de presse\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/carte-de-presse.webp 724w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/carte-de-presse-212x300.webp 212w\" sizes=\"auto, (max-width: 724px) 100vw, 724px\" \/>                                <\/div>\n                            \n                            <h3>Carte de presse<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/aurele-en-scene-2\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item web-design\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"538\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/aurele-en-scene-768x538.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"aurele en scene\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/aurele-en-scene-768x538.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/aurele-en-scene-300x210.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/aurele-en-scene-1024x717.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/aurele-en-scene-1536x1075.webp 1536w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/aurele-en-scene-2048x1434.webp 2048w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Aur\u00e8le en sc\u00e8ne<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/monde-de-merde-2\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"510\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/monde-de-merde-768x510.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"monde-de-merde\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/monde-de-merde-768x510.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/monde-de-merde-300x199.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/monde-de-merde.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Monde de merde<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/flyer-tous-en-mer\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item mise-en-page\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"595\" height=\"842\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/fly-tous-en-mer.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"flyer tous en mer\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/fly-tous-en-mer.webp 595w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/fly-tous-en-mer-212x300.webp 212w\" sizes=\"auto, (max-width: 595px) 100vw, 595px\" \/>                                <\/div>\n                            \n                            <h3>Flyer tous en mer<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/suzon-chaudron\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item illustration hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"551\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/suzon-chaudron-1-1-768x551.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"suzon chaudron\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/suzon-chaudron-1-1-768x551.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/suzon-chaudron-1-1-300x215.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/suzon-chaudron-1-1-1024x734.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/suzon-chaudron-1-1.webp 1280w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Suzon Chaudron<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/portevent-9\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item affiche atelier residences serigraphie hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"960\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/portevent--768x960.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/portevent--768x960.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/portevent--240x300.webp 240w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/portevent--819x1024.webp 819w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/01\/portevent-.webp 1080w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Portevent<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/fete-de-la-science-3\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item motion-design hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"432\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/12\/Fete-de-la-science-768x432.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"F\u00eate de la Science\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/12\/Fete-de-la-science-768x432.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/12\/Fete-de-la-science-300x169.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/12\/Fete-de-la-science-1024x576.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/12\/Fete-de-la-science.webp 1440w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>F\u00eate de la Science<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/fete-de-limprimerie-2\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item affiche hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"516\" height=\"768\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/fete-de-limprimerie.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"F\u00eate de l&#039;imprimerie\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/fete-de-limprimerie.webp 516w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/fete-de-limprimerie-202x300.webp 202w\" sizes=\"auto, (max-width: 516px) 100vw, 516px\" \/>                                <\/div>\n                            \n                            <h3>F\u00eate de l&rsquo;imprimerie<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/tatouages\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item tatouages hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"806\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/baleine-768x806.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/baleine-768x806.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/baleine-286x300.webp 286w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/baleine-975x1024.webp 975w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/baleine.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Tatouages<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/ginger-beer\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item etiquette hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"429\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/ginger-etiquette-4-768x429.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Ginger beer\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/ginger-etiquette-4-768x429.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/ginger-etiquette-4-300x168.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/ginger-etiquette-4.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Ginger beer<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/guillaume-blanchard-architecte\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item logo hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"284\" height=\"284\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Logo.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Guillaume Blanchard Architecte\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Logo.webp 284w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Logo-150x150.webp 150w\" sizes=\"auto, (max-width: 284px) 100vw, 284px\" \/>                                <\/div>\n                            \n                            <h3>Guillaume Blanchard Architecte<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/embrasez-qui-vous-voudrez\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item peinture-murale typographie hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"768\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/expo-gaelle-2-768x768.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Embrasez qui vous voudrez\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/expo-gaelle-2-768x768.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/expo-gaelle-2-300x300.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/expo-gaelle-2-1024x1024.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/expo-gaelle-2-150x150.webp 150w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/expo-gaelle-2.webp 1080w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Embrasez qui vous voudrez<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/enlevement-404\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item motion-design hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"373\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/404-vignette-768x373.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Enl\u00e8vement 404\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/404-vignette-768x373.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/404-vignette-300x146.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/404-vignette-1024x497.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/404-vignette-1536x745.webp 1536w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/404-vignette.webp 1715w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Enl\u00e8vement 404<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/consentis-la-methode-des-5-d\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item mise-en-page hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"461\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/mockup-flyer-ext-1-768x461.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Consentis La m\u00e9thode des 5 D\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/mockup-flyer-ext-1-768x461.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/mockup-flyer-ext-1-300x180.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/mockup-flyer-ext-1.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Consentis La m\u00e9thode des 5 D<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/refonte-site-madame-suzie\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item web-design hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"538\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/madame-suzie-production--768x538.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Refonte de site Madame Suzie\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/madame-suzie-production--768x538.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/madame-suzie-production--300x210.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/madame-suzie-production--1024x717.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/madame-suzie-production--1536x1075.webp 1536w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/madame-suzie-production-.webp 1920w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Refonte de site Madame Suzie<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/monogramme\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item typographie hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"741\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/monogramme-N-1536x1481-1-768x741.jpg\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"monogramme\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/monogramme-N-1536x1481-1-768x741.jpg 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/monogramme-N-1536x1481-1-300x289.jpg 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/monogramme-N-1536x1481-1-1024x987.jpg 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/monogramme-N-1536x1481-1.jpg 1536w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Monogramme<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/no-futur-social-club\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item affiche illustration hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"643\" height=\"1024\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/anti-social.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"No Futur Social Club\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/anti-social.webp 643w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/anti-social-188x300.webp 188w\" sizes=\"auto, (max-width: 643px) 100vw, 643px\" \/>                                <\/div>\n                            \n                            <h3>No Futur Social Club<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/ecos\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item atelier serigraphie hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"497\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/caroussel-ecos--768x497.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"ecos\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/caroussel-ecos--768x497.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/caroussel-ecos--300x194.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/caroussel-ecos-.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Ecos<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/dont-fuck-with-nunchuck\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item serigraphie hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"768\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/IMGP6846-768x768.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Don&#039;t fuck with nunchucks\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/IMGP6846-768x768.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/IMGP6846-300x300.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/IMGP6846-1024x1024.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/IMGP6846-150x150.webp 150w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/IMGP6846.webp 1080w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Don\u2019t fuck with nunchuck<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/boite-a-pizza-serigraphie\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item packaging serigraphie hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"462\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/06\/stella-suzie-768x462.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Bo\u00eete \u00e0 pizza s\u00e9rigraphi\u00e9e\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/06\/stella-suzie-768x462.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/06\/stella-suzie-300x180.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/06\/stella-suzie.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Bo\u00eete \u00e0 pizza s\u00e9rigraphi\u00e9<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/pepites-de-louest\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item web-design hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"538\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-768x538.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-768x538.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-300x210.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-1024x717.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-1536x1075.webp 1536w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-2048x1434.webp 2048w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>P\u00e9pites de l\u2019Ouest<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/cirque-la-compagnie\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item affiche illustration mise-en-page hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"576\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/couv-simones-768x576.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Cirque la compagnie\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/couv-simones-768x576.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/couv-simones-300x225.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/couv-simones.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Cirque la compagnie<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/coco-pasta\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item packaging hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"512\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Packaging-768x512.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Packaging \u00e9co con\u00e7u Coco Pasta\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Packaging-768x512.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Packaging-300x200.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Packaging.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Packaging \u00e9co con\u00e7u Coco Pasta<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/flyer-poln\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item mise-en-page hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"866\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--768x866.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--768x866.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--266x300.webp 266w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--908x1024.webp 908w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--1362x1536.webp 1362w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--1816x2048.webp 1816w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Flyer Poln<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/75h-de-la-serigraphie\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item residences serigraphie hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"684\" height=\"1012\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie.webp 684w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie-203x300.webp 203w\" sizes=\"auto, (max-width: 684px) 100vw, 684px\" \/>                                <\/div>\n                            \n                            <h3>75h de la S\u00e9rigraphie<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/heroine-de-la-modernites\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item motion-design hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"510\" height=\"895\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/vignette-heroines.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/vignette-heroines.webp 510w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/vignette-heroines-171x300.webp 171w\" sizes=\"auto, (max-width: 510px) 100vw, 510px\" \/>                                <\/div>\n                            \n                            <h3>H\u00e9ro\u00efne de la modernit\u00e9s<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/74-heures-de-la-serigraphie\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item residences serigraphie hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"756\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Kraft-74--768x756.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"74 heures de la s\u00e9rigraphie\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Kraft-74--768x756.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Kraft-74--300x295.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Kraft-74--1024x1008.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Kraft-74-.webp 1512w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>74 heures de la s\u00e9rigraphie<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/fanzine-la-mouche\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item fanzine illustration hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"724\" height=\"1024\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/la-mouche-n23-moche.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Fanzine la mouche\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/la-mouche-n23-moche.webp 724w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/la-mouche-n23-moche-212x300.webp 212w\" sizes=\"auto, (max-width: 724px) 100vw, 724px\" \/>                                <\/div>\n                            \n                            <h3>Fanzine la mouche<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/batgirl\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item motion-design hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"1\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/07\/batgirl-logo-1.svg\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Batgirl\" loading=\"lazy\" \/>                                <\/div>\n                            \n                            <h3>Batgirl<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/fata-morgana\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item serigraphie hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"563\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Fatamorgana-768x563.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Fatamorgana\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Fatamorgana-768x563.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Fatamorgana-300x220.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Fatamorgana-1024x751.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Fatamorgana.webp 1396w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Fata morgana<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/animation-de-logo\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item motion-design hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"1\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/07\/logo-sellerie.svg\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"animation de logo\" loading=\"lazy\" \/>                                <\/div>\n                            \n                            <h3>Animation de logo<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                            <\/div>\n\n        <!-- ========================= -->\n        <!-- BOUTON VOIR PLUS -->\n        <!-- ========================= -->\n        <div class=\"portfolio-load-more-wrap\">\n            <button class=\"portfolio-load-more\" id=\"psf-1-bPhMMP-loadmore\">\n                Voir plus            <\/button>\n        <\/div>\n\n    <\/div>\n\n    <!-- ================================================= -->\n    <!-- CSS -->\n    <!-- Chaque r\u00e8gle est pr\u00e9fix\u00e9e par [data-uid=\"...\"] pour isoler -->\n    <!-- le style de cette instance et \u00e9viter tout conflit si le -->\n    <!-- shortcode est utilis\u00e9 plusieurs fois sur la m\u00eame page. -->\n    <!-- ================================================= -->\n    <style>\n        \/* --- Conteneur du select --- *\/\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-select-filter {\n            position: relative;\n            margin-bottom: 40px;\n            font-family: Helvetica, sans-serif;\n            font-weight: 900;\n        }\n\n        \/* Petite fl\u00e8che custom (remplace la fl\u00e8che native du <select>) *\/\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-select-filter::after {\n            content: '\u2304';\n            color: #ffffff;              \/* corrig\u00e9 : \u00e9tait color:\"ffffff\" (invalide) *\/\n            position: absolute;\n            right: 20px;\n            top: 50%;\n            transform: translateY(-50%);\n            pointer-events: none;        \/* laisse les clics passer \u00e0 travers vers le select *\/\n            font-size: 18px;\n        }\n\n        \/* Style du <select> lui-m\u00eame, enti\u00e8rement pilot\u00e9 par les attributs du shortcode *\/\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-filter-select {\n            width: 100%;\n            padding: 16px 22px;\n            background: #0000;\n            color: #fff;\n            border: 5px solid #ffffff;\n            border-radius: 8px;\n            font-family: Helvetica, sans-serif;\n            font-weight: 900;\n            font-size: 20px;\n            line-height: 1.4;\n            cursor: pointer;\n            outline: none;\n            \/* supprime le style natif du select selon les navigateurs *\/\n            appearance: none;\n            -webkit-appearance: none;\n            -moz-appearance: none;\n            transition: .3s;\n        }\n\n        \/* --- Grille responsive : 4 colonnes desktop \/ 2 tablette \/ 1 mobile --- *\/\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-grid {\n            display: grid;\n            grid-template-columns: repeat(4, minmax(0, 1fr));\n            gap: 30px;\n        }\n\n        @media (max-width: 1024px) {\n            [data-uid=\"psf-1-bPhMMP\"] .portfolio-grid {\n                grid-template-columns: repeat(2, 1fr);\n            }\n        }\n\n        @media (max-width: 767px) {\n            [data-uid=\"psf-1-bPhMMP\"] .portfolio-grid {\n                grid-template-columns: 1fr;\n            }\n        }\n\n        \/* --- Item de la grille --- *\/\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-item {\n            transition: .3s;\n            overflow: hidden; \/* n\u00e9cessaire pour que le zoom au hover ne d\u00e9borde pas de la carte *\/\n        }\n\n        \/* Classe ajout\u00e9e en PHP pour cacher les projets au-del\u00e0 du 8e (voir plus haut) *\/\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-item.hidden {\n            display: none;\n        }\n\n        \/* --- Vignette (ratio fixe 4:3, quelle que soit la taille de l'image d'origine) --- *\/\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-thumb {\n            position: relative;\n            width: 100%;\n            aspect-ratio: 4 \/ 3;\n            overflow: hidden;\n            border-radius: 16px;\n        }\n\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-thumb img {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;   \/* recadre l'image pour remplir le cadre sans la d\u00e9former *\/\n            display: block;\n            transition: transform .5s ease;\n        }\n\n        \/* Effet de zoom l\u00e9ger sur l'image au survol de la carte *\/\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-item:hover img {\n            transform: scale(1.08);\n        }\n\n        \/* --- Bouton \"Voir plus\" --- *\/\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-load-more-wrap {\n            margin-top: 30px;\n            text-align: center;\n        }\n\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-load-more {\n            padding: 10px 20px;\n            border: none;\n            background: #111;\n            color: #ffffff;              \/* corrig\u00e9 : remplace la propri\u00e9t\u00e9 invalide font-color *\/\n            border-radius: 5px;\n            font-family: Helvetica, sans-serif;\n            font-weight: 900;\n            font-size: 20px;             \/* corrig\u00e9 : \"font-size:25px; bold\" n'\u00e9tait pas du CSS valide *\/\n            cursor: pointer;\n            transition: opacity .3s;\n        }\n\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-load-more:hover {\n            opacity: .85;\n        }\n\n        \/* --- Neutralise le style de lien par d\u00e9faut du navigateur sur les cartes --- *\/\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-link,\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-link:visited,\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-link:hover,\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-link:focus,\n        [data-uid=\"psf-1-bPhMMP\"] .portfolio-link:active {\n            text-decoration: none !important;\n            color: inherit;\n            display: block;\n        }\n    <\/style>\n\n    <!-- ================================================= -->\n    <!-- JAVASCRIPT -->\n    <!-- Encapsul\u00e9 dans une IIFE (fonction auto-ex\u00e9cut\u00e9e) : -->\n    <!-- aucune variable ne fuit dans l'espace global window, -->\n    <!-- donc aucun risque de conflit entre plusieurs instances -->\n    <!-- du shortcode ou avec d'autres scripts du th\u00e8me\/plugins. -->\n    <!-- ================================================= -->\n    <script>\n    (function() {\n        \/\/ On cible uniquement le wrapper de CETTE instance gr\u00e2ce \u00e0 data-uid\n        var wrapper = document.querySelector('[data-uid=\"psf-1-bPhMMP\"]');\n        if (!wrapper) return; \/\/ s\u00e9curit\u00e9 : si le wrapper n'existe pas, on arr\u00eate le script ici\n\n        var filter      = wrapper.querySelector('.portfolio-filter-select');\n        var items       = wrapper.querySelectorAll('.portfolio-item');\n        var loadMoreBtn = wrapper.querySelector('.portfolio-load-more');\n\n        \/**\n         * Applique le filtre choisi : affiche les 8 premiers items correspondant\n         * \u00e0 la cat\u00e9gorie s\u00e9lectionn\u00e9e, cache le reste.\n         *\/\n        function applyFilter(value) {\n            var visibleCount = 0;\n\n            items.forEach(function(item) {\n                item.classList.add('hidden'); \/\/ on cache tout par d\u00e9faut...\n\n                \/\/ \"*\" = toutes cat\u00e9gories, sinon on v\u00e9rifie la classe CSS correspondant au slug\n                var matches = (value === '*') || item.classList.contains(value);\n\n                if (matches) {\n                    if (visibleCount < 8) {\n                        item.classList.remove('hidden'); \/\/ ...puis on r\u00e9-affiche les 8 premiers correspondants\n                    }\n                    visibleCount++;\n                }\n            });\n\n            \/\/ Le bouton \"Voir plus\" ne s'affiche que s'il reste des \u00e9l\u00e9ments \u00e0 charger\n            loadMoreBtn.style.display = (visibleCount <= 8) ? 'none' : 'inline-block';\n        }\n\n        \/\/ D\u00e9clenche le filtrage \u00e0 chaque changement dans le <select>\n        if (filter) {\n            filter.addEventListener('change', function() {\n                applyFilter(this.value);\n            });\n        }\n\n        \/\/ Gestion du clic sur \"Voir plus\" : r\u00e9v\u00e8le 4 \u00e9l\u00e9ments cach\u00e9s suppl\u00e9mentaires\n        if (loadMoreBtn) {\n            loadMoreBtn.addEventListener('click', function() {\n                var value = filter ? filter.value : '*';\n                var hiddenItems = [];\n\n                \/\/ R\u00e9cup\u00e8re la liste des items actuellement cach\u00e9s ET correspondant au filtre actif\n                items.forEach(function(item) {\n                    if (item.classList.contains('hidden')) {\n                        if (value === '*' || item.classList.contains(value)) {\n                            hiddenItems.push(item);\n                        }\n                    }\n                });\n\n                \/\/ R\u00e9v\u00e8le les 4 premiers de cette liste\n                hiddenItems.slice(0, 4).forEach(function(item) {\n                    item.classList.remove('hidden');\n                });\n\n                \/\/ Recalcule combien il en reste de cach\u00e9s, pour savoir si on doit\n                \/\/ masquer le bouton \"Voir plus\" (plus rien \u00e0 charger)\n                var remaining = 0;\n                items.forEach(function(item) {\n                    if (item.classList.contains('hidden') && (value === '*' || item.classList.contains(value))) {\n                        remaining++;\n                    }\n                });\n\n                if (remaining === 0) {\n                    loadMoreBtn.style.display = 'none';\n                }\n            });\n        }\n    })();\n    <\/script>\n\n    \n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"featured_media":3703,"parent":0,"menu_order":0,"template":"","categorie-travaux":[13,14],"class_list":["post-3971","projets","type-projets","status-publish","has-post-thumbnail","hentry","categorie-travaux-residences","categorie-travaux-serigraphie"],"acf":[],"_links":{"self":[{"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/projets\/3971","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/projets"}],"about":[{"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/types\/projets"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/media\/3703"}],"wp:attachment":[{"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/media?parent=3971"}],"wp:term":[{"taxonomy":"categorie-travaux","embeddable":true,"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/categorie-travaux?post=3971"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}