/***********************************************/
/* HTML styles des pages par défaut*/
/***********************************************/
body{
	background-image: url("images/image001.png");
	font-family: Arial;
	color: #333333;
	font-size: 16px;
	line-height: 1.025;	
	width:100%;
}
#pagewrapper {width:78vw; background:#FFFFFF; padding:0 20px; margin:0 auto;
-webkit-box-shadow: 0 0 5px 5px #333; -moz-box-shadow: 0 0 5px 5px #333; box-shadow: 0 0 5px 5px #333;}
#page70vw {width: 70vw; background:#FFFFFF; padding:0 2vw 0 2vw;
margin:0 auto; line-height: 1; -webkit-box-shadow: 0 0 5px 5px #333;}
#page80vw {width: 80vw; background:#FFFFFF; padding:0 2vw 0 2vw;
margin:0 auto; line-height: 1;	-webkit-box-shadow: 0 0 5px 5px #333;}
#page86vw {width: 86vw; background:#FFFFFF; padding:0 1.75vw 0 1.75vw;
margin: 0 0 0 4vw; line-height: 1;	-webkit-box-shadow: 0 0 5px 5px #333;}
/***********nouveau novembre 2025********************/
#page94vw {
width: 94vw;
background:#FFFFFF;
padding:0 0.75vw 0 0.75vw;
margin:0 auto;
line-height: 1;	
-webkit-box-shadow: 0 0 5px 5px #333;
}
/*******************************/
.articletext1 {
background:#FFFFFF;
margin-left: 0.10in;
margin-right: 0.10in;
}
/***************** WORD ********************/
#pageword {
background:#FFFFFF;
margin-left: 0.67in;
margin-right: 0.67in;
box-shadow: 0 0 5px 3px #333;
}
p.word1{
font-family: Liberation Serif, serif;
margin-left: 0.08in;
margin-right: 0.08in;
margin-top: 0.08in;
margin-bottom: 0.08in;
line-height: 100%;
font-size: 12pt;
}
p.word2{
font-family: Liberation Serif, serif;
margin-left: 0.08in;
margin-right: 0.08in;
margin-top: 0.08in;
margin-bottom: 0.08in;
line-height: 100%;
font-size: 12pt;
}
/*************Spécial re7**************/
p.re7, li.re7{
	margin-left:0.2vw;
	line-height:1.2;
	font-size: clamp(0.7rem, 1.15vw, 1.125rem);
	font-family:"Arial";
	color:black;}
	
span.rece31N{
	position:absolute;
	color :#650000;
	left:clamp(210px, 31vw, 360px);}
/*****************p class******************/
p{font-family:Arial;color:black;line-height:100%;font-size:clamp(0.65em,1.25vw,1.15em);}

p.smartphone{
	font-family: Arial;
	color: black;
	line-height: 1.2;
	font-size: clamp(0.51rem, 1.125vw, 1.125rem); /* taille pour smartphone */}
p.smart57{
	font-family: Arial;
	color: black;
	line-height:100%;
	font-size: clamp(0.57em, 1.125vw, 1.125em); /* taille pour smartphone */}
@media screen and (min-width: 280px) and (max-width: 609px) {
p.tablette{
	font-family: Arial;
	color: black;
	line-height:1.5em;
	font-size: clamp(0.57em, 1.125vw, 1.125em); /* taille pour smartphone */
}}
@media screen and (min-width: 610px) and (max-width: 1660px) {
p.tablette{
	font-family: Arial;
	color: black;
	line-height:80%;
	font-size: clamp(0.625em, 1.125vw, 1.125em);
}}
p.ecran{
	font-family: Arial;
	color: black;
	line-height:80%;
	font-size: clamp(0.625em, 1.15vw, 1.15em);}
p.ecran7em{
	font-family: Arial;
	color: black;
	line-height:80%;
	font-size: clamp(0.7em, 1.155vw, 1.155em);}
p.ecranB{
	font-family: Arial;
	color :#000F5F;
	line-height:80%;
	font-size: clamp(0.7em, 1.155vw, 1.155em);}
p.small{
	font-family: Arial;
	line-height:0.2%;
	clear: both;
	font-size: clamp(0.1vw, 0.1vw, 0.1vw);}
a:link, a:visited, a:hover{
color: #052b2b;
font-size: clamp(0.7em, 1.125vw, 1.125em);
text-decoration: none;
}
a.bouton{
	color: white;
	font-size: clamp(0.6em, 1vw, 1.15em);}
a.lien1:link {
color: #185a82;
font-size: clamp(0.7em, 1.15vw, 1.25em);
text-decoration: none;}
a.lien1:visited, a.lien1:hover {
font-family: Liberation;
margin:10px 0px 10px 0px;
line-height:80%;
color: #0c64ee;
font-size: clamp(0.65em, 1.125vw, 1.125em);
text-decoration: none;}
a.lien2:link {
color: #FFF;
font-size: clamp(0.65em, 1.125vw, 1.125em);
text-decoration: none;}
a.lien2:visited, a.lien2:hover {
font-family: Arial;
color: #FFF;
font-size: clamp(0.65em, 1.125vw, 1.125em);
text-decoration: none;}
/* lien3 dans marees.php et ports.php */
a.lien3:link {
margin:2px 0px 2px 0px;
color: #291001;
font-size: clamp(0.65em, 1.125vw, 1.125em);
text-decoration: none;}
a.lien3:visited, a.lien3:hover {
font-weight: bold;
margin:2px 0px 2px 0px;
color: #5f2705;
font-size: clamp(0.65em, 1.125vw, 1.125em);
text-decoration: none;}
.Geriou, li.Geriou, div.geriou {
	font-size: clamp(0.715em, 1.13vw, 1.3em);
	font-family:"Liberation Serif",serif;}
p.Ligne{
	font-family: Arial;
	text-align: justify;
	font-size: clamp(0.7em, 1vw, 1em);}
