@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@100&display=swap');
:root {
.btn{
.btn-default{
.btn-primary{
.btn-info{
.panel-primary > .panel-heading {
.panel-primary {
.panel-info > .panel-heading {
.panel-info {
.label-info{
.label-primary{
.panel-default > .panel-heading {
.btn-new{
.btn-new:hover{
.btn-default:hover{
.btn-primary:hover{
.btn-info:hover{
.btn-warning:hover {
.btn-success:hover {
.label {
.label-new {
/ Titres/
h1,
h2,
h3 {
h1 {font-size:32px;}
h2 {font-size:24px;}
h3 {font-size:22px;}
h4 {
li::marker{
.navbar-brand img {
.input-group-addon {
.input-group-btn .btn-primary {
}
.form-control {
.alert-info {
.panel > .panel-heading .collapsed {
.filters .panel-default > .panel-heading {
.h5 {
#lettres_init {
/ Pour le trail Toc/
#tocjs-GlossairE ol > .active > a, #tocjs-GlossairE ol > .active:hover > a, #tocjs-GlossairE ol > .active:focus > a {
#tocjs-GlossairE ol > li > a {
.well {
#yw-topnav li a {
:root {
- -primary-color:#28bfb5; / initial yellow #1A89A0; /
- -secondary-color-1: #3099e5;
- -secondary-color-2:#28bfb5;
- -neutral-color:#004680;
- -neutral-soft-color:#7a93dc;
- -neutral-light-color:#Fff;
- -info-color:#7A93DC;
- -success-color: #53dd6c;
- -danger-color: #A3333D;
- -warning-color: #7a93dc;
- -main-text-color:var(--neutral-color);
- -main-text-fontsize: 17px;
- -main-text-fontfamily:'Raleway', sans-serif;
- -main-bg-color:var(--neutral-light-color);
- -main-container-bg-color:var(--neutral-light-color);
- -link-color: var(--secondary-color-1);
- -link-hover-color: var(--secondary-color-1);
- -navbar-bg-color: var(--primary-color);
- -navbar-text-color: var(--neutral-light-color);
- -navbar-link-color: var(--neutral-light-color);
- -navbar-link-bg-color: transparent;
- -navbar-link-hover-color: rgba(255,255,255,0.85);
- -navbar-link-bg-hover-color: transparent;
- -navbar-border: none;
- -navbar-border-radius: 0;
- -navbar-shadow: none;
- -header-bg-color: var(--neutral-light-color);
- -header-text-color: var(--neutral-color);
- -header-title-color: var(--primary-color);
- -footer-bg-color: var(--neutral-soft-color);
- -footer-text-color: var(--main-text-color);
- -footer-title-color: var(--main-text-color);
- -footer-border-top: 3px solid var(--neutral-soft-color);
- -btn-border: none;
- -btn-border-radius: .5em;
- -checkbox-color: var(--primary-color);
- / CSS Additionnel pour charte WeNavis /
- .lead {
- font-size: 21px;
- font-weight: 700;
- color:#FF8D6D;
.btn{
- text-shadow: none;
- border-radius:4px;
- padding : 8px 12px;
.btn-default{
- color: var(--primary-color);
.btn-primary{
- background:var(--info-color);
.btn-info{
- background:var(--primary-color);
- opacity:1;
.panel-primary > .panel-heading {
- background-color: var(--info-color);
- color: var(--neutral-light-color);
- border-color:var(--info-color);
.panel-primary {
- border-color: var(--info-color);
.panel-info > .panel-heading {
- background-color: var(--primary-color);
- color: var(--neutral-light-color);
- opacity:1;
.panel-info {
- border-color: var(--primary-color);
.label-info{
- background:var(--primary-color);
- opacity:1;
.label-primary{
- background:var(--info-color);
- opacity:1;
.panel-default > .panel-heading {
- background-color: var(--neutral-soft-color);
- color: var(--primary-color);
.btn-new{
- background:#9EB5CB;
- color:#fff;
.btn-new:hover{
- color:var(--primary-color);
- opacity: 0.9;
.btn-default:hover{
- color:var(--primary-color);
- opacity: 0.9;
.btn-primary:hover{
- background:var(--info-color);
- opacity: 0.9;
.btn-info:hover{
- background:var(--primary-color);
- opacity: 0.9;
.btn-warning:hover {
- color: #fff;
- background-color:var(--warning-color);
- opacity: 0.9;
.btn-success:hover {
- color: #fff;
- background-color:var(--success-color);
- opacity: 0.9;
.label {
- text-shadow: none;
.label-new {
- background-color:#9EB5CB;
/ Titres/
h1,
h2,
h3 {
- margin: 10px 0;
- font-weight: 800;
- line-height: 36px;
- margin-bottom: 0.5em;
- color: var(--primary-color);
h1 {font-size:32px;}
h2 {font-size:24px;}
h3 {font-size:22px;}
h4 {
- color: var(--link-color);
- font-weight: 600;
- font-size:20px;
li::marker{
- color:var(--link-color);
.navbar-brand img {
- margin-top:-5px;
.input-group-addon {
- border: 1px solid var(--neutral-soft-color);
- background: var(--neutral-soft-color);
- color: var(--primary-color);
.input-group-btn .btn-primary {
- background: var(--neutral-soft-color);
- color: var(--primary-color);
- border: 1px solid var(--neutral-soft-color);
}
.form-control {
- border: 1px solid var(--neutral-soft-color);
.alert-info {
- background-color: #f7f8fa;
- color:#9eb5cb;
- text-shadow: none;
.panel > .panel-heading .collapsed {
- text-shadow: none;
- color:var(--primary-color)!important;
- background: var(--neutral-soft-color);
.filters .panel-default > .panel-heading {
- /color: var(--neutral-soft-color) !important;/
- text-transform: uppercase;
- /background-color: var(--primary-color);/
- border-radius: 0px;
- border-color: transparent;
.h5 {
- font-weight:bold;
#lettres_init {
- font-size: 0.8em;
- font-weight: bold;
/ Pour le trail Toc/
#tocjs-GlossairE ol > .active > a, #tocjs-GlossairE ol > .active:hover > a, #tocjs-GlossairE ol > .active:focus > a {
- font-weight: bold;
- color: var(--primary-color)!important;
- background-color: transparent;
- border-left: 2px solid var(--primary-color)!important;
#tocjs-GlossairE ol > li > a {
- display: block;
- color: var(--info-color)!important;
- font-size: 0.9em;
- font-weight: 500;
- padding: 4px 20px;
.well {
- background-color: var(--neutral-soft-color);
- border: none;
- box-shadow: none;
#yw-topnav li a {
- text-transform: uppercase;