@charset "utf-8";
/* CSS Document */
h1 {
  font-size:24pt;
}
h2 {
  font-size:20pt;
}
h3 {
  font-size:18pt;
}
h4 {
  font-size:16pt;
}h5 {
  font-size:14pt;
}
h1, h2, h3, h4, h5 {
  font-weight:normal;
}
.body_blanc {
 background:rgba(255,255,255,1.0);
}
_body, .body_index {
  background-image: url("../images/Fond_Web_2024.jpg");
background-attachment: fixed;
}
.body4, .fond_jeunes {
  background-repeat:no-repeat;
  background-attachment: fixed;
  background-image:url(../images/web_2023/fond_home.jpg);
  background-size:100%;
}
.body5 {
  background-repeat:no-repeat;
  background-attachment: fixed;
  background-image:url(../images/web_2023/fond_home2.jpg);
  background-size:100%;
}
.body6 {
  background-repeat:no-repeat;
  background-attachment: fixed;
  background-image:url(../images/web_2023/fond_home3.jpg);
  background-size:100%;
}
.body2 {
  background-image: url("../images/fond01.png");
    background-attachment: fixed;
  }
  .body_joli {
    background-image: url("../images/web_2023/jeunes01.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    }
  
body, .body_index {
background: rgba(230,230,235,1.0);
_background: rgba(190,190,190,1.0);
_background: rgba(240, 242, 245,1.0);
/*
background: repeating-radial-gradient(
    circle,
    rgb(245,245,245),
    rgb(245,245,245) 3px,
    rgb(240,240,240) 3px, 
    rgb(240,240,240) 6px
  )
*/  
}
*/
/*
rgb(162, 24, 91) #a2185b Mauve
rgb(214, 11, 82) #d60b52 Rose
rgb(40, 152, 213) #2898d5 Bleu
rgb(148, 193, 31) #94c11f Vert
rgb(243, 146, 0) #f39200 Orange
*/
a.lien_mauve {
 color:#a2185b;
}
a.lien_vert {
 color:#94c11f;
}
a.lien_bleu {
 color:#2898d5
}
a.lien_orange {
 color:#f39200;
}
a.lien_rose {
 color:#d60b52
}
a.lien_mauve:hover, a.lien_vert:hover, a.lien_bleu:hover, a.lien_orange:hover, a.lien_rose:hover {
 color:black
}
a.ls {
  letter-spacing: 0pt;
  transition-duration: 0.4s;
  width:100%;
  display: inline-block;
  background:rgba(255,255,255,0.1);
  margin-right:-30px;
  margin-left:-30px;
  border-radius:100px;
  color:rgba(255,255,255,1.0);
  margin-right:-150px;
  margin-left:-150px; 
  width:90%;
  text-shadow: 0.2px 0 0 rgba(20,20,20,1.0), 1px 1px 0 rgba(20,20,20,1.0), 0 1px 0 rgba(20,20,20,1.0), -1px 1px 0 rgba(20,20,20,1.0), -1px 0 0 rgba(20,20,20,1.0), -1px -1px 0 rgba(20,20,20,1.0), 0 -1px 0 rgba(20,20,20,1.0), 1px -1px 0 rgba(20,20,20,1.0);
 border:1px solid rgba(220,220,220,0.3)
}
a.ls:hover {
  letter-spacing: 3pt;
  transition-duration: 0.4s;
  background:rgba(255,255,255,0.5);
  color:rgba(255,255,255,1.0);
}a.ls2 {
  letter-spacing: 0pt;
  transition-duration: 0.4s;
  width:70%;
  display: inline-block;
  background:rgba(255,255,255,0.1);
  _margin-right:-30px;
  _margin-left:-30px;
  border-radius:100px;
  color:rgba(255,255,255,1.0);
  _margin-right:-50px;
  _margin-left:-50px; 
  _width:90%;
  _text-shadow: 0.2px 0 0 rgba(20,20,20,1.0), 1px 1px 0 rgba(20,20,20,1.0), 0 1px 0 rgba(20,20,20,1.0), -1px 1px 0 rgba(20,20,20,1.0), -1px 0 0 rgba(20,20,20,1.0), -1px -1px 0 rgba(20,20,20,1.0), 0 -1px 0 rgba(20,20,20,1.0), 1px -1px 0 rgba(20,20,20,1.0);
  text-shadow: black 0.1em 0.1em 0.2em;
  _border:1px solid rgba(220,220,220,0.3)
}
a.ls2:hover {
  letter-spacing: 2pt;
  transition-duration: 0.4s;
  background:rgba(255,255,255,0.5);
  color:rgba(255,255,255,1.0);
}
a.ls3_vert {
  _display:inline-block;
  width:80%;
  margin:auto;
  background:rgba(148, 193, 31, 1.0);
  padding:10px;
  color:rgba(255,255,255,1.0);
  font-size:16pt;
  border-radius:50px;
  transition-duration:0.4s;
  _letter-spacing: 1pt;
  height:100%;display:flex; align-items:center; justify-content:center;
  font-weight:normal;
  padding:20px;
}
a.ls3_vert:hover, .ls3_vert_ok {
  color:rgba(60,60,60,1.0);
  background:rgba(220,220,220,1.0);
  transition-duration:0.4s;
  _letter-spacing: 2pt;
}  
.cercle_vert {
  display: block;
  background: radial-gradient(circle at 100px 100px,rgba(148, 193, 31,1.0), rgba(255,255,255,1.0));
  background: radial-gradient(circle at 100px 100px,rgba(148, 193, 31,1.0), rgba(148, 193, 31,1.0));
  border-radius: 50%;
  height: 300px;
  width: 300px;
  margin: 0;
}
.cercle_bleu {
  display: block;
  _background: radial-gradient(circle at 100px 100px,rgba(40, 152, 213,1.0), rgba(255,255,255,1.0));
  background: radial-gradient(circle at 100px 100px,rgba(40, 152, 213,1.0), rgba(40,152,213,1.0));
  _background: radial-gradient(circle at 100px 100px,rgba(40, 152, 213,1.0), rgba(0,0,0,1.0));
  border-radius: 50%;
  height: 300px;
  width: 300px;
  margin: 0;
}
.cercle_mauve {
  display: block;
  _background: radial-gradient(circle at 100px 100px,rgba(162, 24, 91,1.0), rgba(255,255,255,1.0));
  background: radial-gradient(circle at 100px 100px,rgba(162, 24, 91,1.0), rgba(162,24,91,1.0));
  _background: radial-gradient(circle at 100px 100px,rgba(162, 24, 91,1.0), rgba(0,0,0,1.0));
  border-radius: 50%;
  height: 300px;
  width: 300px;
  margin: 0;
}
.cercle_orange {
  display: block;
  _background: radial-gradient(circle at 100px 100px,rgba(243, 146, 0,1.0), rgba(255,255,255,1.0));
  background: radial-gradient(circle at 100px 100px,rgba(243, 146, 0,1.0), rgba(243,146,0,1.0));
  _background: radial-gradient(circle at 100px 100px,rgba(243, 146, 0,1.0), rgba(0,0,0,1.0));
  border-radius: 50%;
  height: 300px;
  width: 300px;
  margin: 0;
}
.cercle_mauve:hover, .cercle_vert:hover, .cercle_bleu:hover, .cercle_orange:hover {
  _background:black;
  _transition-duration:0.4s;
}
.cercle_mauve, .cercle_vert, .cercle_bleu, .cercle_orange {
  _transition-duration:0.4s;
  box-shadow: 0px 0px 20px rgba(160,160,160,0.9);
  _border:5px solid rgba(200,200,200,1.0);
  border:0px solid rgba(20,20,20,0.4);
}

.vignette {
  width:50%;
  border-radius:10px;
  border:1px solid rgba(120,120,120,1.0);
}
.vignette_a_droite, .vignette_a_gauche {
  width:25%; 
  margin:20px;border:1px solid rgb(220,220,220);
  border-radius:10px;
}
.vignette_a_droite {
  float:right;
}
.vignette_a_gauche {
  float:left;
}

a.ombre_texte {
  color:rgba(255,255,255,1.0); text-shadow: black 0.1em 0.1em 0.2em;
}
a.ombre_texte:hover {
  color:rgba(255,255,255,1.0); text-shadow: black 0.1em 0.1em 0.2em;
}
.acc{
  margin-right:50px;
  margin-left:50px;  
}
/* ************** Navigation en haut à droite **************  */
a.back {
content:url("../images/web_2023/back4.png");
opacity:0.6;
transition-duration: 0.4s;
}
a.back:hover {
content:url("../images/web_2023/back4_hover.png");
opacity:1;
transition-duration: 0.4s;
}
a.home {
content:url("../images/web_2023/home_gris.png");
}
a.home:hover {
content:url("../images/web_2023/home_gris.png");
}
a.haut {
content:url("../images/web_2023/haut.png");
}
a.haut:hover {
content:url("../images/web_2023/haut_hover.png");
}
a.back, a.back:hover, a.home, a.home:hover, a.haut, a.haut:hover {
  height:50px;
  _padding-top:5px;
}
/****** DÉBUT DES STYLES DE LA PAGE ml.php : ******/
.rdv_texte {
  color:#d60b52;
}
.tel_texte {
  color:#94c11f;
}
.mail_texte {
  color:#2898d5;
}
.local_texte:hover {
  color:#f39200;
}
.local_texte {
  color: black;
}
.rs_texte {
  color:#2898d5;
}
.quoi_texte {
  color:#a2185b;
}

.rose2, .c_rose {
  color:#d60b52;
}
.vert2, .c_vert {
  color:#94c11f;
}
.bleu2, .c_bleu {
  color:#2898d5;
}
.orange2, .c_orange {
  color:#f39200;
}
.black2, .c_black {
  color: black;
}
.gris2, .c_gris {
  color: rgb(70, 70, 70);
}

.mauve2, .c_mauve {
  color:#a2185b;
}
.rose2, .bleu2, .vert2, .mauve2, .orange2 {
  letter-spacing:3pt;
  font-size:0.8em;
}

.blanc, a.blanc, a.blanc:hover {
  color:rgb(255,255,255);
}
.rdv, .rdv_h {
  content: url("../images/web_2023/rdv_hover.png");
}
.mail, .mail_h {
  content: url("../images/web_2023/mail_hover.png");
}
.tel, .tel_h {
  content: url("../images/web_2023/tel_hover.png");
}
.local, .local_h {
  content: url("../images/web_2023/local_hover.png");
}
.quoi, .quoi_h {
  content: url("../images/web_2023/quoi_hover.png");
}
.chiffres, .chiffres_h {
  content: url("../images/web_2023/chiffres_hover.png");
}

.rs, .rs_h {
  content: url("../images/web_2023/rs_hover.png");
}
.appli, .appli_h {
  content: url("../images/web_2023/appli_hover.png");
}
.services, .services_h {
  content: url("../images/web_2023/services_hover.png");
}
.offres, .offres_h {
  content: url("../images/web_2023/offres_hover.png");
}
.evts, .evts_h {
  content: url("../images/web_2023/evts_hover.png");
}
.label, .label_h {
  content: url("../images/web_2023/label.png");
}
.loupe, .loupe_h {
  content: url("../images/web_2023/loupe_hover.png");
}
.rdv:hover, .rdv_h:hover {
  content: url("../images/web_2023/rdv.png");
}
.mail:hover, .mail_h:hover {
  content: url("../images/web_2023/mail.png");
}
.tel:hover, .tel_h:hover {
  content: url("../images/web_2023/tel.png");
}
.local:hover, .local_h:hover {
  content: url("../images/web_2023/local.png");
}
.quoi:hover, .quoi_h:hover {
  content: url("../images/web_2023/quoi.png");
}
.chiffres:hover, .chiffres_h:hover {
  content: url("../images/web_2023/chiffres.png");
}
.rs:hover, .rs_h:hover {
  content: url("../images/web_2023/rs.png");
}
.appli:hover, .appli_h:hover {
  content: url("../images/web_2023/appli.png");
}
.services:hover, .services_h:hover {
  content: url("../images/web_2023/services.png");
}
.offres:hover, .offres_h:hover {
  content: url("../images/web_2023/offres.png");
}
.evts:hover, .evts_h:hover {
  content: url("../images/web_2023/evts.png");
}
.label:hover, .label_h:hover {
  content: url("../images/web_2023/label_hover.png");
}
.loupe:hover, .loupe_h:hover {
  content: url("../images/web_2023/loupe.png");
}
.liens_utiles {
  content: url("../images/web_2023/liens_utiles.png");
}
.liens_utiles:hover {
  content: url("../images/web_2023/liens_utiles_hover.png");
}
.liens_utiles, .liens_utiles:hover {
width:100%;
}

.rdv, .mail, .tel, .local, .quoi, .rs, .appli, .services, .loupe, .chiffres, .offres, .evts, .label {
  width:100px;
  transition-duration: 0.4s;
  _display:inline-block;
}
.rdv_h, .mail_h, .tel_h, .local_h, .quoi_h, .rs_h, .appli_h, .services_h, .loupe_h, .chiffres_h, .label_h {
  width:40px;
  transition-duration: 0.4s;
}
.rdv:hover, .mail:hover, .tel:hover, .local:hover, .quoi:hover, .quoi:hover, .rs:hover, .appli:hover, .services.hover, .loupe:hover, .chiffres:hover, .offres:hover, .evts_hover, .label_hover {
    transition-duration: 0.4s;
}  
.rdv_h:hover, .mail_h:hover, .tel_h:hover, .local_h:hover, .quoi_h:hover, .quoi_h:hover, .rs_h:hover, .appli_h:hover, .services_h:hover, .loupe_h:hover, .offres_h:hover, .evts_h:hover, .label:hover {
  transition-duration: 0.4s;
}
a.rdv2, a.mail2, a.tel2, a.local2, a.quoi2, a.rs2 {
  color:rgb(0,0,0);
 }    
 a.rdv2:hover, a.mail2:hover, a.tel2:hover, a.local2:hover, a.quoi2:hover, a.rs2:hover {
  color:rgb(20,20,20);
 } 
 
/****** FIN DES STYLES DE LA PAGE D'ACCUEIL : ******/

/****** DÉBUT DES STYLES DE LA PAGE D'ACCUEIL index.php : ******/
.jeune {
  background-image: url("../images/web_2023/Jeunes_2b.jpg");
}
.emp {
  background-image:url("../images/web_2023/Employeur_1.jpg");
}
.serv {
  background-image:url("../images/web_2023/Servicesb.jpg");
}
.ml {
  background-image:url("../images/web_2023/ML2b.jpg");
}
.eff_01 {
  color:rgb(255,255,255);
  color:whitesmoke;
  font-weight:normal;
  text-shadow: 0.2px 0 0 rgba(20,20,20,1.0), 1px 1px 0 rgba(20,20,20,1.0), 0 1px 0 rgba(20,20,20,1.0), -1px 1px 0 rgba(20,20,20,1.0), -1px 0 0 rgba(20,20,20,1.0), -1px -1px 0 rgba(20,20,20,1.0), 0 -1px 0 rgba(20,20,20,1.0), 1px -1px 0 rgba(20,20,20,1.0);
  font-size:30pt;
  margin-top:10px;
  margin-bottom:10px;
  margin-left:-5px;
  margin-right:-5px;
  background-size:cover;  
  border:1px solid rgb(180,180,180);
  border-radius:7px;
  height:280px;
  
  transition-duration:0.4s;
  _box-shadow:8px 8px 8px rgba(120,120,120,0.25);  
}
.eff_01:hover {
  border:1px solid rgb(140,140,140);
/*box-shadow:10px 10px 10px rgba(176,193,219,0.7);*/
  box-shadow: 0px 0px 20px rgba(160,160,160,0.9);
  transition-duration:0.4s;
}
a.carres_emp, a.carres_jeune, a.carres_serv, a.carres_ml {
  background:rgba(255,255,255,0); 
  border-radius:7px;
  width:100%;
  height:100%;
  display:inline-block;
  text-decoration:none;
  color:white;
  font-weight: normal;
  padding-top:60px;
  transition-duration:0.4s;
  letter-spacing: normal;
}
a.carres_jeune:hover, a.carres_emp:hover, a.carres_serv:hover, a.carres_ml:hover {
  background:rgba(255,255,255,0.6); 
  padding-top:40px;
  transition-duration:0.4s;
  color: white;
  letter-spacing: 2pt;
  font-weight:normal;
}
/*
a.carres_jeune:hover {
  color:rgba(40, 152, 213,1.0);
}
a.carres_emp:hover {
  color:#94c11f;
}
a.carres_serv:hover {
  color:#f39200;
}
a.carres_ml:hover {
  color:#d60b52;
}
*/
/****** FIN DES STYLES DE LA PAGE D'ACCUEIL ******/

a.a_mauve_ko {
 background: linear-gradient(transparent 50%, #a2185b);
}
/*
.rose {
 background: linear-gradient(transparent 50%, #d60b52);
 padding-left: 10px; padding-right:10px;
 border-radius:10px;
}
.bleu {
 background: linear-gradient(transparent 50%, #2898d5);
 padding-left: 10px; padding-right:10px;
 border-radius:10px;
}
 .vert {
 background: linear-gradient(transparent 50%, #94c11f);
 padding-left: 10px; padding-right:10px;
 border-radius:10px;
}
 .orange {
 background: linear-gradient(transparent 50%, #f39200);
 padding-left: 10px; padding-right:10px;
 border-radius:10px;
}
.gris {
 background: linear-gradient(transparent 50%, rgba(150,150,150,1.0));
 padding-left: 10px; padding-right:10px;
 border-radius:10px;
}
*/

.ul1{
  list-style-type:none;
  padding: 0;
  margin: 0;
}
.li {
  padding-left: 16px;
}
.li1::before{
  content: "►";
  padding-right: 8px;
  color: green;
}
a, _a.a_oranger {
text-decoration:none;
color:#2898d5;
}
a:hover, _a.a_oranger {
text-decoration:none;
color:#d60b52;
}
a.a_inv {
  text-decoration:none;
  color:#d60b52;
  }
a.a_inv:hover{
  text-decoration:none;
  color:rgb(242, 145, 0)
  }
  
a.a003,a.a003:hover {
color:rgba(0,0,0,1.0);
display:inline-block;
}
a.neutre, a.neutre:hover {
color : rgba(50,50,50,1.0);
}
.ca {
_width:80%;
_height:80%;
box-shadow: 0px 0px 20px rgba(60,60,60,0.9);
}
.div_img {
margin-top:15px;
position: relative; 
/*z-index: 2; */
background:transparent;
}
.div_text {
position: relative; 
/*z-index: 4; */
background:transparent; 
width:100%;
}
a.cc {
text-decoration:none;
}
a.cc:hover {
text-decoration:none;
color:blue;
}
a.a1 {
color:rgba(255,255,255,1.0);
font-size:10pt;
}
a.a1:hover {
color:rgba(255,255,255,1.0);
text-decoration: none;
}
.h1a {
font-size:20pt;
}
.h1b {
color:lightgoldenrodyellow;
text-shadow: 10 10 15px rgba(80, 80, 80, 1);
font-size:20pt;
}
.h1c {
font-size:26pt;
color:rgba(30,30,30,1.0);
font-weight:normal;
}
.h5a {
font-size:14pt;
color:rgba(30,30,30,1.0);
font-weight:lighter;
color:rgba(10,10,10,1.0);
}
.h2a {
margin-top:20px;
font-size:22pt;
font-weight:lighter;
color:rgba(10,10,10,1.0);
}
.maigre {
font-weight:normal;
}
.gras {
font-weight:bold;
}
.img1 {
opacity:1.0;
transition-duration:0.4s;
width:100%; 
/*border:1px solid transparent;
border:1px solid rgba(80,80,80,0.8);*/
border-radius:8px;
}
.img1:hover {
opacity:0.7;
transition-duration:0.4s;
/*border:1px solid rgba(20,20,20,0.8);*/
z-index:2;
}
.center_text {
top: 40%; /* Déplace le texte au milieu vertical */
left: 50%; /* Déplace le texte au milieu horizontal */
transform: translate(-50%, -50%);
position:absolute;
/*z-index:1;*/
}
.center_vertical {
  height:100%;
  display:flex; align-items:center; 
  justify-content:center;
}
.padding10 {
padding:10px;
margin:10px;
}
.voir_css {
border:1px solid black;
background:yellow;
}
.center, .centre {
text-align:center;
}
.gauche, .left {
text-align:left;
}
.droite, .right {
text-align:right;
}
.justify, .justif {
text-align:justify;
}
.border02 {
border:1px solid rgba(80,80,80,0.0);
border-radius:7px;
min-height:200px;
}
.border03 {
border:1px solid rgba(80,80,80,0.0);
border-radius:7px;
padding:10px;
margin-top:10px;
margin-bottom:10px;
}
.border04 {
border:1px solid rgba(80,80,80,0.0);
border-radius:7px;
padding:10px;
margin-top:20px;
margin-bottom:10px;
padding:10px;
}
.margin5 {
margin:2px;
/*margin-left:0px;
margin-right:0px;*/
height:90%;
padding:5px;
}
.fond_blanc2 {
background:rgba(255,255,255,0.7);
box-shadow: 0px 0px 20px rgba(60,60,60,0.9);
}
.fond_blanc {
background:rgba(255,255,255,0.7);
/*background: linear-gradient(rgba(230,230,230,1.0) 50%, rgba(255,255,255,1.0));*/
box-shadow: 0px 0px 20px rgba(160,160,160,0.9);
}
.contour {
color:rgb(255,255,255);
color:whitesmoke;
font-weight:normal;
text-shadow: 0.2px 0 0 rgba(20,20,20,1.0), 1px 1px 0 rgba(20,20,20,1.0), 0 1px 0 rgba(20,20,20,1.0), -1px 1px 0 rgba(20,20,20,1.0), -1px 0 0 rgba(20,20,20,1.0), -1px -1px 0 rgba(20,20,20,1.0), 0 -1px 0 rgba(20,20,20,1.0), 1px -1px 0 rgba(20,20,20,1.0);
}
.contour2 {
color:rgb(255,255,255);
color:whitesmoke;
font-weight:normal;
text-shadow: 0.02px 0 0 rgba(120,120,120,1.0), 1px 1px 0 rgba(120,120,120,1.0), 0 1px 0 rgba(120,120,120,1.0), -1px 1px 0 rgba(120,120,120,1.0), -1px 0 0 rgba(120,120,120,1.0), -1px -1px 0 rgba(120,120,120,1.0), 0 -1px 0 rgba(120,120,120,1.0), 1px -1px 0 rgba(120,120,120,1.0);
}
.spacing {
color:lemonchiffon;
letter-spacing:2pt;
transition-duration:0.4s;
}
.spacing:hover {
/*letter-spacing:3pt;*/
transition-duration:0.4s;
color:lemonchiffon;
}
.logo40 {
width:40px;
}

.erreur_form2 {
_text-align:center;
color:red;
margin-top:-10px;
font-size:10pt;
_text-align:left;
}
.pave_logo {
border:1px solid rgba(200,200,200,0.9);
border-radius:10px;
background:rgba(240,240,240,1.0);
height:100%;padding:10px;
}
.image5 {
  height:95px;
  margin:10px;
  }
  .pave_soutien_in {
   border:1px solid rgba(60,60,60,0.5);
   border-radius:10px;
   text-align:center;
   height:130px;
   margin:3px;
   background:rgb(255,255,255);
  }
.text_bleu, a.a_bleu {
    color:rgb(38, 150, 212);
}
.text_rose, a.a_rose {
    color:rgb(214, 11, 81);
}
.text_vert, a.a_vert {
    color:rgb(147, 192, 31);
}
.text_mauve, a.a_mauve {
    color:rgb(162, 25, 91);
}
.text_orange, a.a_orange {
    color:rgb(242, 145, 0);
}
a.a_bleu:hover, a.a_rose:hover, a.a_vert:hover, a.a_mauve:hover, a.a_oragnge:hover {
  color:rgb(255,255,255);
} 
.vignette_parent {
  _border:1px solid black;
  _border:1px solid rgba(100,100,100,0.5);
  _border-radius:10px 10px 5px 5px;
  border-radius:0px 0px 0px 0px;
  _background:rgb(230, 229, 229);
  height:90%;
  margin-top:10px;
  width:100%;
}

.vignette {
  width:100%;
  padding:5px;
  _background:rgb(102, 102, 102);
  _background:rgba(243,146,4,1.0);
  color:rgba(255,255,255,1.0);
  font-weight:normal;
  min-height: 60px;
  display:flex; align-items:center; justify-content:center;
  _border-radius:10px 10px 0px 0px;
  _border-radius:0px 0px 0px 0px;
  font-weight:bold;
}
.vignette1 {
  width:100%;
  padding:5px;
  _background:rgb(102, 102, 102);
  background:rgba(243,146,4,1.0);
  color:rgba(255,255,255,1.0);
  font-weight:normal;
  _min-height: 60px;
  display:flex; align-items:center; justify-content:center;
  _border-radius:10px 10px 0px 0px;
  border-radius:0px 0px 0px 0px;
}
.vignette2 {
  border-radius:10px;
  margin:10px;
  padding:10px;
  color:rgba(255,255,255,1.0);
}
.vignette3 {
  _border:1px solid black;
  border:1px solid rgba(100,100,100,0.5);
  _border-radius:10px 10px 5px 5px;
  padding:0px;
  margin:8px;
}
.vignette4 {
  color:white;
  margin:0px;
  border-radius:0px 0px 0px 0px;
  padding:10px;
}
/* Dans un DIV, une texte en haut et un texte en bas : */
.container2 {
  position: relative;
  height: 150px; /* Ajustez la hauteur selon vos besoins */
  }
  .top-text {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  text-align: center; /* Centrer le texte horizontalement */
  }
  .bottom-text {
  position: absolute;
  bottom: -5;
  left: 0;
  right: 0;
  text-align: center; /* Centrer le texte horizontalement */
  }
/* variante sur le même thème : */
  .parent {
    position: relative;
    }
    .top_text {
    position: absolute;
    top:0;

    }
    .bottom_text {
    position: absolute;
    bottom:0;

    }