p.Arial{
	font-family: Arial;
	margin:0px 0px 0px 0px;
	line-height:130%;
	font-size: clamp(0.7em, 1.10vw, 1em); /* taille du texte */
	font-weight: 400;
	color: #000000;}
p.Galleg, li.Galleg, div.Galleg{
	font-family: Liberation;
	margin:10px 0px 10px 0px;
	line-height:80%;
	font-size: clamp(0.78em, 1.15vw, 1.25em); /* taille du texte */
	font-weight: 400;
	color: #650000;}
p.Geriaoueg{
	font-family: Arial;
	margin:10px 0px 10px 0px;
	/*line-height:80%;*/
	font-size: clamp(0.71em, 1.10vw, 1em); /* taille du texte */
	font-weight: 400;
	color: #000000;}
p.Justif {
	margin:5px 0px 5px 0px;
	color: black;
	word-break: break-word;
	text-align: justify;
	line-height:1.25em;
	font-size: clamp(0.7em, 1.2vw, 1.2em);
	font-family: Arial;}
p.Justifecran {
	margin:0px 0px 0px 0px;
	color: black;
	word-break: break-word;
	text-align: justify;
	line-height:1em;
	font-size: clamp(0.625em, 1.175vw, 1.175em);
	font-family: Arial;}
p.Kentel, li.Kentel, div.Kentel {
    word-break: break-word;
	text-align: justify;
	letter-spacing: .1em;
	font-size:13pt;
	font-family:"Liberation Serif",serif;}
p.Liberation{
	font-family:Liberation;
	margin:10px 0px 10px 0px;
	line-height:80%;
	font-size: clamp(0.78em, 1.25vw, 1.25em);
	font-weight: 400;
	color: #000000;}
p.Normal, li.Normal, div.Normal {
	word-break: break-word;
	letter-spacing: normal;
	font-size: clamp(0.78em, 1.25vw, 1.25em);
	line-height:115%;
	font-family:"Liberation Serif",serif;}
p.Normal1, li.Normal1, div.Normal1{
	word-break: break-word;
	letter-spacing: normal;
	color: #000000;
	font-size: clamp(0.7em, 1.35vw, 1.25em);
	line-height:100%;
	font-family:"Liberation Serif",serif;}
p.Normah10, li.Normah10, div.Normah10{
	line-height:10%;
	margin:4px 0px 4px 0px;
	font-size: 50%;
	font-family:Liberation;}
p.Normah30, li.Normah30, div.Normah30{
	line-height:30%;
    word-break: break-word;
	letter-spacing: normal;
	font-size: clamp(0.72em, 1.25vw, 1.275em);
	font-family:"Liberation Serif",serif;}
p.Normah50, li.Normah50, div.Normah50{
	font-size: clamp(0.72em, 1.25vw, 1.275em);
	line-height:50%;
	font-family:"Liberation Serif",serif;}
p.Normah50V, li.Normah50V, div.Normah50V{
	font-size: clamp(0.6em, 1.205vw, 1.225em);
	line-height:50%;
	letter-spacing: 0px;
	font-family: Verdana, sans-serif;}
p.Normah70, li.Normah70, div.Normah70{
	margin:6px 0px 6px 0px;
	font-size: clamp(0.78em, 1.25vw, 1.25em);
	line-height:70%;
    word-break: break-word;
	letter-spacing: normal;
	font-family:"Liberation Serif",serif;}
p.Normah95, li.Normah95, div.Normah95{
	font-size: clamp(0.78em, 1.25vw, 1.25em);
	line-height:95%;
    word-break: break-word;
	letter-spacing: normal;
	font-family:"Liberation Serif",serif;}
p.Normah140, li.Normah140, div.Normah140{
	margin:6px 0px 6px 0px;
	line-height:1.3em;
	font-size: clamp(0.78em, 1.25vw, 1.25em);
    word-break: break-word;
	letter-spacing: normal;
	font-family:"Liberation Serif",serif;}
p.Normah100, li.Normah100, div.Normah100{
	font-size: clamp(0.7em, 1.15vw, 1.25em);
	color: #000000;
	line-height:90%;
    word-break: break-word;
	letter-spacing: normal;
	font-family:"Liberation Serif",serif;}
p.Normah110, li.Normah110, div.Normah110{
	margin:3px 0px 3px 0px;
	font-size: clamp(0.55em, 1.25vw, 1.25em);
	line-height:105%;
	letter-spacing: normal;
	font-family: serif;}
p.Normah140A, li.Normah140A, div.Normah140A{
	margin:3px 0px 3px 0px;
	font-size: clamp(0.78em, 1.115vw, 1.2em);
	line-height:120%;
    text-align:justify;
	font-family:Arial;}
p.Normah140120, li.Normah140120, div.Normah140120{
	margin:6px 0px 6px 0px;
	font-size: clamp(0.75em, 1.25vw, 1.25em);
	line-height:140%;
    word-break: break-word;
	letter-spacing: normal;
	font-family:"Liberation Serif",serif;}
p.Normah140121 {
	margin:6px 0px 6px 0px;
	font-size: clamp(0.75em, 1.25vw, 1.25em);
	color:#650000;
	line-height:140%;
    word-break: break-word;
	letter-spacing: normal;
	font-family:"Liberation Serif",serif;}
/*************** SPAN  RELATIVE ****************/	
span.gerr0M{
	/*** Kentel Mars 2021-1.php ***/
	position:relative;
	color :#650000;
	left:0vw;}
span.gerr0B{
		/*** Kentel Mars 2021-2.php ***/
	position:relative;
	color :#000F5F;
	left:0vw;}
span.gerr1M{
	position:relative;
	font-style: italic;
	color :#650000;
	left:1vw;}
span.gerr1B{
/*** Kentel Mars 2021-1.php et Kentel Avril 2021.php ***/
	position:relative;
	font-style: italic;
	color :#000F5F;
	left:1vw;}
span.gerr2M{
		/*** 3 fichiers.php ***/
	position:relative;
	color :#650000;
	left:2vw;}
span.gerr3M{
	position:relative;
	color :#650000;
	left:3vw;}
span.gerr3B{
	/*** Kentel Avril 2021.php ***/
	position:relative;
	color :#000F5F;
	left:3vw;}
/*************** SPAN  ABSOLUTE ****************/
span.gera2B{
/***Kentel Du 2025.php et Kentel Ebrel 2025.php***/
	position:relative;
	color :#000F5F;
	left:2vw;}
span.gera10{
	position:absolute;
	font-style: italic;
	color :#650000;
	left:10vw;}
span.gera10B{
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:10vw;}
span.gera12B{
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:12vw;}
span.gera14B{
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:14vw;}
span.gera16{
/*** 16 fichiers php ***/
	position:absolute;
	color :#650000;
	font-style: italic;
	left:16vw;}
span.gera16N{
/*** 11 fichiers php ***/
	position:absolute;
	color :#650000;
	left:clamp(16vw, 18vw, 21vw);}
span.gera16B{
/*** 0 fichier php ***/
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:16vw;}
span.gera18B{
	/*** Kentel mai 2022.php et Toponymie Falc'hun ***/
	position:absolute;
	color :#000F5F;
	left:clamp(110px, 21vw, 360px);}
span.gera18{
	/*** 31 fichiers php ***/
	position:absolute;
	color :#650000;
	font-style: italic;
	left:clamp(110px, 21vw, 360px);}
span.gera18N{
	/*** 7 fichiers php ***/
	position:absolute;
	color :#650000;
	left:clamp(110px, 21vw, 360px);}
span.gera26{
/*** 18 fichiers php ***/
	position:absolute;
	margin:0px 0px 0px 75px;
	color :#650000;
	font-style: italic;
	left:26vw;}
span.gera26N{
/*** Kentel mars 2021-1 et 2.php ***/
	position:absolute;
	color :#650000;
	left: clamp(26vw, 29vw,32vw);}
span.gera28{
/*** Kentel a viz here 2023.php ***/
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:26vw;}
span.gera30{
/*** Kouignou bro vigouden.php ***/
	position:absolute;
	color :#650000;
	font-style: italic;
	left:30vw;}
span.gera36{
/*** 21 fichiers.php ***/
	position:absolute;
	margin:0px 0px 0px 75px;
	color :#650000;
	font-style: italic;
	left:36.5vw;}
span.gera36N{
/*** Binig even 2023.php et Kentel mars 2021-2.php ***/
	position:absolute;
	color :#650000;
	left:36vw;}
span.gera38{
		/*** 3 fichiers.php ***/
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:36vw;}
span.gera38BN{
	position:absolute;
	color :#000F5F;
	left:38vw;}
span.gera42{
/*** 9 fichiers.php ***/
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:42vw;}
span.gera42M{
	/*** 7 fichiers.php ***/
	position:absolute;
	color :#650000;
	font-style: italic;
	left:42vw;}
span.gera46{
/*** 5 fichiers.php ***/
	position:absolute;
	color :#650000;
	font-style: italic;
	left:46vw;}
span.gera46N{
	/*** 4 fichiers.php ***/
	position:absolute;
	color :#650000;
	left:clamp(46vw, 49vw, 52vw);}
span.gera46NB{
	/*** Kentel C'hwevrer 2023.php ***/
	position:absolute;
	color :#000F5F;
	left:clamp(46vw, 49vw, 52vw);}
span.gera47{
	/*** 4 fichiers.php ***/
	position:absolute;
	font-style: italic;
	color :#650000;
	left:48vw;}
span.gera47B{
	/*** 3 fichiers.php ***/
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:47vw;}
span.gera48{
	/*** 5 fichiers.php ***/
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:48vw;}
span.gera48BN{
	/*** Amzerotremen.php ***/
	position:absolute;
	color :#000F5F;
	left:48vw;}
span.gera49B{
	/*** none ***/
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:49vw;}
span.gera50{
	/*** 6 fichiers.php ***/
	position:absolute;
	font-style: italic;
	color :#650000;
	left:clamp(50vw, 53vw, 56vw);
	}
span.gera50N{
	/*** 3 fichiers.php ***/
	position:absolute;
	color :#650000;
	left:clamp(47vw, 50vw, 53vw);}
span.gera50B{
	/*** 4 fichiers.php ***/
	position:absolute;
	color :#000F5F;
	left:50vw;}
span.gera51B{
	/*** none ***/
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:51vw;}
span.gera52{
	/*** 20 fichiers.php ***/
	position:absolute;
	font-style: italic;
	color :#650000;
	left:clamp(200px,52vw,1820px);
	}
span.gera52N{
	/*** Kentel C'hwevrer 2024.php ***/
	position:absolute;
	color :#650000;
	left:clamp(200px,52vw,1820px);}
span.gera54{
	/*** 5 fichiers.php ***/
	position:absolute;
	font-style: italic;
	color :#650000;
	left:54vw;}
span.gera55B{
	/*** Kentel Avril 2021.php ***/
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:55vw;}
span.gera56{
	/*** 4 fichiers.php ***/
	position:absolute;
	font-style: italic;
	color :#650000;
	left:56vw;}
span.gera56N{
	/*** 3 fichiers.php ***/
	position:absolute;
	color :#650000;
	left:56vw;}
span.gera56B{
	position:absolute;
	color :#000F5F;
	left:clamp(56vw, 59vw, 62vw);}
span.gera57B{
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:57vw;}
span.gera58{
	/*** info-divers-01.php ***/
	position:absolute;
	color :#650000;
	left:58vw;}
span.gera59B{
	/*** none ***/
	position:absolute;
	font-style: italic;
	color :#000F5F;
	left:59vw;}
span.gera60{
	/*** phrases conjugaison.php ***/
	position:absolute;
	font-style: italic;
	color :#650000;
	left:clamp(60vw, 63vw, 66vw);}
span.gera62{
	/*** 2 fichiers.php ***/
	position:absolute;
	color :#650000;
	left:clamp(200px,62vw,1820px);}
span.gera64N{
	/*** Kentel 05 & 11 Ebrel 2023.php ***/
	position:absolute;
	left:clamp(200px,64vw,1820px);
	color :#650000;}
span.gera66N{
	/*** 18 fichiers.php ***/
	position:absolute;
	left:66vw;
	color :#650000;}
span.gera66B{
	/*** Toponymie Falc'hun.php ***/
	position:absolute;
	left:66vw;
	color :#000F5F;}
@media screen and (min-width: 280px) and (max-width: 609px){
span.gera68N{
	/*** Enez Vaz.php ***/
	position:absolute;
	left:clamp(110px, 21vw, 28vw);
	color :#650000;}}
	
@media screen and (min-width: 610px) and (max-width: 1920px){	
span.gera68N{
	/*** Enez Vaz.php ***/
	position:absolute;
	left:clamp(469px, 71vw, 1820px);
	color :#650000;}}
span.gera75N{
	/*** Kentel ebrel 2025.php ***/
	position:absolute;
	left:75vw;
	color :#650000;}
/******SPAN Exposant********/
span.expo {
		font-size: 0.6em;
		color : red;
		vertical-align: top;
		font-weight:1000;}
sup {
	font-size: 0.6em;
   	vertical-align: super;
	font-weight:400;}
/*positionne la premiere photo */
p.Entetefoto{
	margin:0.25vw 0px 0.25vw 0px;
	font-size: 1em;
    word-break: break-word;
	letter-spacing: normal;
	font-family:Liberation;}
/***********************************************/
nav.general{
margin: 0.25vw 1px 1px 1px;}

nav a.Prim{ /* tous les liens a à l'intérieur de la balise nav  avec la classe : Prim */
float: left; /* effet flottant */
text-decoration: none; /* pas d'héritage avec effet souligné */
color: black; /* couleur du texte */
background: #99C6FF; /* couleur de fond */
line-height: 3vw; /* interligne */
border-radius: 4px;
padding:0px 4px; /* marges intérieures */
margin-left:0.1vw;
margin-top:4vw;
font-family: sans-serif; /* police d'écriture */
font-size: clamp(0.65em, 1vw, 1em); /* taille du texte */
transition: .5s; /* temps de transition lors du hover : une demi seconde */
}
nav a.Prim:hover{ /* tous liens lors du survol dans la balise nav avec la classe : test */
background: #f43c80; /* couleur de fond */
}
nav a.test{ /* tous les liens a à l'intérieur de la balise nav  avec la classe : test */
float: left; /* effet flottant */
text-decoration: none; /* pas d'héritage avec effet souligné */
color: black; /* couleur du texte */
background: #FFFF99; /* couleur de fond */
line-height: 3vw; /* interligne */
border-radius: 4px;
padding:0px 5px; /* marges intérieures */
margin-top:4vw;
margin-left:0.1vw;
font-family: sans-serif; /* police d'écriture */
font-size: clamp(0.65em, 1vw, 1em); /* taille du texte */
transition: .5s; /* temps de transition lors du hover : une demi seconde */
}
nav a.test:hover{ /* tous liens lors du survol dans la balise nav avec la classe : test */
background: #f43c80; /* couleur de fond */
}
nav a.selaouit{ 
color: black; /* couleur du texte */
background: #FFFF00; /* couleur de fond */
font-family: Futura; /* police d'écriture */
font-size: clamp(0.7em, 1.12vw, 1em); /* taille du texte */
transition: .5s; /* temps de transition lors du hover : une demi seconde */
}
nav a.selaouit:hover{
background: #f43c80; /* couleur de fond */
}

nav a.redirection{ 
padding:5px 5px;
margin:0px 0px 0px 3px;
border-radius: 4px;
color: black; /* couleur du texte */
background: #ffcc99; /* couleur de fond */
font-family: Arial; /* police d'écriture */
font-size: clamp(0.7em, 1.12vw, 1em); /* taille du texte */
transition: .5s; /* temps de transition lors du hover : une demi seconde */
}
nav a.redirection:hover{
background: grey; /* couleur de fond */
}


 /* DEBUT HEADER */
header {
 /*background-color: #fff;*/
inset: 0 0 auto 0;
padding-bottom: 1px;
padding-top: 1px;
position: sticky;
z-index: 11;
}
/***********nouveau novembre 2025********************/
#header_container { margin-left: 0vw; margin-right: 0vw;}
 /* FIN HEADER CONTAINER*/
 /* AUDIO */
 /***********nouveau novembre 2025********************/
figure { margin: -0.6em 0px 0.6em 0px;}
figcaption { margin: -0.6em 0px 0.6em 0px;}
/*****************************/
 /* VIDEO */
video {
  position: relative;
  inset: 0;
  margin: auto;
  max-width: 50%;
  max-height: 50%;
  user-select: none;
  -moz-user-focus: normal;
}
video:focus {outline-style: none;}
.videocontrols {
  writing-mode: horizontal-tb;
  width: 50%;
  height: 50%;
  display: inline-block;
  overflow: hidden;
  direction: ltr;
  user-select: none;
  text-align: left;
  list-style-image: none !important;
  font: sans-serif !important;
  text-decoration: none !important;
  white-space: normal !important;
}
.Player {
  width: 50%;
  height: 20%;
  display: block;
}
 /* GAUCHE DROITE */
section {
box-sizing: border-box;
border: 2px solid black;
width: 100%;
float: left;
}
#gauche {
width: 50%;
margin:-1.5vw 0 0vw 0;
line-height: 0.95;
float:left;
}
#droite {
width: 50%;
margin:-1.5vw 0 0vw 0;
line-height: 0.95;
float:right;
}
/***********nouveau novembre 2025*****(oulpan)***************/
#gauchoul {
width: 47vw;
margin:-1vw 0 0vw 0;
line-height: 0.95;
float:left;
padding-bottom: 1px;
}
@media screen and (min-width: 280px) and (max-width: 599px){
#droitoul {
width: 47vw;
margin:-1vw 0 0vw 0;
line-height: 0.95;
padding-bottom: 1px;
}}
@media screen and (min-width: 600px) and (max-width: 1920px){
#droitoul {
width: 47vw;
margin:-1vw 0 0vw 0;
line-height: 0.95;
float:right;
padding-bottom: 1px;
}}
/***********nouveau novembre 2025*****(oulpan)***************/
#gauchmedia {
width: 47vw;
margin:-1vw 0 0vw 0;
line-height: 0.95;
float:left;
padding-bottom: 1px;
}
@media screen and (min-width: 280px) and (max-width: 729px) {
span.geraG{
	/*** Toponymie Falc'hun.php ***/
	position:absolute;
	left:36vw;
	color :#000F5F;
}}
@media screen and (min-width: 730px) and (max-width: 2000px) {
span.geraG{
	/*** Toponymie Falc'hun.php ***/
	position:absolute;
	left:18vw;
	color :#000F5F;
}}
@media screen and (min-width: 280px) and (max-width: 729px) {
span.geraGMar{
	/*** Toponymie Falc'hun.php ***/
	position:absolute;
	left:36vw;
	color :#650000;
}}
@media screen and (min-width: 730px) and (max-width: 2000px) {
span.geraGMar{
	/*** Toponymie Falc'hun.php ***/
	position:absolute;
	left:18vw;
	color :#650000;
}}
@media screen and (min-width: 280px) and (max-width: 729px) {
#droitmedia {
width: 47vw;
margin:-1vw 0 0vw 0;
line-height: 0.95;
float:none;
padding-bottom: 1px;
}}
@media screen and (min-width: 730px) and (max-width: 2000px) {
#droitmedia {
width: 47vw;
margin:-1vw 0 0vw 0;
line-height: 0.95;
float:right;
padding-bottom: 1px;
}}
@media screen and (min-width: 280px) and (max-width: 729px) {
span.geraD{
	/*** Toponymie Falc'hun.php ***/
	position:absolute;
	left:36vw;
	color :#000F5F;
}}
@media screen and (min-width: 730px) and (max-width: 2000px) {
span.geraD{
	/*** Toponymie Falc'hun.php ***/
	position:absolute;
	left:66vw;
	color :#000F5F;
}}
@media screen and (min-width: 280px) and (max-width: 729px) {
span.geraDMar{
	/*** Toponymie Falc'hun.php ***/
	position:absolute;
	left:36vw;
	color :#650000;
}}
@media screen and (min-width: 730px) and (max-width: 2000px) {
span.geraDMar{
	/*** Toponymie Falc'hun.php ***/
	position:absolute;
	left:66vw;
	color :#650000;
}}
/******************************/
#left {
width: 49%;
background:#FFF8ED;
float:left;
}
#right {
width: 49%;
position:relative;
background:#FFF8ED;
float:right;
}
#tableleft {
width: 49%;
background:#FFFFF;
float:left;
}
#tableright {
width: 49%;
position:relative;
background:#FFFFF;
float:right;
}
/* overrides decoration from previous rule for hovered links */
h1{
font-family: Verdana,Arial,sans-serif;
font-size: clamp(0.75em, 1.30vw, 1.3em);
color: #334d55;
padding: 10px 0px 0px 0px;
}
h2{
font-family: Verdana,Arial,sans-serif;
font-size: clamp(0.7em, 1.25vw, 1.25em);
color: #006699;
padding: 5px 0px;
}
h3{
font-family: Verdana,Arial,sans-serif;
font-size: clamp(0.7em, 1.2vw, 1.2em); /* taille du texte */
color: #334d55;
clear: both;
padding: 1px 0px;
}
h4{
font-family: Verdana, sans-serif;
font-size: clamp(0.7em, 1.15vw, 1.15em);
line-height:75%;
font-weight: 599;
color: #000022;
}
h5{
font-family: Verdana,Arial,sans-serif;
font-size: clamp(0.65em, 1.1vw, 1.1em); /* taille du texte */
line-height:100%;
font-weight: 100;
color: #334d55;
}
h6{
font-family: Verdana,Arial,sans-serif;
font-size: 92%;
line-height:10%;
font-weight: 100;
color: #334d55;
}
h7{
font-family: Verdana,Arial,sans-serif;
font-size: 90%;
font-weight: 600;
color: #334d55;
}
label{
 font: bold 100% Arial,sans-serif;
 color: #334d55;
}
/*************** style hr (horizontal rule) ****************/	
hr{
margin: unset;
clear: both;
border:1px ridge darkgrey;
z-index: 1;
width: 90%;
color: #aaa;
}
hr.Bleu15{
margin: unset;
clear: both;
border:1px ridge blue;
z-index: 1;
width: 15%;
color: #aaa;
}
hr.Gris15{
margin: unset;
clear: both;
border:1px ridge grey;
z-index: 1;
width: 15%;
color: #aaa;
}
/************** Tableaux I**************/
/************** Kentel, Oulpan etc...**************/
table {
 border-collapse: separate;
 border-spacing: 1px 1px;
 width: 100%;
 border: solid grey 1px;}
