diff --git a/Makefile b/Makefile
index d7a8fb39ea3d8a127524065789b7093d342d458b..6bbdda3ed90b286dcd9e562399ec66598919d757 100644
--- a/Makefile
+++ b/Makefile
@@ -14,7 +14,7 @@ install: node_modules copy_lib copy_samples submodules
 
 submodules:
 	git submodule init
-	git submodule update
+	git submodule update --recursive --remote
 
 build: $(DIST_DIR)/index.html $(DIST_DIR)/styles/index.css $(SCRIPT_DEST)
 
diff --git a/src/dependencies.pug b/src/dependencies.pug
index 93a27b5db8f521134f9d202fa74c0686d89691eb..711b96b06b7f3e3b35722ba4a2225f2c210e22d1 100644
--- a/src/dependencies.pug
+++ b/src/dependencies.pug
@@ -5,7 +5,7 @@ script(src="/lib/webcomponentsjs/webcomponents-loader.js")
 
 script(src="/lib/oidc-client.js")
 script(
-  src="/lib/sib-oidc/sib-oidc.js"
+  src="https://cdn.happy-dev.fr/sib-oidc/sib-oidc.js"
   data-authority=`${sdn}/openid/`,
   data-client_id=`${client_id}`,
   data-response_type='id_token token',
@@ -29,11 +29,11 @@ link(href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,6
 // Web components
 
 //- local
-link(rel='import', href='/lib/sib-core/sib-display.html')
-link(rel='import', href='/lib/sib-router/sib-router.html')
-//- link(rel='import', href='/lib/sib-chat/sib-chat.html')
+//- link(rel='import', href='/lib/sib-core/sib-display.html')
+  link(rel='import', href='/lib/sib-router/sib-router.html')
+  link(rel='import', href='/lib/sib-chat/sib-chat.html')
 
 //- cdn
-  link(rel='import', href="https://cdn.happy-dev.fr/sib-core/sib-display.html")
-  link(rel='import', href="https://cdn.happy-dev.fr/sib-router/sib-router.html")
+link(rel='import', href="https://cdn.happy-dev.fr/sib-core/sib-display.html")
+link(rel='import', href="https://cdn.happy-dev.fr/sib-router/sib-router.html")
 link(rel='import', href="https://cdn.happy-dev.fr/sib-chat/sib-chat.html")
diff --git a/src/header.pug b/src/header.pug
index a20b9813356c60684ef83ddd14951e4b6a220ca8..7301712c20c14f751f72004ff6a225177e13dbf8 100644
--- a/src/header.pug
+++ b/src/header.pug
@@ -15,8 +15,9 @@ details
   #notifications
     include page-notifications.pug
 
-#profile
-  img(src="/images/user.jpg")
-  span
-    | Profile
-    span.icon-arrow-down
+sib-display#profile(
+  data-fields='first_name,profile.picture',
+  widget-profile.picture='sib-display-img',
+  bind-user
+  )
+
diff --git a/src/menu.pug b/src/menu.pug
index 25b7d1474a25c661ddff97d267491ff971cfe645..d89e4d70848ff3f4cb574c6b6fdc3f0b9afc1dc2 100644
--- a/src/menu.pug
+++ b/src/menu.pug
@@ -17,7 +17,7 @@ nav#navbar
     div.menu-wrapper
       div.menu
         div.menu-chevron
-          div.menu-icon.icon-arrow-down
+          div.menu-icon.icon-arrow-up
         div.menu-label Projects
         div.menu-icon.icon-folder-alt
       sib-route(hidden,name='project', id-prefix=`${sdn}/projects/`)
@@ -31,7 +31,7 @@ nav#navbar
     div.menu-wrapper
       div.menu
         div.menu-chevron
-          div.menu-icon.icon-arrow-down
+          div.menu-icon.icon-arrow-up
         div.menu-label Groups
         div.menu-icon.icon-globe
       sib-route(hidden, name='group', id-prefix=`${sdn}/channels/`)
@@ -45,7 +45,7 @@ nav#navbar
     div.menu-wrapper
       div.menu
         div.menu-chevron
-          div.menu-icon.icon-arrow-down
+          div.menu-icon.icon-arrow-up
         div.menu-label Chat
         div.menu-icon.icon-envelope-letter
       sib-route(hidden, name='member-chat', id-prefix=`${sdn}/members/`)
diff --git a/src/menu.pug.orig b/src/menu.pug.orig
deleted file mode 100644
index 08c515edc4b7f2898d0ae79caa7adc3985ede9d0..0000000000000000000000000000000000000000
--- a/src/menu.pug.orig
+++ /dev/null
@@ -1,63 +0,0 @@
-nav#navbar
-  sib-router#navbar-router(default-route='members')
-    sib-route.menu(name='members')
-      div.menu-notification
-        div 1
-      div.menu-label Members
-      div.menu-icon.icon-people
-    sib-route.menu(hidden, name='member', id-prefix=`${sdn}/members/`)
-    div.divider
-    sib-route.menu(name='job-offers')
-      div.menu-notification
-        div 2
-      div.menu-label Job offers
-      div.menu-icon.icon-briefcase
-    sib-route(hidden, name='job-offer-create')
-    div.divider
-    div.menu-wrapper
-      div.menu
-        div.menu-chevron
-          div.menu-icon.icon-arrow-down
-        div.menu-label Projects
-        div.menu-icon.icon-folder-alt
-      sib-route(hidden,name='project', id-prefix=`${sdn}/projects/`)
-      div.sub-menu
-        sib-display(
-          data-src=`${sdn}/projects/`,
-          data-fields='name',
-          next='project'
-        )
-    div.divider
-    div.menu-wrapper
-      div.menu
-        div.menu-chevron
-          div.menu-icon.icon-arrow-down
-        div.menu-label Groups
-        div.menu-icon.icon-globe
-      sib-route(hidden, name='group', id-prefix=`${sdn}/channels/`)
-      div.sub-menu
-        sib-display(
-          data-src=`${sdn}/channels/`,
-          data-fields='name',
-          next='group'
-        )
-    div.divider
-    div.menu-wrapper
-      div.menu
-        div.menu-chevron
-          div.menu-icon.icon-arrow-down
-        div.menu-label Chat
-        div.menu-icon.icon-envelope-letter
-      sib-route(hidden, name='chat', id-prefix=`${sdn}/users/`)
-      div.sub-menu
-        sib-display(
-<<<<<<< HEAD
-          data-src=`${sdn}/members/`,
-          data-fields='pseudo',
-=======
-          data-src=`${sdn}/users/`,
-          data-fields='username',
->>>>>>> 627b84b... wip
-          next='chat'
-        )
-    div.divider
diff --git a/src/page-group-profile.pug b/src/page-group-profile.pug
index 0ecb4dc2dfadaaadc6e406e8cd093f18d6d91ec0..fcf3b478708c4ef466b0fed254c34fa325494fdd 100644
--- a/src/page-group-profile.pug
+++ b/src/page-group-profile.pug
@@ -8,8 +8,8 @@
   sib-display(
     id-suffix='members',
     data-fields='user-thumb',
-    set-user-thumb='member.avatar, first_name, last_name',
-    widget-member.avatar='sib-display-img',
+    set-user-thumb='profile.picture, first_name, last_name',
+    widget-profile.picture='sib-display-img',
     bind-resources
   )
 
@@ -28,7 +28,7 @@
 
   sib-display(
     data-fields='title, label-description, description, client',
-    set-title='number, client.name, name',
+    set-title='phone, client.name, name',
     set-client='label-client, client.name, client.logo, client.address',
     value-label-description="Description:"
     value-label-client="Client:"
diff --git a/src/page-job-offer-create.pug b/src/page-job-offer-create.pug
index aa6e77c625b19c21f5b0cf6447dc9f702e608dcd..14dd8815551307e6834578bc2d21083b1f9df596 100644
--- a/src/page-job-offer-create.pug
+++ b/src/page-job-offer-create.pug
@@ -4,7 +4,7 @@ div
   .form-view
     sib-form.block(
       data-src=`${sdn}/job-offers/`,
-      data-fields="author, description, skills",
+      data-fields="description, skills",
       widget-author='sib-form-dropdown',
-      widget-skills='sib-form-multiple-dropdown',
+      range-skills= `${sdn}/skills/`,
     )
diff --git a/src/page-job-offers.pug b/src/page-job-offers.pug
index b08d4239027b53451c8ad9fe7188851fe13d4df2..c380d33c5470b2382477c180e093d8d1a79732ec 100644
--- a/src/page-job-offers.pug
+++ b/src/page-job-offers.pug
@@ -1,26 +1,27 @@
 div.grid-layer
   div.grid-layer-main.containerV
-    h1 New offers
+    h2 New offers
       span Here you can find and post offers
     sib-display#offers-list(
       data-src=`${sdn}/job-offers/`,
       data-fields='date, user-thumb, title, description, skills',
       widget-skills='sib-display-lookuplist',
-      set-user-thumb='author.member.avatar, author.first_name, author.last_name'
-      widget-author.member.avatar='sib-display-img',
+      set-user-thumb='author.profile.picture, author.first_name, author.last_name',
+      widget-author.profile.picture='sib-display-img',
       set-date='closingDate, creationDate',
+      set-creation='creationDate',
       widget-closingDate='hdapp-closing-date',
       set-content='title, description',
-      search-fields='content,skills,open'
-      search-range-skills=`${sdn}/skills/`,
+      search-fields='content,skills,open',
+      search-range-skills=`${sdn}/skills/`
     )
   div.grid-layer-links.containerV
     sib-link(next="job-offer-create").containerH.containerCenter.action-link
-      div.containerV.fix.icon-plus
-      div.containerV.fix Post a new offer
+      div.icon-plus
+      div Post a new offer
     sib-link().containerH.containerCenter.how-link
-      div.containerV.fix.icon-idea
-      div.containerV.grow How To find a new offer
+      div.icon-idea
+      div.grow How To find a new offer?
     sib-link().containerH.containerCenter.how-link
-      div.containerV.fix.icon-idea
-      div.containerV.grow How to set notification ?
+      div.icon-idea
+      div.grow How to set notification?
diff --git a/src/page-member-edit.pug b/src/page-member-edit.pug
index 4a5a2c583c397d9b9369c2b0edcf7e03ee196e8e..6fbc111b842f32998339974b10d35b21dabbc3ad 100644
--- a/src/page-member-edit.pug
+++ b/src/page-member-edit.pug
@@ -1,14 +1,6 @@
 .form-view
-  label.d-none(for='avatar-input')
-    img#avatar-preview(src='', style='width: 100%;')
-  input#avatar-input.d-none(
-    type='file',
-    accept='image/*',
-    name='avatar',
-    value='',
-  )
   sib-form.block(
-    data-fields='user, avatar, bio, cell, jabberID, number, pseudo, skills, website',
+    data-fields='user, picture, bio, cell, jabberID, phone, pseudo, skills, website',
     widget-user='hdapp-usereditinfo',
     range-cell=`${sdn}/cells/`, widget-skills='sib-form-multiple-dropdown',
     range-skills=`${sdn}/skills/`,
diff --git a/src/page-member-profile.pug b/src/page-member-profile.pug
index 04d14ba6a87b87e0147fe713527bcd15f5240994..48a856caace73f89861b4350c5f8ab02030bfb16 100644
--- a/src/page-member-profile.pug
+++ b/src/page-member-profile.pug
@@ -1,22 +1,21 @@
 template#chat-link
   sib-link(next="member-chat") ${value}
 sib-display#member-info(
-  data-fields='available, header, name, pseudonym, infos, skills',
-  set-header='avatar',
-  set-infos='cell, roles,send, user.email, number, foaf:homepage',
+  data-fields='available, header, name, pseudonym, infos, user.skills',
+  set-header='picture',
+  set-infos='city, country, user.roles, user.email, send, phone, foaf:homepage, ',
   set-name='user.first_name, user.last_name',
   set-pseudonym='before-pseudo, pseudo',
   value-before-pseudo='@',
   value-send='SEND A MESSAGE',
   template-send='chat-link',
   widget-available='hdapp-available',
-  widget-avatar='sib-display-img',
+  widget-picture='sib-display-img',
   widget-user='hdapp-userinfo',
-  widget-cell='hdapp-usercell',
-  widget-number='sib-display-tel',
+  widget-phone='sib-display-tel',
   widget-foaf:homepage='hdapp-hyperlink',
   widget-user.email='sib-display-mailto',
-  widget-roles='sib-display-lookuplist',
-  widget-skills='sib-display-lookuplist',
+  widget-user.roles='sib-display-lookuplist',
+  widget-user.skills='sib-display-lookuplist',
   bind-resources
 )
