/* reset css http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video
{
margin: 0;
padding: 0;
background-blend-mode: normal;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section
{
display: block;
}
body
{
line-height: 1em;
}
blockquote, q
{
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after
{
content: none;
}
/* fin reset */
html
{height: 100%;} /*Ajouté 2020-04-27*/
body
{
font: large/1.556 "Libertine", Palatino, "Palatino Linotype", "Book Antiqua", Georgia, "Times New Roman", serif;
word-spacing: 0.1em;
/* max-width: 960px; désactivé 2020-04-27 */
/* margin: 0px auto; désactivé 2020-04-28 */
margin: 0;
/* padding-bottom: 2em; désactivé et remplacé 2020-04-28 */
padding: 0;
height: 100%; /*Ajouté 2020-04-27 */
position: relative; /* ajouté 2020-04-27 */
/* text-align: center; ajouté le 2020-04-28 et retiré le 2020-05-08*/
-webkit-overflow-scrolling: none; /* Ajouté à partir de icoroll.css; voir aussi plus bas reste fragments code */
}
/* inséré 2018-06-08 */
html, body
{
/* background: #fff; Modifié 2020-04-26 rendu identique à style_jumpo.css*/
background: #f3f3f3;
color: #000;
/* deux attributs supprimés le 09/06/2018 et remplacés par ceux qui centrent les pages
margin: 0;
padding: 0;*/
/* les trois attributs ci-dessous permettent de centrer ttes les pages */
/* width:80%; désactivé 2020-04-27 */
margin-left:auto;
margin-right:auto;
}
/*fin*/
.windowbg p span {}
/* Paragraphs */
p
{
margin: 0 0 1em 0;
line-height: 1.5em;
}
img
{
margin: 0px 5px 0px 0px;
}
/* Links */
a img
{
border: 0;
}
/* nouveau à partir du 2018-06-09 */
/* links */
a
{
text-decoration: none;
}
a:link
{
color: FireBrick;
border-bottom: 1px dotted;
}
a:visited
{
color: RosyBrown;
border-bottom: 1px dotted;
}
a:link:hover, a:visited:hover
{
border-bottom: 1px solid;
}
/* Headings */
h1, h2, h3, h4, h5, h6
{
/* font-family: "Essays 1743", Palatino, "Palatino Linotype", "Book Antiqua", Georgia, "Times New Roman", serif; /* ajouté le 09-06-2018 */
font-weight: bold; /* ajouté le 09-06-2018 */
/*arabic*/
/* text-align: right; /* ajouté le 09-06-2018 */
background: transparent;
/*
border-right: 5px solid rgba(0,0,0,1.00);
border-left: 5px solid rgba(249,6,6,1.00);
*/
/*color: #3282BD; toutes les couleurs changées en black 2020-04-28*/
color: black;
font-size: 110%; /* au lieu de 11 pt jusqu'au 09-06-2018 */
/*margin: 0 0 1em 0; Supression des espaces au-dessous et en-dessous avec la commande ci-dessous*/
margin: 0;
padding: 0 0 0 1px;
line-height: 1.3125em; /* ajouté le 09-06-2018 */
text-align: left; /*ajouté 2020-04-28 */
/* display: inline; permet d'éviter les retour à la ligne mais il faudrait ajouter des
...*/
}
/* 2018-01-08
J'ai modifié les définitions de h1 à h5 afin de réduire la taille des polices et les rendre identiques à celles de Titres ci-dessous reproduits et qu'il faudra supprimer dans les titres des documents:
*/
/* headers */
h1
{
/*width: 100%;*/
/*margin: 0.67em 0; suppression des marges car inesthétiques dans les titres 2018-06-16*/
/*couleurs latérales alternées ajoutées 2018-06-16 */
border-right: 5px solid rgba(0,0,0,1.00); /* bande alternée à droite modifié le 2018-06-16*/
border-left: 5px solid rgba(249,6,6,1.00); /*bande alternée modifié le 2018-06-16 */
}
h2
{
/*margin: 0.83em 0; suppression des marges car inesthétique dans les titres 2018-06-16*/
/*couleurs latérales alternées ajoutées 2018-06-16 */
margin: 0 0 1px 10 ; /* marge réintroduites pour test avec barre de navigation verticale 2018-06-29 */
border-left: 5px solid rgba(0,0,0,1.00); /* bande alternée à droite modifié le 2018-06-16*/
border-right: 5px solid rgba(249,6,6,1.00); /*bande alternée modifié le 2018-06-16 */
text-indent: 5px;
}
h3
{
/*margin: 1em 0; suppression des marges car inesthétique dans les titres 2018-06-16*/
/*couleurs latérales alternées ajoutées 2018-06-16 */
margin: 0 0 1px 15 ; /* marge réintroduites pour test avec barre de navigation verticale 2018-06-29 */
border-right: 5px solid rgba(0,0,0,1.00); /* bande alternée à droite modifié le 2018-06-16*/
border-left: 5px solid rgba(249,6,6,1.00); /*bande alternée modifié le 2018-06-16 */
text-indent: 10px;
}
h4
{
/*margin: 1.33em 0; suppression des marges car inesthétique dans les titres 2018-06-16*/
/*couleurs latérales alternées ajoutées 2018-06-16 */
margin: 0 0 1px 20 ; /* marge réintroduites pour test avec barre de navigation verticale 2018-06-29 */
border-left: 5px solid rgba(0,0,0,1.00); /* bande alternée à droite modifié le 2018-06-16*/
border-right: 5px solid rgba(249,6,6,1.00); /*bande alternée modifié le 2018-06-16 */
text-indent: 15px;
}
h5
{
/*margin: 1.67em 0;*/
margin: 0 0 1px 25 ; /* marge réintroduites pour test avec barre de navigation verticale 2018-06-29 */
border-right: 5px solid rgba(0,0,0,1.00); /* bande alternée à droite modifié le 2018-06-16*/
border-left: 5px solid rgba(249,6,6,1.00); /*bande alternée modifié le 2018-06-16 */
text-indent: 20px;
}
h6
{
/*margin: 2.33em 0; suppression des marges car inesthétique dans les titres 2018-06-16*/
margin: 0 0 1px 30 ; /* marge réintroduites pour test avec barre de navigation verticale 2018-06-29 */
border-left: 5px solid rgba(0,0,0,1.00); /* bande alternée à droite modifié le 2018-06-16*/
border-right: 5px solid rgba(249,6,6,1.00); /*bande alternée modifié le 2018-06-16 */
text-indent: 25px;
}
/* Ajouté 2022-11-26 cadre suppression recours à transparent.gif et tables associées */
hr
{
margin: 2em 0 1em 0;
border: 0;
height: 1px;
background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}
/* Forms */
form
{
/*background-color: lightgrey;*/ /* #FAFAFA ajouté 2020-06-26 cadre test choix modification */
margin: 5 0 1em 0;
padding: 6px;
/*arabic*/
/*text-align: left; */
/*display:inline-block;*/
/*display:block;*/
vertical-align: top;
}
/*Using display table-cell/row will do the job without any width needed.*/
label
{
/*background: transparent url("/images/backgrounds/label_bg.jpg") no-repeat 0% 50%; */
/*color: #999999; 2023-02-23*/
color: #000000;
/*arabic*/
/* code pour aligner sur la fin du texte du label */
/* display: table-cell; supprimé 2020-07-04 pour permettre l'affiche du calendrier à gauche*/
text-align: left;
}
div.row
{ /*display:table-row;*/
/*Supprimé 2020-07-10 pour activation Bootstrap autrement, l'affichage n'est pas responsive*/
}
fieldset
{
/*background: lightgrey;*/
background: #f3f3f3;
/*border: 2px solid #505050; */
border: 2px solid transparent;
margin: 5 5 5px 5;
padding: 5px;
width: 100%;
align-content: space-around;
align-items: center;
border-radius: 0.5em;
}
fieldset:hover, fieldset:focus
{border: 2px solid #DF3F3F;}
legend
{
color: #3288C5;
background: #f3f3f3;
font-weight: bold;
padding: 5px;
border-radius: 1em;
}
input, textarea, select, option
{
background-color:#FFF3F3;
}
/* input, textarea { */
textarea
{
/*background: #FFFFE6;*/
/*background: transparent; Désactivé 2020-06-26 suite attribut donné à plusieurs champs, ci-dessus*/
padding:3px;
border: 1px double #666666;
color: #003399;
font: 1em "lucida grande", "lucida sans unicode", verdana, helvetica, arial, sans-serif;
border-radius:5px;
box-shadow:1px 1px 2px #C0C0C0 inset;
}
input
{ /* ajouté le 2020-06-26 - pour textarea code séparé*/
/*padding:3px;*/
border:1px solid #F5C5C5;
border-radius:5px;
box-shadow:1px 1px 2px #C0C0C0 inset;
/*display: table-cell;*/
}
textarea:hover, textarea:focus
{
background: #FFFFE6;
border: 2px double #3282BD;
}
/* 2020-06-27 recup cadre modifications.html */
input[type=submit], input[type=button]
{
color:aliceblue;
background-color:cornflowerblue;
/*width:200px; */
/*display: block;*/
margin-left: auto;
margin-right: auto;
/* retour à la ligne dans le bouton */
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
input[type=reset]
{
/*width:150px;*/
}
input[type=submit], input[type=reset], input[type=button]
{
margin-left:5px;
box-shadow:1px 1px 1px #D83F3D;
cursor:pointer;
text-align:center !important;
}
input[type=submit]:focus, input[type=reset]:focus, input[type=button]:focus
{
color: darkblue;
background-color:#FFF3F3;
}
input[type=submit]:hover, input[type=reset]:hover, input[type=button]:hover
{
color: darkblue;
background-color:#FCDEDE;
}
input[type=submit]:active, input[type=reset]:active, input[type=button]:active
{
color: darkblue;
background-color:#FCDEDE;
box-shadow:inset 1px 1px 1px #D83F3D inset;
}
input.option
{
border: 0px;
background-color: transparent;
}
input.imgsubmit
{
border: 0;
margin: 10px 10px 0 0;
}
input.required {border: 1px solid red;}
input:required:focus { border: 3px solid red;}
input:required:hover { opacity: 3;}
label.required:before { content: "* "; }
ol, ul
{
margin: .5em 0;
list-style: none;
line-height: 1.2em; /* 2024-03-16 changé en 1 au lieu de 1.5 */
}
ol li
{
background: transparent;
margin: 5px 0px 0px 10px; /*2025-04-03 aligné sur css arabic */
/*list-style:none;*/
width: 700px;
/*text-indent: -20px;
margin-left: 24px;*/
list-style-position: inside;
}
ul li::marker {
color: red;
}
ol li::marker{
color:red
}
ol.u-roman { list-style-type: upper-roman;} /* The marker is upper-roman (I, II, III, IV, V, etc.)*/
ol.l-roman { list-style-type: lower-roman;} /*The marker is lower-roman (i, ii, iii, iv, v, etc.)*/
ol.u-alpha { list-style-type: upper-alpha;} /*(A, B, C, D, E, etc.)*/
ol.l-alpha { list-style-type: lower-alpha;} /* The marker is upper-latin a, b, c, d, e*/
ol.l-decimal { list-style-type: decimal;} /* (1, 2, 3) */
ol.l-greek { list-style-type: lower-greek;}
ol.decimalzero { list-style-type: decimal-leading-zero;} /* THe marker is numeric with leadin zero */
/* Unordered Lists */
ul
{
list-style: none;
margin-left: 0;
padding-left: 1.2em;
text-indent: -1.2em;
line-height: 1.2em;
}
ul li
{
margin: 0 0 1px 0;
}
/* usage : */
.square { list-style-type: square; text-indent: 1.5em;}
.disc { list-style-type: disc; text-indent: 1.5em;}
.tiret { list-style-type: '— '; text-indent: 1.5em;}
.asterisk { list-style-type: '* '; text-indent: 1.5em;}
.angle { list-style-type: '> '; text-indent: 1.5em;}
.arrowtoright { list-style-type: '→ '; text-indent: 1.5em;}
.arrowtoleft { list-style-type: '← '; text-indent: 1.5em;}
.shorthand { list-style: '♥ ' outside none; text-indent: 1.5em;}
.escaped { list-style: '\2630 ' outside none; text-indent: 1.5em;}
/* 2025-04-03 mis en commentaire --> utilisez les classes ci-dessus*/
ul li:before
{
content: "-";
display: block;
float: left;
width: 1.2em;
color: #000000;
}
/* Quotations */
blockquote {
background: transparent none no-repeat top left;
font-style: normal;
margin: 0 0 1em 0;
padding: 0 0 0 50px;
border-left: 3px solid #ccc;
}
cite
{
background: transparent;
color: #3282BD;
font-weight: bold;
}
strong
{
font-weight: bold; /*ajout 20240505*/
color: #3288C5; /* au lieu de #696969 au 16-03-2026*/
}
b
{
font-weight: bold; /*ajout 20240505*/
}
/* Retiré de Modelecode.dwt le 2017-12-24 et inséré dans css
La position récupérée de modelecodearabe code avant sa suppression de celui-ci*/
#KBStatic, #KBStatic_modif
{
position: fixed;
/*left: 2px;*/
right: 62px;
float:right;
top: 45%;
width: 60px;
margin: 0 0 0 0;
padding: 1px 0px 1px 0px;
font-weight: bold;
font-size: large;
align-content: center;
text-align: center;
text-indent: 0px;
color: white;
border: 5px solid hsla(0, 100%, 50%, 1);
border-radius: 10px 10px 10px 10px;
z-index: 25;
}
#KBStatic_modif
{
overflow:auto;
top: 5%;
width: 15%;
min-width: 10%;
/*height: 90%; La div reste centrée verticalement 2% au dessus, 80% la div et 100%-90%-5%=5% au dessous*/
max-height: fit-content;
}
/* Layout Styles */
#outerwrapper
{
background: transparent none no-repeat 100% 100%;
margin: 0;
padding: 0;
}
#wrapper
{
background: #FFFFFF none repeat-y;
font-size: 1.1em;
margin: 0 auto;
}
#heading
{
background: #FFFFFF none no-repeat 0 0;
height: 50px;
position: relative;
}
#heading h1
{
border: none;
line-height: normal;
margin: 0;
padding: 0;
text-indent: -9999px;
}
#topnav
{
font-size: .9em;
list-style-type: none;
margin: 0;
padding: 0 1px 0 0;
position: absolute;
/*arabic*/
left: 0px;
text-align: center;
top: 0;
background-repeat: no-repeat;
background-position: 100% 0;
}
#topnav li
{
background: none;
display: inline;
text-align: center;
width: 100px;
line-height: normal;
}
#topnav a
{
display: block;
/*arabic*/
float: left;
padding: 18px 0 0 0;
text-decoration: none;
width: 100px;
background-color: #FFFFFF;
background-repeat: no-repeat;
background-position: 50% 0;
}
#topnav a:link, #topnav a:visited
{
color: #666666;
}
#topnav a:hover
{
color: #3288C5;
background-color: #FFFFFF;
background-repeat: no-repeat;
background-position: 0 0;
}
#topnav a:active, #topnav a:focus
{
color: #3288C5;
text-decoration: underline;
background-color: #FFFFFF;
background-repeat: no-repeat;
background-position: 0 0;
}
#current a, #current a:link, #current a:hover, #current a:active, #current a:focus
{
color: #3288C5 !important;
background-color: #FFFFFF;
background-repeat: no-repeat;
background-position: 0 0;
}
#masthead
{
background: #FFFFFF none no-repeat 0 0;
height: 218px;
margin: 0 0 20px 0;
}
#masthead h2
{
border: none;
line-height: normal;
margin: 0;
padding: 0;
text-indent: -9999px;
}
#topcontent
{
margin: 0 auto;
padding: 0;
/*arabic*/
text-align: left;
}
/* Other Bits */
.top
{
/*arabic*/
text-align: left;
}
#portbut
{
line-height: normal;
margin: 0;
}
.clearboth
{
clear: both;
}
.rightalign
{
text-align: right;
}
p.latestproject
{
border-bottom: 1px solid #EEEEEE;
padding-bottom: .8em;
}
p.latestproject a
{
display: block;
}
img.thumbnailone
{
border: 1px solid #EEEEEE;
padding: 1px;
}
img.thumbnailtwo
{
border: 3px double #EEEEEE;
padding: 2px;
}
.leftfloat
{
float: left;
margin-left: 8px;
}
.rightfloat
{
float: right;
margin-left: 8px;
margin-right: 8px;
margin-bottom: 8px;
margin-top: 8px;
}
/* recup d'un template utilisé dans la première version de Yabbse utilisée*/
/* ces définitions font en fait double emploi avec les balises h1 à h6
Je vais les conserver à titre provisoire le temps d'épurer le code html des pages qui les utilisent
Dans l'intervalle on fera en sorte que leur définition coïncident avec celle des h1 à h6
*/
.titre1, .titre2, .titre3, .titre4, .titre5, .titre6
{
font-family: "Essays 1743", Palatino, "Palatino Linotype", "Book Antiqua", Georgia, "Times New Roman", serif; /* ajouté le 09-06-2018 */
font-weight: normal; /* ajouté le 09-06-2018 */
/*arabic*/
text-align: left; /* ajouté le 09-06-2018 */
background: transparent;
/*arabic*/
border-left: 5px solid rgba(249,6,6,1.00);
color: #3282BD;
font-size: 110%; /* au lieu de 11 pt jusqu'au 09-06-2018 */
margin: 0 0 1em 0;
padding: 0 0 0 1px;
line-height: 1.3125em; /* ajouté le 09-06-2018 */
}
/*
2018-01-08
J'ai modifié les définitions de h1 à h5 afin de réduire la taille des polices et les rendre identique à ceux de TitresX ci-dessous reproduits:
2018-06-09
Suite à la modification des hX, j'ai à titre temporaire reproduit les définitions des hX pour les rendre identiques à celles des TitreX en attendant de ne plus utiliser dans les pages du site ces deux définitions à la fois en même temps j'ai supprimé les anciennes définitions des titreX
*/
/* headers */
.titre1
{
width: 100%;
margin: 0.67em 0;
}
.titre2
{
margin: 0.83em 0;
}
.titre3
{
margin: 1em 0;
}
.titre4
{
margin: 1.33em 0;
}
.titre5
{
margin: 1.67em 0;
}
.titre6
{
margin: 2.33em 0;
}
.titlebg {background-color: inherit;} /*base*/ /*YabbSE*/
.bordercolor {background-color: #f3f3f3;} /*base*/ /*YabbSE*/ /*glossword*/
.catbg {background-color: transparent; color: inherit; } /*base*/ /*YabbSE*/
.g {color: #9B99FF; background: transparent; font: bold 100% "trebuchet ms", verdana, arial, helvetica, sans-serif; }
.texte {font-size: inherit; color: inherit;} /*base*/
.envigueur, .depuisle, .applicable_au {font: bold 70% verdana,arial,sans-serif; color:red } /* Affichage date de la version en vigueur*/
.windowbg {
background-color: #f3f3f3;
word-wrap: break-word;
max-width: 74%;
} /*base*/ /*YabbSE*/
.windowbg2 {background-color: transparent;} /*base*/ /*YabbSE*/
.windowbg3
{
background: #f3f3f3;
/*background-color: transparent;*/
/*arabic*/
text-align: left;
} /*base*/ /*YabbSE*/
.retrait-ar-droite { margin-left:50px;}
.term {color: #000000; background: transparent; font: 135% georgia,"times new roman",serif; } /*glossword*/
.trns {color: #000000; background: transparent; font: bold 110% "arial unicode ms",arial,sans-serif; } /*glossword*/
.aazz {font: bold 100% 'trebuchet ms',arial,verdana,sans-serif; margin: 0; padding: 0; width: 100%; } /*glossword*/
.r {font: bold 91% verdana,arial,sans-serif; } /*glossword*/
.abbr {color: #777; background: transparent; font: bold 100% verdana,arial,sans-serif; } /*glossword*/
.abbrpetit {color: #777; background: transparent; font: bold 70% verdana,arial,sans-serif; } /*citation*/
.termpreview {font: 79% "arial unicode ms",arial,helvetica,sans-serif; } /*glossword*/
.meaction {color:red; background-color: transparent;} /*YabbSE*/
.h {color: #588400;} /*glossword*/
.text1 {font-style: normal; font-weight: bold; font-size: 13px; color: Black;} /*base*/
.code {font-size: 10px; font-family: Courier New; color: #000000; background-color: #FFB920;} /*base*/ /*YabbSE*/
.u {font: 90% verdana,arial,helvetica,sans-serif; } /*glosswords*/
.f {color: #777; background: transparent; } /*glossword*/
.little {font-size : 10px;color: #FF0000;} /*phpMyFaq*/
.bookmark {font-size: 10pt; color: #003A8C; line-height: normal; font-weight: bold} /*base*/
.poll
{
font-size: 10px;
font-family: Arial;
background-color: rgba(224,222,240,1.00);
color: red;
} /*base*/
.d {color: #6A00CC; background: transparent; } /*glossword*/
.defn {margin: 0 1em 0 1em; color: #003A8C; font: 106% "times new roman",serif; text-align: justify; } /*glossword*/
.section {
font: large/1.556 "Libertine", Palatino, "Palatino Linotype", "Book Antiqua", Georgia, "Times New Roman", serif;
/*font-size : 12px;*/
}
.comment
{
color: #000080;
font-size : 10px;
border-bottom : 1px dashed Navy;
border-top : 1px dashed Navy;
background-color : #EEEEEE;
} /*phpMyFaq*/
.w
{
font: bold 140% "trebuchet ms", verdana, sans-serif;
color: #FF0000;
} /*glosswords*/
/*-----------TOOLTIPS-----------------------*/
/* Style pour les tooltips */
div#tipDiv {
font-size:11px; line-height:1.2em;
color:#000; background-color:#E1E5F1;
border:1px solid #667295; padding:4px;
width:280px;
}
/* example demonstrating applying styles to content inside 'tipContent' for tooltip display */
div#tipDiv ul.tipContentList
{
margin: .5em 0 1em 2em;
padding:0;
}
.showTip
{
font-size:77.78%;
vertical-align:super;
text-decoration: none;
}
/*-----------ToolTip simple ----------------*/
.tooltip
{
position: relative;
/*display: inline-block;*/
display: inline;
border-bottom: 1px dotted black;
color: blue;
vertical-align: top;
font-weight: bold;
}
.tooltip .tooltiptext
{
visibility: hidden;
width: 260px;
background-color: #0994D8;
color: aliceblue;
text-align: center;
border-radius: 6px;
padding: 5px 0;
text-indent: 20px; /*pour éviter débordement à gauche avec Firefox */
/* Position the tooltip */
position: absolute;
z-index: 1;
bottom: 100%;
left: 50%;
/*margin-left: -120px;*/
text-decoration:none!important; /*eviter formatage des ins et del */
font-size: 80%;
}
.tooltip:hover .tooltiptext
{
visibility: visible;
}
/* Fin code css du style de base */
/*---------------------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------------------*/
/* Recup de Modification.css */
/* styles pour traitement des modifications - récupérés de modifications.css avant partage en deux fichiers css
une partie intégrée dans style.css et l'autre spécifique au document */
/* shadowing retiré 2024-05-17 */
/*Affichage du texte (bouton) de basculement de la visualisation de la gestion des versions */
.bouton
{
color:#0000ff;
font-size:12px;
cursor:pointer;
background-color: rgb(240, 230, 140);
}
.bouton:hover
{text-decoration:underline;}
/* Modif */
/*définitions récupérés de modification.css afin d'uniformiser les affichages */
ins
{
/* background-color: transparent; ancienne définition */
text-decoration: underline double blue;
display: initial;
}
del
{
/*ancienne définition */
/*text-decoration: line-through dashed red;*/
text-decoration: line-through red;
display: initial;
}
span.souligne {text-decoration: underline double blue;}
span.barre {text-decoration: line-through red;}
.loading-invisible{ display: none; }
.loading-visible { display: block; }
#shadowing
{
display: block;
position: fixed;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: #CCA;
z-index:100; /* car Kbstatic a pour valeur du z-index 25 et le loader 35*/
opacity:0.5;
filter: alpha(opacity=50);
}
/* définir la classe principale pour le loader sous le nom .loading*/
#loading
{
position: fixed;
top: 50%;
left: 50%;
transform:translate(-50%, -50%);
z-index:35;
}
.message
{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%); /* compatibilité : ie9+ */
color: black;
text-align: center;
}
.cssload-loader
{
border: 1px solid rgba(54,28,54,0.1);
border-radius: 50%;
width: 11.25em;
height: 11.25em;
display: box;
display: -o-box;
display: -ms-box;
display: -webkit-box;
display: -moz-box;
display: flex;
display: -o-flex;
display: -ms-flex;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
margin:49px auto;
box-align: center;
-o-box-align: center;
-ms-box-align: center;
-webkit-box-align: center;
-moz-box-align: center;
align-items: center;
-o-align-items: center;
-ms-align-items: center;
-webkit-align-items: center;
-moz-align-items: center;
-ms-flex-align: center;
box-pack: center;
-o-box-pack: center;
-ms-box-pack: center;
-webkit-box-pack: center;
-moz-box-pack: center;
justify-content: center;
-o-justify-content: center;
-ms-justify-content: center;
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-flex-pack: center;
}
.cssload-spinner
{
width: 5rem;
height: 5rem;
background: rgb(255,255,255);
background-image: linear-gradient(270deg, rgba(17, 17, 17, 0) 45%, rgba(170,102,17,0.5) 75%);
background-image: -o-linear-gradient(270deg, rgba(17, 17, 17, 0) 45%, rgba(170,102,17,0.5) 75%);
background-image: -ms-linear-gradient(270deg, rgba(17, 17, 17, 0) 45%, rgba(170,102,17,0.5) 75%);
background-image: -webkit-linear-gradient(270deg, rgba(17, 17, 17, 0) 45%, rgba(170,102,17,0.5) 75%);
background-image: -moz-linear-gradient(270deg, rgba(17, 17, 17, 0) 45%, rgba(170,102,17,0.5) 75%);
animation: 2.8s cssload-spinner infinite linear;
-o-animation: 2.8s cssload-spinner infinite linear;
-ms-animation: 2.8s cssload-spinner infinite linear;
-webkit-animation: 2.8s cssload-spinner infinite linear;
-moz-animation: 2.8s cssload-spinner infinite linear;
border-radius: 50%;
box-shadow: inset 0 -0.2rem 0.4rem -0.22rem rgb(255,136,0), inset 0 0rem 0rem 1rem rgb(17,17,217), inset 0 -0.2rem 0.6rem 0.8rem rgb(255,136,0), 0 0.4rem 0.8rem -0.22rem rgb(255,136,0);
-o-box-shadow: inset 0 -0.2rem 0.4rem -0.22rem rgb(255,136,0), inset 0 0rem 0rem 1rem rgb(17,17,217), inset 0 -0.2rem 0.6rem 0.8rem rgb(255,136,0), 0 0.4rem 0.8rem -0.22rem rgb(255,136,0);
-ms-box-shadow: inset 0 -0.2rem 0.4rem -0.22rem rgb(255,136,0), inset 0 0rem 0rem 1rem rgb(17,17,217), inset 0 -0.2rem 0.6rem 0.8rem rgb(255,136,0), 0 0.4rem 0.8rem -0.22rem rgb(255,136,0);
-webkit-box-shadow: inset 0 -0.2rem 0.4rem -0.22rem rgb(255,136,0), inset 0 0rem 0rem 1rem rgb(17,17,217), inset 0 -0.2rem 0.6rem 0.8rem rgb(255,136,0), 0 0.4rem 0.8rem -0.22rem rgb(255,136,0);
-moz-box-shadow: inset 0 -0.2rem 0.4rem -0.22rem rgb(255,136,0), inset 0 0rem 0rem 1rem rgb(17,17,217), inset 0 -0.2rem 0.6rem 0.8rem rgb(255,136,0), 0 0.4rem 0.8rem -0.22rem rgb(255,136,0);
color: rgb(255,153,25);
text-align: center;
border-top: 1px solid rgb(255,255,255);
border-bottom: 1px solid rgb(255,136,0);
font-size: 4rem;
line-height: 16rem;
}
@keyframes cssload-spinner
{
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
@-o-keyframes cssload-spinner
{
0% { -o-transform: rotate(0deg); }
100% { -o-transform: rotate(360deg); }
}
@-ms-keyframes cssload-spinner
{
0% { -ms-transform: rotate(0deg); }
100% { -ms-transform: rotate(360deg); }
}
@-webkit-keyframes cssload-spinner
{
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes cssload-spinner
{
0% { -moz-transform: rotate(0deg); }
100% { -moz-transform: rotate(360deg); }
}
/* Fin récupération de modifications.css /
/*---------------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------------*/
/* icoroll suite : recup contenu icoroll.css */
/* 2020-05-12 Ajouté à la balise body principale puis désactivé
body
{
-webkit-overflow-scrolling: none;
}
*/
#scroll_tip
{
background: -moz-linear-gradient(top, rgba(247,247,247,1) 0%, rgba(235,235,235,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(247,247,247,1)), color-stop(100%,rgba(235,235,235,1)));
background: -webkit-linear-gradient(top, rgba(247,247,247,1) 0%,rgba(235,235,235,1) 100%);
background: -o-linear-gradient(top, rgba(247,247,247,1) 0%,rgba(235,235,235,1) 100%);
background: -ms-linear-gradient(top, rgba(247,247,247,1) 0%,rgba(235,235,235,1) 100%);
background: linear-gradient(top, rgba(247,247,247,1) 0%,rgba(235,235,235,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#ebebeb',GradientType=0 );
border: 1px solid #F3F3F3;
-moz-box-shadow: #D1D1D1 0px 1px 2px, rgba(63, 63, 63, 0.11) 0 2px 3px;
-webkit-box-shadow: #D1D1D1 0px 1px 2px, rgba(63, 63, 63, 0.11) 0 2px 3px;
box-shadow: #D1D1D1 0px 1px 2px, rgba(63, 63, 63, 0.11) 0 2px 3px;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=180, Color='#bdbdbd')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=180, Color='#bdbdbd');
zoom: 1;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.19);
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.19);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.19);
transition: opacity 0.5s;
-moz-transition:opacity 0.5s; /* Firefox 4 */
-webkit-transition: opacity 0.5s; /* Safari and Chrome */
-o-transition: opacity 0.5s; /* Opera */
}
#scroll_tip
{
position: absolute;
z-index: 1000;
padding: .2em 1em;
font-size: 13px;
opacity:0;
}
#scroll_tip:after, #scroll_tip.bottom:after, #scroll_tip.top:after, #scroll_tip.left:after, #scroll_tip.right:after
{
content: "";
width: 0;
height: 0;
position: absolute;
border-style: solid;
border-color: #47a3da transparent;
}
#scroll_tip.bottom:after, #scroll_tip:after
{
bottom: -9px;
left: 50%;
margin-left: -3px;
border-width: 8px 6px 0 6px;
}
#scroll_tip.top:after
{
top: -9px;
left: 50%;
margin-left: -3px;
border-width: 8px 6px 0 6px;
}
#scroll_tip.right:after
{
bottom: 45%;
right:-9px;
border-width: 8px 6px 0 6px;
}
#scroll_tip.left:after
{
bottom: 45%;
left:-9px;
border-width: 8px 6px 0 6px;
}
#scroll_tip.scroll_tip_show
{opacity:1;}
#scroll_back
{
position: fixed;
width: 100%;
text-align: center;
display: block;
cursor: pointer;
z-index: 99;
top:-200px;
}
#scroll_back span
{
display: block;
margin: auto;
width:30%;
padding: .4em 0px;
position: relative;
font-size: 13px;
text-transform: uppercase;
}
#scroll_back span:after
{
content: "";
width: 0px;
height: 0px;
color: white;
border-style: solid;
border-color: #333 transparent;
border-width: 0px 6px 8px 6px;
position: absolute;
bottom: 30%;
margin-left: 20px;
}
/* menu */
#scroll_menu
{ height:100%;}
#scroll_menu a
{ text-decoration:none;}
.scroll_menu
{
z-index:1000;
position: fixed;
list-style-type: none;
margin: 0;
padding: 0;
display:none;
}
.scroll_right_menu
{ right:0px;}
.scroll_left_menu
{ left:0px; }
#scroll_menu .nav, #scroll_show_menu_button, .scroll_menu li a ,.scroll_menu li span
{
border-bottom: 1px solid rgba(0,0,0,0.1);
-webkit-transition: background 0.1s ease-in-out;
-moz-transition: background 0.1s ease-in-out;
transition: background 0.1s ease-in-out;
display: block;
min-height: 3em;
min-width: 3em;
line-height: 3em;
text-align: center;
position: relative;
cursor:pointer;
margin:0px;
}
#scroll_show_menu_button
{
position:fixed;
top:0px;
cursor:pointer;
z-index:1100;
}
#scroll_menu .nav
{
position:fixed;
display:block;
cursor:pointer;
z-index:1100;
color:white;
right:0px;
font-size:12px;
}
#scroll_show_menu_button.left
{ left:0px;}
#scroll_show_menu_button.right
{right:0px;}
.scroll_menu li
{
position:relative;
transition: left 0.5s;
-moz-transition:left 0.5s; /* Firefox 4 */
-webkit-transition: left 0.5s; /* Safari and Chrome */
-o-transition: left 0.5s; /* Opera */
}
.scroll_menu li span
{
position:absolute;
top:0px;
padding:0px;
margin:0px;
display:block;
white-space:nowrap;
}
.scroll_right_menu li span
{
padding-right:1em;
}
.scroll_left_menu li span
{
padding-left:1em;
}
.scroll_menu li span.scroll_span_show
{
display:block;
width:auto;
}
@media all and (max-width: 600px)
{
.scroll_menu li:not(.current) a:hover
{ /* colors of hover element in menu */
background: inherit;
color: inherit;
text-decoration:none;
}
.scroll_menu li:hover, .scroll_menu li:hover a, .scroll_menu li:hover span
{
background: inherit;
color: inherit;
text-decoration:none;
}
#scroll_back span
{
width:50%;
font-size:11px;
}
#scroll_back span:after
{
display:none;
}
}
/* Fin recup icoroll.css */
/* --------- css pour iconroll récupéré de dark.css et bright.css ---------*/
/* Style of tooltip */
#scroll_tip{
/* dark css */
background:black;
color:#999;
/* bright css
background: rgb(245,245,245);
color: #363636;
*/
}
/* Style of tootip triangle : dark et bright*/
#scroll_tip:after, #scroll_tip.bottom:after, #scroll_tip.top:after, #scroll_tip.left:after, #scroll_tip.right:after
{
border-color: #47a3da transparent;
}
/* Menu size : dark et bright*/
#scroll_menu {
font-size:20px;
}
/* Colors for menu elements*/
.scroll_colors{
background:#222222;
color:#999;
/* dark et bright
background:#ededed;
color:#999; */
}
/* Style for hovered menu elements, active menu element and back button */
.scroll_menu li:hover, .scroll_menu li:hover a, .scroll_menu li:hover span,
.scroll_menu li.current a, .scroll_menu li.current span,#scroll_back span,
.hover_colors{
/* dark */
background: #2e81b0;
color: #fff;
text-decoration: none;
font-size: 24%;
/* bright
background: #47a3da;
color: #fff;
text-decoration:none; */
}
/* Hide button is buttom used for show or hide menu */
/* dark et bright */
.hide_button{
background:black;
}
/* Hide button style when mouse on it */
/* dark et bright */
.hide_button:hover{
background:black;
}
/* ------------Fin code css récupéré de iconroll.css ----------------*/
/* -------------- Driver experiments 2024-05-12*/
/* Usage :
/*
*/
.wrapper
{
padding-bottom: 10px;
}
.divider
{
position: relative;
margin-top: 20px;
height: 1px;
}
.div-transparent:before
{
content: "";
position: absolute;
top: 0;
left: 5%;
right: 5%;
width: 90%;
height: 1px;
background-image: linear-gradient(to right, transparent, rgb(48,49,51), transparent);
}
.div-arrow-down:after
{
content: "";
position: absolute;
z-index: 1;
top: -7px;
left: calc(50% - 7px);
width: 14px;
height: 14px;
transform: rotate(45deg);
background-color: white;
border-bottom: 1px solid rgb(48,49,51);
border-right: 1px solid rgb(48,49,51);
}
.div-arrow-up:after
{
content: "";
position: absolute;
z-index: 1;
top: -7px;
left: calc(50% - 7px);
width: 14px;
height: 14px;
transform: rotate(225deg);
background-color: white;
border-bottom: 1px solid rgb(48,49,51);
border-right: 1px solid rgb(48,49,51);
}
.div-tab-down:after
{
content: "";
position: absolute;
z-index: 1;
top: 0;
left: calc(50% - 10px);
width: 20px;
height: 14px;
background-color: white;
border-bottom: 1px solid rgb(48,49,51);
border-left: 1px solid rgb(48,49,51);
border-right: 1px solid rgb(48,49,51);
border-radius: 0 0 8px 8px;
}
.div-stopper:after
{
content: "";
position: absolute;
z-index: 1;
top: -6px;
left: calc(50% - 7px);
width: 14px;
height: 12px;
background-color: white;
border-left: 1px solid rgb(48,49,51);
border-right: 1px solid rgb(48,49,51);
}
.div-dot:after
{
content: "";
position: absolute;
z-index: 1;
top: -9px;
left: calc(50% - 9px);
width: 18px;
height: 18px;
background-color: red;
border: 1px solid rgb(48,49,51);
border-radius: 50%;
box-shadow: inset 0 0 0 2px white,
0 0 0 4px white;
}
/* ------------- Pre-loader CSS 2024-07-03 -----*/
.page-loader{
width: 100%;
height: 100vh;
position: absolute;
background: #272727;
z-index: 1000;
}
.txt{
color: #666;
text-align: center;
top: 40%;
position: relative;
text-transform: uppercase;
letter-spacing: 0.3rem;
font-weight: bold;
line-height: 1.5;
}
/* ------------ Pre-loader CSS 2024-07-03 ----- */
/*--------------- Spinner animation ------------------*/
.spinner {
position: relative;
top: 35%;
width: 80px;
height: 80px;
margin: 0 auto;
background-color: #fff;
border-radius: 100%;
-webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
animation: sk-scaleout 1.0s infinite ease-in-out;
}
@-webkit-keyframes sk-scaleout {
0% { -webkit-transform: scale(0) }
100% {
-webkit-transform: scale(1.0);
opacity: 0;
}
}
@keyframes sk-scaleout {
0% {
-webkit-transform: scale(0);
transform: scale(0);
} 100% {
-webkit-transform: scale(1.0);
transform: scale(1.0);
opacity: 0;
}
}
/*--------------- FIN Spinner animation ------------------*/
/*---------------DEBUT MENU CACHE A DECOUVRIR-*/
/* 2024-08-15 Ce qui suit ajouté cadre test menu */
/* Navigation Menu - Background */
.navigation {
/* critical sizing and position styles */
width: 100%;
height: 100%;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 0;
/* non-critical appearance styles */
list-style: none;
background: #111;
}
/* Navigation Menu - List items */
.nav-item {
/* non-critical appearance styles */
width: 200px;
border-top: 1px solid #111;
border-bottom: 1px solid #000;
}
.nav-item a {
/* non-critical appearance styles */
display: block;
padding: 1em;
background: linear-gradient(135deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%);
color: white;
font-size: 1.2em;
text-decoration: none;
transition: color 0.2s, background 0.5s;
}
.nav-item a:hover {
color: #c74438;
background: linear-gradient(135deg, rgba(0,0,0,0) 0%,rgba(75,20,20,0.65) 100%);
}
/* Site Wrapper - Everything that isn't navigation */
.site-wrap {
/* Critical position and size styles */
min-height: 100%;
min-width: 100%;
background-color: #f3f3f3; /* Needs a background or else the nav will show through */
position: relative;
top: 0;
bottom: 100%;
left: 0;
z-index: 1;
/* non-critical apperance styles */
/* padding: 4em;
background-image: linear-gradient(135deg, rgb(254,255,255) 0%,rgb(221,241,249) 35%,rgb(160,216,239) 100%);
background-size: 200%;*/
}
/* Nav Trigger */
.nav-trigger {
/* critical styles - hide the checkbox input */
position: absolute;
clip: rect(0, 0, 0, 0);
}
label[for="nav-trigger"] {
/* critical positioning styles */
position: fixed;
left: 15px; top: 15px;
z-index: 2;
/* non-critical apperance styles */
height: 30px;
width: 30px;
cursor: pointer;
background-image: url("data:image/svg+xml;utf8,");
background-size: contain;
}
/* Make the Magic Happen */
.nav-trigger + label, .site-wrap {
transition: left 0.2s;
}
.nav-trigger:checked + label {
left: 215px;
}
.nav-trigger:checked ~ .site-wrap {
left: 200px;
box-shadow: 0 0 5px 5px rgba(0,0,0,0.5);
}
body {
/* Without this, the body has excess horizontal scroll when the menu is open */
overflow-x: hidden;
}
/* Micro reset */
*,*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;}
/*html, body { height: 100%; width: 100%; font-family: Helvetica, Arial, sans-serif; }*/
/*---------------------FIN css lié au menu -----------------------*/
/* BOUTONS IMAGE OUVERTURE PANNEAU CHOIX VERSION */
.button, .buttonhelp, .buttondate
{
background-color: #f3f3f3;
position:relative;
border:none;
width:36px;
height:36px;
}
.button:focus, .buttonhelp:focus, .buttondate
{
top: 1px;
left:1px;
border:none;
}
.button:disabled, .buttonhelp:disabled, .buttondate:disabled
{
opacity: 0.6;
cursor: not-allowed;
border:none;
}
.buttonbar
{
padding:4px;
margin:2px;
border:none;
}
.button {background-image:url("/js/calendrier-outlined36.png"); background-repeat: no-repeat}
.buttonhelp {background-image:url("/js/aide-vide-24.png"); background-repeat: no-repeat}
.buttondate {background-image:url("/js/modifier-36.png"); background-repeat: no-repeat}
.button:hover {background-image:url("/js/calendrier-filled36.png"); background-repeat: no-repeat}
.buttonhelp:hover {background-image:url("/js/aide-24.png"); background-repeat: no-repeat}
.buttondate:hover {background-image:url("/js/modifier-36.png"); background-repeat: no-repeat}
.button:focus {background-image:url("/js/calendrier-filled36.png"); background-repeat: no-repeat}
.buttonhelp:focus {background-image:url("/js/aide-24.png"); background-repeat: no-repeat}
.buttondate:focus {background-image:url("/js/modifier-36.png"); background-repeat: no-repeat}
/*----------------FIN-------------------*/
/*--------- Fenêtre sommaire du code fixe----*/
.sommaire {
background: #f3f3f3;
margin-left: auto;
margin-right: auto;
/*margin: 0;*/
padding: 0;
width: 780px;
/*background-color: antiquewhite;*/
top: 0;
position: -webkit-sticky;
position: sticky;
z-index: 2000;
}
.sticky {
top: 0;
position: fixed;
}
.container {
margin-left: auto;
margin-right: auto;
width: 800px;
padding: 0 20px;
/*color: #989898;*/
}
/*--------- FIN sommaire -----------*/
.parent
{
display: flex;
flex: wrap;
justify-content: space-around; /*flex-start; space-between; center;*/
align-items: stretch; /* stretch; flex-start; flex-end; baseline;*/
width: 90%;
}
.child
{
flex-wrap: nowrap;
margin: auto;
width: 90%;
}
/*----------------------*/
table {
border-collapse: collapse;
border: none;
/*border: 2px solid rgb(140 140 140);*/
font-family: sans-serif;
font-size: 1.2rem;
letter-spacing: 1px;
}
caption {
caption-side: bottom;
padding: 10px;
font-weight: bold;
}
thead, tfoot {
background-color: rgb(228 240 245);
}
th,
td {
border: 0px solid rgb(160 160 160);
padding: 8px 10px;
}
/*td:last-of-type {
text-align: center;
}*/
tbody > tr:nth-of-type(even) {
background-color: rgb(237 238 242);
}
tfoot th {
text-align: right;
}
tfoot td {
font-weight: bold;
}
/*------------Test Table-Div ----------Début--*/
.resp-table{
width: 100%;
max-width: 74%;
display: table;
}
.resp-table-caption{
display: table-caption;
text-align: center;
font-size: 15px;
font-weight: bold;
}
.resp-table-header{
display: table-header-group;
background-color: lightgray;
font-weight: bold;
font-size: 15px;
}
.table-header-cell{
display: table-cell;
padding: 10px;
text-align: center;
border-bottom: 1px solid black;
}
.resp-table-body{
display: table-row-group;
}
.resp-table-row{
display: table-row;
}
.table-body-cell{
display: table-cell;
}
.resp-table-footer {
display: table-footer-group;
background-color: gray;
font-weight: bold;
font-size: 15px;
color: rgba(255, 255, 255, 0.45);
}
.table-footer-cell{
display: table-cell;
padding: 10px;
text-align: center;
border-bottom: 1px solid black;
}
/*------------Test Table-Div ----------Fin--*/
/* Ajouté le 2025-06-09 pour test avec cp2000_date.html et cp2000_date20240912.html */
/*-----------ToolTip simple ----------------*/
/* Tooltip css utilisé par préférence à celui de bootstrap */
/* il est nécessaire de renommer tous les tooltip en tooltip2 et tooltiptext en tooltiptext2 --*/
.tooltip2 {
position: relative;
/*display: inline-block;*/
display: inline;
border-bottom: 1px dotted black;
color: blue;
vertical-align: top;
font-weight: bold;
}
.tooltip2 .tooltip2text {
visibility: hidden;
width: 260px;
background-color: #0994D8;
color: aliceblue;
text-align: center;
border-radius: 6px;
padding: 5px 0;
text-indent: 20px; /*pour éviter débordement à gauche avec Firefox */
/* Position the tooltip2 */
position: absolute;
z-index: 1;
bottom: 100%;
left: 50%;
/*margin-left: -120px;*/
text-decoration:none!important; /*eviter formatage des ins et del */
font-size: 80%;
}
.tooltip2:hover .tooltip2text {
visibility: visible;
}