table.largeur30V{width:30vw;}
table.largeur35V{width:35vw;}
table.largeur40V{width:40vw;}
table.largeur45V{width:45vw;}
table.largeur50V{width:50vw;}
table.largeur55V{width:55vw;}
table.largeur60V{width:60vw;}
table.largeur65V{width:65vw;}
table.largeur70V{width:79vw;}
table.largeur90V{width:92vw;}
tr,th {
font-size: clamp(0.615em, 1.125vw, 1.125em);
font-family: arial;
vertical-align:bottom;
color:black;}
td { 
border: 1px solid grey;
font-size: clamp(0.615em, 1.125vw, 1.125em);
text-indent: 1px;}
.verb1 { vertical-align:bottom; width: 85%; color:black;}
.verb2 { vertical-align:bottom; width: 50%; color:black;}
.verb3 { vertical-align:bottom; width: 33%; color:black;}
.verb3_75em { vertical-align:bottom; font-size: clamp(0.75em, 1.125vw, 1.125em); width: 33%; color:black;}
.verb4 { vertical-align:bottom; width: 25%; color:black;}
.verb5 { vertical-align:bottom; width: 20%; color:black;}
.verb5C { vertical-align:bottom; width: 20%; color:black; text-align: center; }
.verb6 { vertical-align:bottom; width: 16.66%; color:black;}
.verb6C { vertical-align:bottom; width: 16.66%; color:black; text-align: center;}
.verb7 { vertical-align:bottom; width: 14.30%; color:black;}
.verb8 { vertical-align:bottom; width: 12.50%; color:black;}
.verb9 { vertical-align:bottom; width: 11.10%; color:black;}
.verb2car { vertical-align:bottom; width: 5%; color:black;}
.verb3car { vertical-align:bottom; width: 7.5%; color:black;}
.choari { 
font-size: clamp(0.78em, 1.12vw, 1em);
width: 48%;
vertical-align: middle;
word-spacing: -0.5px;
}
/************** Tableaux  Maree 2023 + StQuay 2024  + maree.htm**************/
.largeur33 {width: 3.3vw; text-align: center;}
.largeur33b {width: 3.3vw; text-align: center; font-weight: 600;}
.largeur33c {width: 3.3vw;text-align: center; background-color: #e6e6a9;} 
.largeur33bc {width: 3.3vw;text-align: center; background-color: #dfcebf; font-weight: 600;}
.largeur150 {width: 15%;text-align: justify;}
.largeur150C {width: 15%;  background-color: #e6e6a9; text-align: justify;}
/************** Tableaux II Class tb  **************/
table.tb { border-collapse: separate; width:100%; border-spacing: 1px 1px;}
.tb th, .tb td {
border: 1px solid grey;
font-size: clamp(0.7em, 1.125vw, 1.125em);
font-family: arial,sans-serif;
text-align:center;
text-indent: 0.25vw;
}
.tb th { background: #3630a3; color: white; text-align:left;}
.tcell { width:32vw; background: #dde2f2;}
.tcell6 { width:6vw; background: #dde2f2;}
/************** Tableaux III  class 0 1 2 3 4 **************/
#table0 {  border-collapse: Separate;
	border-spacing: 1px 1px;
	border: solid grey 2px  ; }
#td0 { border: 1px solid silver;
    font-family: arial,sans-serif;
    font-size: 88%;
    color: #334d55;
    text-align: center;
}
#table1 {
border-collapse: collapse;
table-layout:fixed;
width:529pt;
}
#table2 {
border-collapse: collapse;
width:60vw;
}
#table3 {
border-collapse: collapse;
border: 0px solid silver;
width:47vw;
}
#table4 {
border-collapse: collapse;
border: 0px solid silver;
width:25vw;
}
#calibri  {
font-size: clamp(0.70em, 1.1vw, 1.15em);
text-align: center;
vertical-align: middle;
font-family:Calibri, sans-serif;}
#calibrileft  {
font-size: clamp(0.70em, 1.2vw, 1.15em);
text-align: left;
vertical-align: middle;
padding: 0px 0px 0px 4px;
font-family:Calibri, sans-serif;}
#calibriright {
font-size: clamp(0.70em, 1.2vw, 1.15em);
text-align: right;
vertical-align: middle;
padding: 0px 4px 0px 0px;
font-family:Calibri, sans-serif;}
.Font700 {font-weight:700;}
.BgndGris { background:#D8E4BC;}
.BgndVert { background:#B0F26E;}
/************** Texte Yves **************/
.YVTR {
color: grey;
font-size: clamp(0.68em, 1.18vw, 1em);
text-align: left;
}
.Yves {
padding: 1px 3px 1px 3px;
color: #006699;
font-size: clamp(0.7em, 1.125vw, 1.125em);
text-align: center;
vertical-align: middle;
}
.Yves1 {
padding: 1px 3px 1px 3px;
color: #000000;
font-size: clamp(0.7em, 1.125vw, 1.125em);
text-align: left;
vertical-align: middle;}
.Yves2 {
font-family: Arial, Helvetica, sans-serif;
font-size: clamp(0.7em, 1.12vw, 1em);
text-align: center;
}
.Yves3 {
font-family: Arial, Helvetica, sans-serif;
font-size: clamp(0.7em, 1.125vw, 1.125em);
text-align: center;
background-color: #FFCC99;
background-repeat: repeat;
background-position: left;
vertical-align: middle;
}
.Yves4 {
font-family: Arial, Helvetica, sans-serif;
font-size: clamp(0.7em, 1.125vw, 1.125em);
text-align: center;
background-color: #FFCC66;
background-repeat: repeat;
background-position: left;
}
.Yves5 {
font-family: Arial, Helvetica, sans-serif;
font-size: clamp(0.7em, 1.125vw, 1.125em);
text-align: center;
background-color: #FF9933;
background-repeat: repeat;
background-position: left;
}
.Yves6 {
font-family: Arial, Helvetica, sans-serif;
font-size: clamp(0.7em, 1.125vw, 1.125em);
text-align: center;
background-color: #f0f0f0;
background-repeat: repeat;
background-position: left;
}
.Yves75 {
font-family: Arial, Helvetica, sans-serif;
font-size: clamp(0.7em, 1.12vw, 1em);
text-align: center;
vertical-align: middle;
color: #006699;
padding: 0px 0px 0px 0px;
background-color: #FFFFF0;
background-repeat: repeat;
background-position: left;
}
/**************ports.php****bleu et jaune**************/
.Yves8 {
font-family: Arial, Helvetica, sans-serif;
font-size: clamp(0.7em, 1.125vw, 1.125em);
text-align: center;
width:16%;
background-color: #99FFFF;
background-repeat: repeat;
background-position: left;
vertical-align: middle;
}
.Yves9 {
font-family: Arial, Helvetica, sans-serif;
font-size: clamp(0.7em, 1.125vw, 1.125em);
text-align: center;
width:16%;
background-color: #ffffdd;
background-repeat: repeat;
background-position: left;
vertical-align: middle;
}
/********tech-elec-09/php** jaune et gris pâle************/
.YvesA {
font-family: Arial, Helvetica, sans-serif;
font-size: clamp(0.7em, 1.125vw, 1.125em);
width:33%;
background-color: #ffffdd;
background-repeat: repeat;
background-position: left;
vertical-align: middle;
}
.YvesB {
font-family: Arial, Helvetica, sans-serif;
font-size: clamp(0.7em, 1.125vw, 1.125em);
width:66%;
background-color: #f0f0f0;
background-repeat: repeat;
background-position: left;
vertical-align: middle;
}
/***********************************************/
/* Layout Divs                                 */
/***********************************************/
#portcss{
	font-size: 95%;
	padding: 5px 0px 0px 0px;
	width: 99%;
	position:relative
}
#content{
margin: unset;
width: 58%;
float: left;
padding: 1% 1% 1% 1%;
}
#encadre {
border: solid 1px;
padding:0px 1px 0px 4px;
margin-left:1vw;
margin-right:30vw;
}
#pagelivre {
width: 90%;
background:#FFFF;
text-align:justify;
font-size: 100%;
font-family:"Liberation Serif","serif";
margin:auto auto;
position:relative;
}
#pagearticle {
width: 60vw;
background:#FFFF;
font-family:"Liberation Serif","serif";
margin-left:0.25vw;
position:relative;
}
/*************** #pageName styles **************/
#pageName{ padding: 7px 0px 7px 0px;}
/************* afficher cacher styles **************/
/***********nouveau novembre 2025********************/
#d001, #d003, #d005, #d007, #d009, #d011, #d013, #d015, #d017, #d019,
#d021, #d023, #d025, #d027, #d029, #d031, #d033, #d035, #d037, #d039,
#d041, #d043, #d045, #d047, #d049, #d051, #d053, #d055, #d057, #d059
{
width: 94vw;
position:relative;
display:none;
z-index : 5;
}
/******************************/
#d1, #d3, #d5, #d7, #d9, #d11, #d13, #d15, #d17, #d19, #d21, #d23, #d25, 
#d27, #d29, #d31, #d33, #d35, #d37, #d39, #d41, #d43, #d45, #d47, #d49
{
background-color: #FFFF;
width: 48%;
font-family:"Liberation Serif","serif";
padding: 1px 3px 1px 3px;
margin:right;
box-shadow: 0 0 1px 1px #333;
position:relative;
display:none;
z-index : 5;
}
#listedemots
{
width: 79vw;
margin:auto;
position:relative;
display:block;
z-index : 5;
}
#listmots
{
width: 85vw;
position:relative;
display:block;
z-index : 5;
}
#doulpanger
{
width: 79vw;
margin:auto;
position:relative;
display:none;
z-index : 5;
}
/*******TEST RESPONT KWIZZ**NOV 2025*********/
#dr01, #dr02, #dr03, #dr04, #dr05, #dr06, #dr07, #dr08, 
#dr09, #dr10, #dr11, #dr12, #dr13, #dr14, #dr15, #dr16,
#dr17, #dr18, #dr19, #dr20, #dr21, #dr22, #dr23, #dr24,
#dr25, #dr26, #dr27, #dr28, #dr29, #dr30, #dr31, #dr32,
#dr33, #dr34, #dr35, #dr36, #dr37, #dr38, #dr39, #dr40
{
background-color: coral;
color: white;
font-family:"Arial";
padding: 2px;
position:relative;
display:none;
z-index : 5;
}
/******************/
#d0, #d02, #d2, #d4, #d6, #d8, #d10, #d12, #d14, #d16, #d18, #d20, #d22, #d24, 
#d26, #d28, #d30, #d32, #d34, #d36, #d38, #d40, #d42, #d44, #d46, #d48
{
background-color: #FFFF;
width: auto;
font-family:"Liberation Serif","serif";
padding: 1px 3px 1px 3px;
margin:right;
box-shadow: 0 0 0px 0px #333;
position:relative;
display:none;
z-index : 5;
}
#d77{
background-color: #FFFF;
width: 42vw;
font-family:"Liberation Serif","serif";
padding: 1px 3px 1px 3px;
box-shadow: 0 0 0px 0px #333;
position:relative;
display:none;
z-index : 5;
}
#dch14, #dch15, #dch16, #dch17, #dch19{
background-color: #FFFFFF;
width: auto;
font-family:"Liberation";
padding: 1px 3px 1px 3px;
margin:right;
position:relative;
display:none;
z-index : 5;
}
#dch99, #dch9A{
font-family:"Liberation Serif","serif";
width: auto;
padding: 1px 3px 1px 3px;
position:relative;
display:none;
z-index : 5;
}
#dch96{
background-color: #FFFFFF;
width: auto;
font-family:"Liberation Serif","serif";
padding: 1px 3px 1px 3px;
margin:auto;
display:none;
z-index : 5;
}
#dch98{
background-color: #FFFFFF;
width: auto;
font-family:"Liberation Serif","serif";
padding: 1px 3px 1px 3px;
margin:auto;
display:none;
z-index : 5;}
/*Right column*/
#Right-Group{
	width:19.5vw;
	float:left;
	overflow:hidden;
	padding-bottom: 1px;
	padding-top: 1px;
	top: 1px;
	position: absolute;
	z-index: 1;
	border-left-style: none;
	margin-left:810px;
	margin-right: 8px;}