diff --git a/src/page-members.pug b/src/page-members.pug
index 2bc6877e9c7e9983e1eab403c4e96d09a89e0037..53c72772b5e2d569b9c78bc109b6cf9789400233 100644
--- a/src/page-members.pug
+++ b/src/page-members.pug
@@ -7,8 +7,8 @@ div.grid-layer
     h1 Members
     sib-display#profiles-list(
       data-src=`${sdn}/members/`,
-      data-fields='header, infos, group, role, more',
-      set-header='avatar, user, pseudonym, bio, send',
+      data-fields='header, infos, groups, role, more',
+      set-header='picture, user, pseudonym, bio, send, city, country',
       set-infos='cell, roles, user.email, foaf:homepage, skills',
       set-pseudonym='before-pseudo,pseudo'
       search-label-skills='competences',
@@ -20,10 +20,9 @@ div.grid-layer
       template-more='hdapp-link-more',
       value-send='SEND A MESSAGE',
       template-send='chat-link',
-      widget-avatar='sib-display-img',
+      widget-picture='sib-display-img',
       widget-user='hdapp-userinfo',
       widget-foaf:hompage='hdapp-hyperlink',
-      widget-cell='hdapp-usercell',
       widget-roles='sib-display-lookuplist',
       widget-skills='sib-display-lookuplist',
       set-name='pseudo,user.first_name,user.last_name',
diff --git a/src/page-notifications.pug b/src/page-notifications.pug
index eb38c1f89e4e45e30eb1fc6e418ca3cf2d8e1c2c..68b15af74219f0af581489f66e86fa40ab811f07 100644
--- a/src/page-notifications.pug
+++ b/src/page-notifications.pug
@@ -2,6 +2,6 @@ div.frame
   h1 Notifications
 
   sib-display(
-    data-src=`${sdn}/notifications/`
+    bind-user
     data-fields='summary'
 )
\ No newline at end of file
diff --git a/src/page-project-create.pug b/src/page-project-create.pug
index 11d7b45efc8c9c00386528a092ddbab39a9a0f23..1e235d6467da1993dae82d37df634c6f1c97f114 100644
--- a/src/page-project-create.pug
+++ b/src/page-project-create.pug
@@ -2,7 +2,7 @@ h1 New project
 .form-view
   sib-form.block(
     data-src=`${sdn}/projects/`,
-    range-client=`${sdn}/clients/`,
+    range-customer=`${sdn}/customers/`,
     widget-team='sib-form-multiple-dropdown',
     range-team=`${sdn}/members/`
   )
diff --git a/src/page-project-edit.pug b/src/page-project-edit.pug
index 534754ff0a1e5e8c81fcf1684727dcfb5a395435..859cea070d5690e3adb85a1af55c50f7d0c15ecc 100644
--- a/src/page-project-edit.pug
+++ b/src/page-project-edit.pug
@@ -2,9 +2,9 @@ h1 Edit project
   //- sib-display(data-fields="name" bind-resources)]
 .form-view
   sib-form(
-    range-client=`${sdn}/clients/`,
+    range-customer=`${sdn}/customers/`,
     range-team=`${sdn}/members/`,
-    data-fields=`name, number, client, description, team, jabberRoom, foaf:jabberID`,
+    data-fields=`name, phone, customer, description, team, jabberRoom, foaf:jabberID`,
     widget-jabberRoom='sib-form-checkbox',
     widget-description='sib-form-textarea',
     widget-team='hdapp-link-more',
diff --git a/src/page-project-profile.pug b/src/page-project-profile.pug
index 4d12e61a3f40b2875ef1b7fccb445db691fb7c70..c7cc89b011c56e6b37bfd314bdb3b0564e92475a 100644
--- a/src/page-project-profile.pug
+++ b/src/page-project-profile.pug
@@ -1,5 +1,5 @@
 .frame
-  template#client-template
+  template#customer-template
     div#clientBox
       div
         h2 Client :
@@ -13,13 +13,13 @@
         h2 Contact :
 
   sib-display(
-    data-fields='title, client.logo, label-description, description, client',
-    set-title='const-title1,number,client.name,const-title2, name',
-    widget-client.logo='sib-display-img',
-    template-client='client-template',
+    data-fields='title, customer.logo, label-description, description, customer',
+    set-title='const-title1,phone, customer.name,const-title2, name',
+    widget-customer.logo='sib-display-img',
+    template-customer='customer-template',
     widget-team='sib-display-lookuplist',
     value-label-description="Description:",
-    value-label-client="Client:",
+    value-label-customer="Client:",
     value-const-title1="N°:",
     value-const-title2="-",
     bind-resources,
@@ -29,10 +29,10 @@
   div.containerH
     sib-display.members-list-condensed(
       id-suffix='team',
-      data-fields='member.avatar, member.user, member.roles',
-      widget-member.avatar='sib-display-img',
-      widget-member.user='hdapp-userinfo',
-      widget-member.roles='sib-display-lookuplist',
-      next='member',
+      data-fields='profile.picture, profile.user, groups',
+      widget-profile.picture='sib-display-img',
+      widget-profile.user='hdapp-userinfo',
+      widget-groups='sib-display-lookuplist',
+      next='profile',
       bind-resources,
     )
diff --git a/src/page-projects.pug b/src/page-projects.pug
index 7563087f8a2910c1a09472d5f39a1b02dc9d533c..4490ae255c62e8ca11ae7f2615efe4c03a9527ce 100644
--- a/src/page-projects.pug
+++ b/src/page-projects.pug
@@ -3,8 +3,8 @@ div
   h1 Projects
   sib-display(
     data-src=`${sdn}/projects/`,
-    data-fields='number, client, name',
-    widget-client='hdapp-client',
-    search-fields='number, name',
+    data-fields='phone, customer, name',
+    widget-customer='hdapp-client',
+    search-fields='phone, name',
     next='project'
   )
diff --git a/src/scripts/hd-widgets.js b/src/scripts/hd-widgets.js
index b8fa9429d372c078474e6785ce2e763d40c2b0a2..ccc837705604125954ed1bee63d3fd5948839908 100644
--- a/src/scripts/hd-widgets.js
+++ b/src/scripts/hd-widgets.js
@@ -27,32 +27,6 @@ document.addEventListener('WebComponentsReady', function(event) {
   }
   customElements.define('hdapp-userinfo', HDAppUserInfo);
 
-  class HDAppCell extends SIBDisplayLookupList {
-    get parentElement() {
-      return 'div';
-    }
-    getTemplate(value, index) {
-      var city, country;
-
-      if (typeof value == 'object')
-        if (Object.keys(value).length > 1) {
-          city = value.city;
-          country = value.country;
-        } else {
-          store.get(value).then(resource => {
-            this.value.push(resource);
-            this.render();
-          });
-          if (Array.isArray(this.value))
-            this.value.splice(this.value.indexOf(value), 1);
-          else this.value = [];
-          return '';
-        }
-      return `<span>${city} - ${country}</span>`;
-    }
-  }
-  customElements.define('hdapp-usercell', HDAppCell);
-
   class HDAppMail extends SIBWidget {
     get template() {
       return `<a href="mailto:${this.value}"><div class="icon-envelope"></div><div>SEND A MESSAGE</div></a>`;
diff --git a/src/styles/content.scss b/src/styles/content.scss
index 10d941f90b99671cd01304b778026656250a1eb9..f78d46603bb833e721c8942a77d96d0087b713a8 100644
--- a/src/styles/content.scss
+++ b/src/styles/content.scss
@@ -7,28 +7,6 @@
 //   //float: right;
 // }
 
-#offers-list {
-  > div {
-    > sib-display {
-      display: block;
-      margin: 1em 0;
-      @extend %frame;
-      padding: 2em;
-      /*&:nth-child(odd) {
-        background-color: $color-grey-light;
-      }*/
-      sib-display-div[name='title'] {
-        display: block;
-        @extend h2;
-      }
-
-      label {
-        display: none;
-      }
-    }
-  }
-}
-
 [name='user-thumb'] {
   display: flex;
   align-items: center;
@@ -304,41 +282,6 @@ hdapp-available {
   }
 }
 
-#offers-list {
-  @extend .grid-layer;
-  > sib-form {
-    grid-column-start: start;
-    grid-column-end: middle;
-    grid-row-start: start;
-    grid-row-end: middle;
-  }
-  > div {
-    grid-column-start: start;
-    grid-column-end: end;
-    grid-row-start: middle;
-    grid-row-end: end;
-  }
-}
-#offers-list > sib-form > form {
-  display: grid;
-  grid-template-columns: 50% 50%;
-  grid-template-rows: 3.5em 3.5em;
-
-  label {
-    flex-basis: 5em;
-    flex-shrink: 0;
-  }
-
-  input, select {
-    flex-grow: 1;
-    min-width: 0;
-  }
-
-  input[type="submit"] {
-    display: none;
-  }
-}
-
 #member-profile,
 #profiles-list {
   ul {
@@ -465,57 +408,6 @@ hdapp-available {
   }
 }
 
-.right-link {
-  padding: 0.5em;
-  margin-bottom: 1em;
-  margin-left: 1em;
-  flex-basis: content;
-  border-radius: 2em;
-
-  div[class*="icon-"] {
-    margin-right: 1em;
-  }
-}
-
-.how-link {
-  @extend .right-link;
-  background-color: $color-white;
-  color: $color-black;
-  flex-wrap: nowrap;
-  .icon-idea {
-    background-color: $color-yellow-light;
-    border-radius: 100%;
-    flex-shrink: 0;
-    flex-grow: 0;
-    justify-content: center;
-    align-items: center;
-    display: flex;
-    flex-direction: column;
-    width: 1.8em;
-    height: 1.8em;
-    //margin-right: 1em;
-  }
-}
-
-.action-link {
-  @extend .right-link;
-  background-color: $color-yellow;
-  color: $color-white;
-  font-weight: bold;
-  text-transform: uppercase;
-
-  .icon-plus {
-    flex-shrink: 0;
-    flex-grow: 0;
-    justify-content: center;
-    align-items: center;
-    display: flex;
-
-    &:before {
-      //font-size: 1.3em;
-    }
-  }
-}
 /*
 label {
   @extend h2;
@@ -524,3 +416,4 @@ label {
   }
 }
 */
+
diff --git a/src/styles/filters.scss b/src/styles/filters.scss
new file mode 100644
index 0000000000000000000000000000000000000000..099bdafd0b8dbfddcb901ef24dcd60493a7bf471
--- /dev/null
+++ b/src/styles/filters.scss
@@ -0,0 +1,47 @@
+#offers-list > sib-form > form {
+  border-bottom: 1px solid $color-grey1;
+  display: grid;
+  grid-gap: 0px 30px;
+  grid-template-columns: 33% auto;
+  padding-bottom: 3em;
+
+  label {
+    display: block;
+  }
+
+  input, select {
+    border-style: none;
+    box-shadow: 0 0 5px 0 rgba(133, 140, 148, 0.09);
+    margin-top: 1em;
+  }
+
+  input[type="submit"] {
+    display: none;
+  }
+
+  select {
+    background: white;
+    box-sizing: border-box;
+    display: inline-block;
+    padding: 0.5em 12.5em 0.5em 1em;
+
+    background-image:
+      linear-gradient(45deg, transparent 50%, $color-grey 50%),
+      linear-gradient(135deg, $color-grey 50%, transparent 50%),
+      linear-gradient(to right, white, white);
+    background-position: 
+      calc(100% - 20px) calc(1em + 2px),
+      calc(100% - 15px) calc(1em + 2px),
+      calc(100% - 2.5em) 0.5em;
+    background-repeat: no-repeat;
+    background-size:
+      5px 6px,
+      5px 6px,
+      1px 1.5em;
+  }
+
+  sib-form-label-text {
+    display: flex;
+    flex-direction: column;
+  }
+}
diff --git a/src/styles/form.scss b/src/styles/form.scss
index cee8debf8b6979b790b12a295ec36726e48c701f..93297b5d3716558b4b981aba64cd442463229078 100644
--- a/src/styles/form.scss
+++ b/src/styles/form.scss
@@ -13,9 +13,9 @@
   padding: 1em;
 }
 sib-display sib-form form {
-  margin: -0.5em;
+  //margin: -0.5em;
   > * {
-    margin: 0.5em;
+    margin-top: 0.5em;
   }
 }
 sib-form.block {
@@ -64,11 +64,12 @@ sib-form.block {
   }
 }
 