.FeatureArticleRight{
	width:252px;
	border:1px solid #ccc;
	margin-bottom:30px;
	height:109px;
	overflow: visible;
	z-index: auto;}
.FeatureArticleRight h1{
    color:#fff;
    background: #3AB5B7;
    background: -moz-linear-gradient(#259092, #49CED1);
    background: -webkit-gradient(linear, 0 0, 0 bottom, from(#259092), to(#49CED1));
    background: linear-gradient(#259092, #49CED1);
    -pie-background: linear-gradient(#259092, #49CED1);}
.FeatureArticleRight h1 {
    color: #FFF;
    background: linear-gradient(#259092, #49CED1) repeat scroll 0% 0% transparent;}
.FeatureArticleRight h1{
    margin: 0;
    display: block;
    font-size: 1em;
    font-weight: bold;   
    height: 24px;
    padding: 11px 15px 0 15px;
    color: white;
    line-height: 1em;}
.FeatureArticleRight p{
    padding:20px;
    font-size:70%;
    margin: 0px;}
.FeatureArticleRight p a{
    color:#00355F;
    font-weight:bold;}
.FeatureArticleRight img{    
    margin:10px;
    margin-bottom:0px;
    width: 189px;}
/* adjust margins to change separation between the feature image and text flowing around it */
#Center-Group {
	float:left;
	width: 26.6vw;
	*overflow: hidden;/*IE7*/
	position: relative;
	z-index: auto;
	left: 12px;}
.FeatureArticleCenter{
    width:348px;  
    border:1px solid #CCCCCC;
    margin-top:4px;
    margin-bottom:0px;
    height:285px;}
.FeatureArticleCenter h1{
    color:#fff;
    background: #2E57A9;
    background: -moz-linear-gradient(#103996, #476FB8);
    background: -webkit-gradient(linear, 0 0, 0 bottom, from(#103996), to(#476FB8));
    background: linear-gradient(#103996, #476FB8);
    -pie-background: linear-gradient(#103996, #476FB8);}
.FeatureArticleCenter h1 {
    color: #FFF;
    background: linear-gradient(#103996, #476FB8) repeat scroll 0% 0% transparent;}
.FeatureArticleCenter h1{
    margin: 0;
    display: block;
    font-size: 1em;
    font-weight: bold;   
    height: 24px;
    padding: 11px 15px 0 15px;
    color: white;
    line-height: 1em;}
.FeatureArticleCenter p{
    padding:20px;
    font-size:70%;
    margin: 0px;}
.FeatureArticleCenter p a{color:#00355F; font-weight:bold;}
/*Left column*/
#Left-Column {
	float: left;
	display: inline;
	width: 414px;}
.FeatureArticleLeft {
	width:408px;
	border:1px solid #FFFFFF;
	margin-top:4px;
	margin-bottom:0px;
	height:295px;
	margin-right: 1px;}
#Left-Group {
	margin: 0 0 0 5px;
	position: relative;
	float:left;
	padding-top: 0px;
	width: 32vw;
	height: 355px;
	overflow: hidden;/*IE7*/
	margin-left: 6px;}
.FeatureArticleLeft h1{
	color:#fff;
    background: #62A1EA;
    background: -moz-linear-gradient(#62A1EA, #9BC4F2);
    background: -webkit-gradient(linear, 0 0, 0 bottom, from(#62A1EA), to(#9BC4F2));
    background: linear-gradient(#62A1EA, #9BC4F2);
    -pie-background: linear-gradient(#62A1EA, #9BC4F2);}
.FeatureArticleLeft h1{
    color: #FFF;
    background: linear-gradient(#62A1EA, #9BC4F2) repeat scroll 0% 0% transparent;}
.FeatureArticleLeft h1{ 
	margin: 0;
    display: block;
    font-size: 1em;
    font-weight: bold;   
    height: 24px;
    padding: 11px 15px 0 15px;
    color: white;
    line-height: 1em;}
ul{list-style-type: square;}
ul ul{list-style-type: disc;}
ul ul ul{list-style-type: none;}
/************** aside ***************/
aside {width: 20%;
  float: right;
  background: -moz-linear-gradient(#62A1EA, #9BC4F2);
  border-radius: 6px;
  font-style: italic;}
aside li{padding-bottom:0.65em;}
aside ul{margin:1em 0.25em 0.75em -0.75em;}
/************** aside test ***************/
#testo {
  width: 66%;
  padding-left: 0.5rem;
  margin-left: 0.5rem;
  float: right;
  background:white;
  box-shadow: inset 5px 0 25px -5px #29627e;
  font-style: italic;
  color: #29627e;}
/************** fin aside test ***************/
aside.fotoleft{
  width: 40%;
  float: left;
  background:none;
  border-radius: 2px;
  font-style: normal;}
#fotoright{
  width: 30%;
  float: right;
  background:none;
  border-radius: 2px;
  font-style: normal;}
#expo{
  width: 25%;
  color: white;
  background: -moz-linear-gradient(#247853, #EAD2A5);}
#texto{
  width: 21.5%;
  background: -moz-linear-gradient(#729DEE, #A5E7EE82);}
#promo{
width: 10%;
  background: -moz-linear-gradient(#F2CC59, #fbce2052);}
#foto{
  width: 35%;
  float: right;
  background:none;
  border-radius: 10px;
  font-style: normal;}
#logo{
  width: 15%;
  float: right;
  background:none;}
/************* footer & #siteInfo styles ***************/
footer {
font-family:"Futura";
justify-content: center;
font-size: clamp(0.5em, 1.12vw, 1em);
max-width: 100%;
margin-left: auto;
margin-right: auto;
width: 100%;
background-color: #032859;
color: #fff;}
a.footer:hover{
text-decoration:none;
color:#ffffff;}
a.footer:visited{
text-decoration:none;
color:#ffffff;}
a.footer:link{
text-decoration:none;
color:#ffffff;}
hr.footer	{
width:20%;
margin:1em auto;
border:1px ridge white;}
p.footer	{
font-family:"Futura";
display: flex;
justify-content: center;
font-size: clamp(0.7em, 1.12vw, 1em);
padding:0;
margin:0 auto;
color: #fff;}	
ul.footer	{
text-decoration:none;
color:#ffffff;}
li.footer	{
text-decoration:none;
list-style-type:none;
color:#ffffff;}
.footer_inside {
width:96%;
margin:1em auto;
display: flex;
justify-content: space-around;
align-items: center;}
.footer_img {
width:10%;
margin:0 auto;
display: flex;
justify-content: space-around;
align-items: center;}
.footer_copy {
width:29%;
margin:0 auto;
display: flex;
justify-content: space-around;
align-items: center;}
.footer_count {
width:30%;
font-size: clamp(0.6em, 0.8vw, 0.8em);
margin:0 auto;
display: flex;
justify-content: space-around;
align-items: center;}
.footer_legal {
width:40%;
margin:0 auto;
display: flex;
justify-content: space-around;
align-items: center;}
.footer_email {
width:29%;
margin:0 auto;
display: flex;
justify-content: space-around;
align-items: center;}
.footer_pays {
width:23%;
margin:0 auto;
display: flex;
justify-content: space-around;
align-items: center;}
.footer_fich {
width:17%;
margin:0 auto;
display: flex;
justify-content: space-around;
align-items: center;}
input[type="email"]{
font-size: clamp(0.7em, 1vw, 1em);
width:100%;
height:1.5vw;
text-align:center;
border:none;}
input[type="submit"]{
font-size: clamp(0.7em, 1vw, 1em);
width:100%;
height:1.5vw;
background-color:#518ccc;
text-align:center;
border:none;
color:#ffffff;
font-weight:700;
cursor:pointer;
margin-top:0.5em;}
input:focus{
outline:none;}
#siteInfo{
	position:relative;
	border: 1px solid #cccccc;
	font-size: 75%;
	color: #0b4055;
	padding: 0px 0px 0px 0px;
	width: 33%;}
#siteInfo2{
	clear: both;
	border: 0px solid #cccccc;
	font-size: 75%;
	color: #cccccc;
	padding: 6px 0px 6px 0px;
	width: 90%;}
#siteInfo_img{
	padding: 1px 0px 1px 0px;
	vertical-align: middle;}
#siteInfo2_img{
display: flex;
justify-content: center;
align-items: center;}
#siteInfo3_img{
display: flex;
justify-content: left;
align-items: left;}
/************** image **************/
img {
  border-radius: 4px;
  max-width:100%;
  max-height:100%;}
/************** Bouton **************/
.btn {
border-color: rgba(0,0,0,0.15) rgba(0,0,0,0.15) rgba(0,0,0,0.25);
border-top-color: rgba(0,0,0,0.15);
border-right-color:#000;
border-bottom-color: rgba(0,0,0,0.25);
border-left-color:#000;
display: inline;
padding-top: 1px;
padding-right: 4px;
padding-bottom: 1px;
padding-left: 4px;
font-size: clamp(0.7em, 1.12vw, 1em);
color: #333;
text-align: center;
text-shadow: 0px 1px 1px rgba(255,255,255,0.75);
vertical-align: middle;
cursor: pointer;
background-color: #7996C3;
background-image: linear-gradient(to bottom,#FFF,#5F84B9);
background-repeat: repeat-x;
border-width: 1px;
border-top: 1px;
border-right: 1px;
border-bottom: 1px;
border-left: 1px;
border-style: solid;
border-image: none;
border-radius: 4px;
box-shadow: 0px 1px 0px rgba (255,255,255,0.2) inset 0px 1px 2px rgba (0,0,0,0.05);}
/******Texte Yves****Style bouton*****/
.Style2 {font-family: Arial;font-size: 10px;color:#3333FF;}
.Style3 {font-family: Arial;font-size: 10px;color: #333366;}
.Style4 {font-size: x-small;color: #FFFFFF;}
.Style5 {font-size: smaller;}
 /* BUTTON */
.styled1{
    margin : 1px 1px 1px 13px;
    border: 0;
    line-height: 1.5;
    padding: 0 20px;
    font-size: clamp(0.65em, 1.10vw, 1.115em);
    text-align: center;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    border-radius: 5px;
    background-color: rgba(220, 0, 0, 1);
    background-image: linear-gradient(to top left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 30%, rgba(0, 0, 0, 0));
    box-shadow: inset 2px 2px 3px rgba(255, 255, 255, 0.6), inset -2px -2px 3px rgba(0, 0, 0, 0.6);}
.styled1:hover {background-color: rgba(0, 0, 0, 1);}
.styled1:active {box-shadow: inset -2px -2px 3px rgba(255, 255, 255, 0.6), inset 2px 2px 3px rgba(0, 0, 0, 0.6);}
.styled2{
    margin : 1px 1px 1px 13px;
    border: 0;
    line-height: 1.5;
    padding: 0 20px;
    font-size: clamp(0.65em, 1.10vw, 1.115em);
    text-align: center;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    border-radius: 5px;
    background-color: rgba(220, 0, 0, 1);
    background-image: linear-gradient(to top left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 30%, rgba(0, 0, 0, 0));
    box-shadow: inset 2px 2px 3px rgba(255, 255, 255, 0.6), inset -2px -2px 3px rgba(0, 0, 0, 0.6);}
.styled2:active {box-shadow: inset -2px -2px 3px rgba(255, 255, 255, 0.6), inset 2px 2px 3px rgba(0, 0, 0, 0.6);}
.styled2:hover {background-color: rgba(0, 0, 0, 1);}
.styled3{
    font-size: clamp(0.6em, 1.15vw, 1.125em);
    text-align: center;
	padding: 0px 10px 2px 10px;
	border: 0;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    border-radius: 3px;
    background-color: rgba(220, 0, 0, 1);
    background-image: linear-gradient(to top left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 30%, rgba(0, 0, 0, 0));
    box-shadow: inset 2px 2px 3px rgba(255, 255, 255, 0.6), inset -2px -2px 3px rgba(0, 0, 0, 0.6);}
.styled3:active {
    box-shadow: inset 0px 0px 0px rgba(255, 255, 255, 0.6), inset 0px 0px 0px rgba(0, 0, 0, 0.6);}
.styled3:hover {
    background-color: rgba(0, 0, 0, 1);}
.styled4{
    margin : 0px 0px 0px 10px;
    font-size: clamp(0.6em, 1.15vw, 1.125em);
    text-align: center;
	padding: 0px 10px 2px 10px;
	border: 0;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    border-radius: 3px;
    background-color: green;
    background-image: linear-gradient(to top left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 30%, rgba(0, 0, 0, 0));
    box-shadow: inset 2px 2px 3px rgba(255, 255, 255, 0.6), inset -2px -2px 3px rgba(0, 0, 0, 0.6);
	cursor: pointer;}
.styled4:active {
    box-shadow: inset 0px 0px 0px rgba(255, 255, 255, 0.6), inset 0px 0px 0px rgba(0, 0, 0, 0.6);}
.styled4:hover {
    background-color: coral;}
.styled5{
    font-size: clamp(0.6em, 1.15vw, 1.125em);
    text-align: center;
	padding: 0px 10px 2px 10px;
	border: 0;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    border-radius: 3px;
    background-color: coral;
    background-image: linear-gradient(to top left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 30%, rgba(0, 0, 0, 0));
    box-shadow: inset 2px 2px 3px rgba(255, 255, 255, 0.6), inset -2px -2px 3px rgba(0, 0, 0, 0.6);
	cursor: pointer;}
.styled5:active {
    box-shadow: inset 0px 0px 0px rgba(255, 255, 255, 0.6), inset 0px 0px 0px rgba(0, 0, 0, 0.6);}
.styled5:hover {
    background-color: coral;}
	
/* Retour Haut de page */
#pajes{
	margin-left:auto;
	background-color: gray;
	font-size: clamp(0.5em, 1vw, 1.125em);
	text-align: center;
	text-decoration:none;
	cursor:pointer;
	color:white;
	border-radius:50%;}
/* ESSAIS social-bar 04 10 2026 */
/* Conteneur du bandeau */

#social-reso {
    display: flex;
    justify-content: center;
}
.social-bar {
    background-color: #fff;
    padding: 10px 10px;
    border-radius: 50px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	height: 4.5vh;
}
.social-bar ul {
    list-style: none;
	padding-inline-start: 1px;
	margin-block-start: -3px;
    margin-block-end: 1px;
    display: flex;
    gap: 15px;
}
.social-bar li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: clamp(25px, 2vw, 32px);
    height: clamp(25px, 2vw, 32px);
    text-decoration: none;
    border-radius: 50%;
    color: #fff;
    font-size: clamp(1.3em, 1.5vw, 1.5em);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
/* Effet de survol global */
.social-bar li a:hover {transform: translateY(-3px); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);}
/* Couleurs par réseau */
/* Facebook : Bleu officiel */
.social-bar li:nth-child(1) a {background-color: #3b5998;}
/* X (Twitter) : Noir */
.social-bar li:nth-child(2) a {background-color: #000000;}
/* Instagram : Dégradé officiel */
.social-bar li:nth-child(3) a {background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);}
/* LinkedIn : Bleu officiel */
.social-bar li:nth-child(4) a {background-color: #0A66C2;}
/* YouTube : Rouge officiel */
.social-bar li:nth-child(5) a {background-color: #FF0000;}