+//fix: style à mignrer dans filter.scss ? => A voir si ces styles sont utilisés ailleurs que pour les filtres.
 sib-form {
   // text like
   textarea,
   input:not([type='button']):not([type='checkbox']):not([type='color']):not([type='file']):not([type='hidden']):not([type='image']):not([type='radio']):not([type='range']):not([type='reset']):not([type='submit']) {
-    padding: 0.5em;
+    padding: 0.7em;
     border: none;
     @extend %shadow;
   }
@@ -105,14 +106,3 @@ sib-form {
     }
   }
 }
-
-sib-form-label-text,sib-form-dropdown{
-  display: flex;
-  flex-wrap: nowrap;
-}
-
-select{
-  background-color: $color-white;
-  border-style: none;
-  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.15)
-}
diff --git a/src/styles/header.scss b/src/styles/header.scss
index a150cec010d1df6e2b7619197bf419385075b6d8..fbd0f0cea1d526128d8162cd42e3ffbcc678127e 100644
--- a/src/styles/header.scss
+++ b/src/styles/header.scss
@@ -13,6 +13,7 @@
   flex-shrink: 0;
   align-items: center;
   padding: 1em 0.4em;
+  position: relative;
 
   > * {
     padding: 0 1.8rem;
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 457c9b48ed61d822ebd75124bfe2f34e16137a27..ecd5f85b5bf4f87b512f4912bbf398cf6f038ce9 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -8,6 +8,9 @@
 @import 'main';
 @import 'form';
 @import 'content';
+@import 'filters';
+@import 'right-panel';
+@import 'job-offers';
 
 // @import 'members';
 @import 'header';
diff --git a/src/styles/job-offers.scss b/src/styles/job-offers.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e08422192f8f58cdac4b574a518274640ea4446a
--- /dev/null
+++ b/src/styles/job-offers.scss
@@ -0,0 +1,57 @@
+#offers-list {
+  @extend .grid-layer;
+  > sib-form {
+    grid-column-start: start;
+    grid-column-end: middle;
+    grid-row-start: start;
+    grid-row-end: middle;
+  }
+
+  > div {
+    grid-column-start: start;
+    grid-column-end: end;
+    grid-row-start: middle;
+    grid-row-end: end;
+
+    &:first-of-type {
+      margin-top: 3em;
+    }
+
+    > sib-display {
+      @extend %frame;
+      display: block;
+      margin: 1em 0;
+      padding: 2em;
+      /*&:nth-child(odd) {
+        background-color: $color-grey-light;
+      }*/
+      sib-display-div[name='title'] {
+        @extend h2;
+        display: block;
+      }
+
+      label {
+        display: none;
+      }
+    }
+  }
+}
+
+[name='user-thumb'] {
+  align-items: center;
+  color: $color-black-light;
+  display: flex;
+  font-weight: 600;
+  margin: -0.25em;
+
+  > * {
+    margin: 0.25em;
+  }
+
+  sib-display-img {
+    border-radius: 100%;
+    height: 2.5em;
+    overflow: hidden;
+    width: 2.5em;
+  }
+}
\ No newline at end of file
diff --git a/src/styles/main.scss b/src/styles/main.scss
index 71532364392977943aa5b761349d0939bfdc6a78..742aa6443ffabe17168e40611cb039dcd9d99884 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -48,8 +48,7 @@ h1 {
   font-size: 1.24em;
 }
 
-h2 {
-  font-size: 1.04em;
+h2 {  font-size: 20px;
 }
 
 h3 {
@@ -68,77 +67,6 @@ h4 {
   @extend %frame;
   padding: 1em;
 }
-/*
-#header {
-  background-color: $color-white;
-  color: $color-black;
-  //position: relative;
-  //@include border-shadow(bottom);
-  box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
-  border: solid $color-white;
-  border-width: 1px 0;
-  display: flex;
-  //flex-grow: 0;
-  //flex-basis : 150px;
-  flex-shrink: 0;
-  align-items: center;
-  padding: 1em 0;
-
-  > * {
-    padding: 0 1rem;
-  }
-}
-
-#button-toggle {
-  @include icon('menu');
-  display: none;
-  color: $color-black;
-  font-size: 2em;
-  padding: 0.72em;
-  cursor: pointer;
-}
-
-#logo {
-  flex: 1 1 0;
-}
-
-#notifications-button {
-  @include icon(bell);
-  font-size: 2em;
-  cursor: pointer;
-  list-style-type: none;
-}
-
-#notifications {
-  position: absolute;
-  right: 0;
-  bottom: 0;
-  height: 0;
-  left: 0;
-  z-index: 1;
-
-  > div {
-    position: absolute;
-    top: 0;
-    right: 0;
-  }
-}
-
-#profile {
-  > * {
-    vertical-align: middle;
-  }
-
-  img {
-    margin-right: 0.5em;
-    width: 48px;
-    height: 48px;
-    object-fit: cover;
-    object-position: center;
-    border-radius: 100%;
-  }
-}
-*/
 
 .menu-notification {
   //flex-basis: 3em;
@@ -347,16 +275,17 @@ sib-trigger.back {
 
 .grid-layer{
   display: grid;
-  grid-template-columns: [start]auto[middle]20em[end];
-  grid-template-rows: [start]10em[middle]auto[end];
+  font-size: 16px;
+  grid-template-columns: [start]auto[middle]25%[end];
+  grid-template-rows: [start]13em[middle]auto[end];
 }
-.grid-layer-main{
+.grid-layer-main {
   grid-column-start: start;
   grid-column-end: end;
   grid-row-start: start;
   grid-row-end: end;
 }
-.grid-layer-links{
+.grid-layer-links {
   grid-column-start: middle;
   grid-column-end: end;
   grid-row-start: start;
diff --git a/src/styles/right-panel.scss b/src/styles/right-panel.scss
new file mode 100644
index 0000000000000000000000000000000000000000..fd973525de56834f31de0dd8cf99548acbe03b14
--- /dev/null
+++ b/src/styles/right-panel.scss
@@ -0,0 +1,49 @@
+.right-link {
+  padding: 0.5em;
+  margin-bottom: 1em;
+  margin-left: 5em;
+  flex-basis: auto;
+  border-radius: 2em;
+
+  div[class*="icon-"] {
+    align-items: center;
+    display: flex;
+    flex-grow: 0;
+    flex-shrink: 0;
+  }
+}
+
+.how-link {
+  @extend .right-link;
+  background-color: $color-white;
+  color: $color-black;
+  flex-wrap: nowrap;
+  .icon-idea {
+    background-color: $color-yellow-light;
+    border-radius: 100%;
+    justify-content: center;
+    margin-right: 0.7em;
+    //flex-direction: column;
+    width: 1.8em;
+    height: 1.8em;
+    //margin-right: 1em;
+  }
+}
+
+.action-link {
+  @extend .right-link;
+  background-color: $color-yellow;
+  color: $color-white;
+  font-weight: bold;
+  text-transform: uppercase;
+
+  .icon-plus {
+    font-size: 20px;
+    justify-content: center;
+    margin: 0.3em 0.3em 0.3em 0;
+
+    &:before {
+      //font-size: 1.3em;
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/styles/variables.scss b/src/styles/variables.scss
index 17a486d1319bd7bcbef565a47aea6bcd884ef40c..bd4a04a2998045e328f0a272ab953106a0394481 100644
--- a/src/styles/variables.scss
+++ b/src/styles/variables.scss
@@ -1,6 +1,8 @@
 // colors
 $color-white: #fff;
 $color-black: #36383b;
+$color-black-light: #4a4a4a;
+$color-grey1: #d7dbe0;
 $color-grey: #898f95;
 $color-grey-mid: #abaaba;
 $color-grey-light4: #b4b9c0;
diff --git a/www/lib/sib-router b/www/lib/sib-router
index 2d78d30a691f937a5b2cd64cdc40d1fba8a75835..5be7c64588b25ba63394f99f03ff19ee6e0c6644 160000
--- a/www/lib/sib-router
+++ b/www/lib/sib-router
@@ -1 +1 @@
-Subproject commit 2d78d30a691f937a5b2cd64cdc40d1fba8a75835
+Subproject commit 5be7c64588b25ba63394f99f03ff19ee6e0c6644