::-webkit-scrollbar {
height : 4px;
width : 8px;
}
::-webkit-scrollbar-track {
background : #f1f1f1;
}
::-webkit-scrollbar-thumb {
background : #888;
}
::-webkit-scrollbar-button {
background : white;
width : 20px;
height : 20px;
}
::-webkit-scrollbar-thumb:hover {
background : #555;
}
::-webkit-scrollbar:hover {
height : 20px;
width : 20px;
}
::-webkit-scrollbar-track:hover {
background : #f1f1f1;
}
:root {
--cassiopeia-color-primary : hsl(220 67% 20%);
--cassiopeia-color-link : hsl(220 67% 40%);
--cassiopeia-color-hover : hsl(242 30% 36%);
--cassiopeia-color-back : hsl(220 22% 90%);
}
@media (max-width: 1000px) {
html {
font-size : 95%;
}
}
@media (min-width: 1001px) {
html {
font-size : 115%;
}
}
@media (max-width: 600px) {
html {
font-size : 80%;
}
}
div.CR2 {
width : 100% !important ;
font-family : arial;
font-size : 0.7rem !important ;
text-align : center;
margin : 0 !important ;
padding : 0 !important ;
overflow-x : scroll;
}
.tableAct {
padding : 0;
margin : 0;
font-style : normal !important ;
font-size : 0.7rem !important ;
color : red !important ;
font-weight : normal !important ;
}
#flex-container, #msg {
margin-top : 1.5rem;
font-family : verdana;
font-size : 1rem;
width : 99%;
display : flex;
flex-direction : row;
flex-wrap : wrap;
}
#flex-container > .flex-item {
margin : 0.2rem;
padding : 0.2rem;
border-radius : 1rem;
text-align : center;
font-weight : bolder;
flex-basis : 13rem;
flex-grow : 4;
flex-shrink : 0;
border : blue solid 1px;
cursor : pointer;
}
#flex-container > .flex-item:nth-child(6n) {
background-color : #E4B04A;
color : white;
}
#flex-container > .flex-item:nth-child(6n+1) {
background-color : #B7521E;
color : white;
}
#flex-container > .flex-item:nth-child(6n+2) {
background-color : #643B0F;
color : white;
}
#flex-container > .flex-item:nth-child(6n+3) {
background-color : #206BA4;
color : white;
}
#flex-container > .flex-item:nth-child(6n+4) {
background-color : #E3493B;
color : white;
}
#flex-container > .flex-item:nth-child(6n+5) {
background-color : #8B008B;
color : white;
}
.Astuce {
margin : 0.15rem;
padding : 0.25rem;
border-radius : 1rem;
text-align : left;
font-weight : inherit;
vertical-align : middle;
text-align:justify;
flex-grow : 0.5;
flex-shrink : 0;
border : blue solid 1px;
font-family:arial;
color:navy;
font-size:0.65rem;
flex-basis:98%!important
}
.AstuceImg {
	width:2.3rem;
	vertical-align:middle;
}
.AstuceTxt {
text-align:justify;
font-family:arial;
color:navy;
font-size:0.76rem;
}
.Msg_Inscr {
margin : 0.1rem;
margin-top : 0.5rem;
padding : 0.2rem;
border-radius : 1rem;
text-align : center;
flex-basis : 7rem;
flex-grow : 2;
flex-shrink : 0;
border : blue solid 1px;
color : white;
background-color : navy;
font-weight : normal;
font-size : 0.8rem;
}
.Msg_Récent {
width:4.1rem;
margin : 0.5rem;
margin-top : 0.25rem;
margin-left : auto;
margin-right : auto;
padding : 0.1rem;
text-align : center;
border : red double 6px;
color : red;
background-color : white;
font-family : Times, "Times New Roman", Georgia, serif;
font-weight : normal;
font-size : 0.8rem;
rotate :-15deg;
}

.Msg {
margin : 0.2rem;
padding : 0.2rem;
border-radius : 1rem;
text-align : center;
font-weight : bolder;
flex-basis : 15rem;
flex-grow : 4;
flex-shrink : 0;
border : blue solid 1px;
color : white;
background-color : navy;
}
.Filtre {
margin : 0.1rem;
padding : 0.1rem;
border-radius : 1.5rem;
text-align : center;
border : blue solid 1px;
color : white;
background-color : navy;
font-weight : normal;
font-size : 0.75rem;
font-family : Arial;
background-image : linear-gradient(0deg, var(--cassiopeia-color-primary) 0%, white 2rem);
}
.filtre > input {width:0.75rem; height:0.75rem; margin:0.25rem;margin-right:0;padding:0.1rem;}
#flex-container > .raw-item {
width : 3rem;
margin : 0.2rem;
padding : 0.2rem;
border-radius : 1rem;
text-align : center;
font-weight : bolder;
background-color : #424340;
color : white;
cursor : pointer;
}
#flex-container > .raw-item2 {
width : 6rem;
margin : 0.2rem;
padding : 0.2rem;
border-radius : 1rem;
text-align : center;
font-weight : normal;
background-color : red;
color : white;
cursor : pointer;
}
.Puces {
margin : 0.2rem;
text-align : center;
}
.puce {
height : 1.8rem;
width : 2.1rem;
max-width : 2.1rem;
border-radius : 1.5rem;
font-size : 1.5rem;
font-family : arial;
margin : 0.1rem;
display : inline-block;
padding-top : 0.1rem;
}
.Act {
display : flex;
flex-direction : row;
flex-wrap : wrap;
}
.UneAct {
margin : 0.5rem;
padding : 0.25rem;
border-radius : 1rem;
text-align : center;
font-weight : bolder;
flex-basis : 7rem;
flex-grow : 0.5;
flex-shrink : 0;
border : blue solid 1px;
cursor : pointer;
color : white;
font-family : arial;
background-image : linear-gradient(180deg, navy 0%, white 3rem);
}
.ActLarge {
flex-basis : 75% !important ;
}
.TrèsLarge {
flex-basis : 95% !important ;
}
.Récurr {
background-image : linear-gradient(180deg, darkgreen 0%, white 3rem) !important ;
border-color : darkgreen !important ;
}
.Séjour {
background-image : linear-gradient(180deg, black 0%, white 3rem) !important ;
border-color : black !important ;
}
.Récent {

}
.Caract {
font-weight : normal;
font-size : 0.75rem;
}
.ActDetail {
margin : 0.5rem;
padding : 0.25rem;
border-radius : 1rem;
text-align : center;
font-weight : bolder;
flex-basis : 55%;
flex-grow : 3;
flex-shrink : 0;
border : blue solid 1px;
color : white;
font-family : arial;
background-image : linear-gradient(180deg, navy 0%, white 3rem);
}
.infosActivité {
color : navy;
font-weight : normal;
}
.Participants {
font-size : 0.8rem;
font-style : italic;
}
.moment {
margin : 0;
padding : 0;
font-weight : normal;
font-size : 0.9rem;
color : navy;
}
.Libellé {
margin-top : 0.5rem;
color : navy;
}
.color1 {
background-color : #B7521E;
color : white;
}
.color2 {
background-color : #643B0F;
color : white;
}
.color3 {
background-color : #206BA4;
color : white;
}
.color4 {
background-color : #E3493B;
color : white;
}
.color5 {
background-color : #8B008B;
color : white;
}
.color6 {
background-color : #E4B04A;
color : white;
}
.BtnInscrip_Inscr {
width : 6rem;
height : 2rem;
border-radius : 0.5rem;
background-color : navy;
border : blue solid 1px;
color : white;
margin : 0.2rem;
margin-left : 1rem;
margin-right : 1rem;
padding : 0.1rem;
cursor : pointer;
}
.Haut {
	height : 3rem!important;
}
.BtnInscrip {
width : 18rem;
height : 3rem;
border-radius : 0.5rem;
background-color : navy;
border : blue solid 1px;
color : white;
margin : 0.2rem;
margin-left : 1rem;
margin-right : 1rem;
padding : 0.1rem;
cursor : pointer;
}
.BtnInscDes_Inscr {
width : 6rem;
height : 2rem;
border-radius : 0.5rem;
background-color : white;
border-top : 5px solid navy;
border-bottom : 5px solid navy;
border-left : 2px solid navy;
border-right : 2px solid navy;
color : navy;
margin : 0.2rem;
margin-left : 1rem;
margin-right : 1rem;
padding : 0.1rem 0 0.1rem 0;
cursor : pointer;
}
.BtnInscDes {
width : 18rem;
height : 3rem;
border-radius : 0.5rem;
background-color : white;
border : navy solid 5px;
color : navy;
margin : 0.2rem;
margin-left : 1rem;
margin-right : 1rem;
padding : 0.1rem;
cursor : pointer;
}
.BtnAbandon {
width : 5rem;
height : 1.5rem;
border-radius : 0.5rem;
margin : 1rem;
margin-top : 0.2rem;
margin-bottom : 0;
margin-right : 0.5rem;
background-color : red;
border-radius : 0.5rem;
font-weight : bold;
color : white;
cursor : pointer;
}
.BtnConfirm {
width : 5rem;
height : 1.5rem;
margin : 1rem;
margin-top : 0.2rem;
margin-bottom : 0;
margin-left : 0.5rem;
background-color : green;
border-radius : 0.5rem;
font-weight : bold;
color : white;
cursor : pointer;
}
.Boutons {
background-color : white;
}
.Confirmation {
background-color : navy;
color : white;
font-size : 0.9rem;
}
.liens {
margin-top : 0.25rem;
font-family : verdana;
font-size : 1rem;
width : 99%;
display : flex;
flex-direction : row;
flex-wrap : wrap;
border : white solid 1px;
}
.UnLien {
margin : 0.2rem;
padding : 0.2rem;
padding-right : 0.25rem;
padding-left : 0.25rem;
border-radius : 0.6rem;
text-align : center;
font-weight : bolder;
flex-basis : 7rem;
flex-grow : 4;
flex-shrink : 0;
min-height : 10rem;
border : blue solid 1px;
cursor : pointer;
display:table;
}
.UnLien span {
vertical-align:middle;
display:table-cell;
}
.petit {
padding : 0.2rem !important ;
font-weight : bold !important ;
font-size : 0.8rem !important ;
min-height: 2.2rem!important;
max-height: 2.2rem!important;
}
.UnLien:nth-child(6n) {
background-color : #E4B04A;
color : white;
}
.UnLien:nth-child(6n+1) {
background-color : #B7521E;
color : white;
}
.UnLien:nth-child(6n+2) {
background-color : #643B0F;
color : white;
}
.UnLien:nth-child(6n+3) {
background-color : #206BA4;
color : white;
}
.UnLien:nth-child(6n+4) {
background-color : #E3493B;
color : white;
}
.UnLien:nth-child(6n+5) {
background-color : #8B008B;
color : white;
}
.im {
width : 1.5rem;
float : right;
margin-top : -0.4rem;
}
.PhotoAnimateur {
height : 4rem;
border : navy solid 1px;
vertical-align : super;
float : left;
}
.RandoScore {
height : 4rem;
border : navy solid 1px;
vertical-align : super;
float : right;
visibility : block;
cursor:hand;
}
.Certif, .Rdv {
font-size : 0.8rem;
font-style : italic;
font-weight : bold;
margin-bottom : -1rem;
margin-top : 0;
}
.Titre {
margin : 0.1rem;
margin-top : 0.2rem;
padding : 1rem;
border-radius : 1rem;
text-align : center;
font-weight : bolder;
border : blue solid 1px;
color : white;
background-color : navy;
font-weight : normal;
font-size : 1.5rem;
font-family : Arial;
background-image : linear-gradient(180deg, var(--cassiopeia-color-primary) 0%, white 5rem);
background-image : linear-gradient(180deg, var(--cassiopeia-color-primary) 0%, white 5rem);
}
div#InformationTrt {
margin-top : 1rem;
color : white;
border : black solid 1px;
background-color : green;
font-size : 1rem;
font-family : arial;
font-weight : bolder;
padding : 0.3rem 2rem 0.3rem 2rem;
}
.InfoErreur {
background-color : red !important ;
}
.titreCaption {
text-align : center;
}
.InfoStd {
background-color : white !important ;
color : navy !important ;
border : 0 !important ;
}
.Large {
flex-basis : 17rem;
}
.LA {
	padding:0.3rem;
	cursor : pointer;
}
.LA:hover {
	color:white;
	background-color:navy;
}
/*.MainMenu {
width : 75%;
display : flex;
flex-direction : column;
flex-wrap : wrap;
}*/
.Menu {
font-size : 1rem;
font-weight : bolder;
background-color : crimson;
color : white;
cursor : pointer;
border-radius : 0.5rem;
margin : auto;
margin-top : 0.75rem;
margin-bottom : 0.75rem;
width : 80%;
text-align : center;
border : none;
}
.Centré {
text-align : center!important;
}
.AGauche {
text-align : left;
}
.ModTel {
flex-direction : row;
width : 98%;
}
.NumTel {
color : navy;
cursor : pointer;
font-size : 1.0rem;
width : 8rem;
}
/*.LabTel {
width : 8rem;
text-align : right;
color : navy;
cursor : pointer;
font-size : 0.75rem;
margin-right : 0.02rem;
}
label.LabNom {
display : inline;
width : 10rem!important;
text-align : right!important;
color : red;
cursor : pointer;
font-size : 0.75rem;
font-weight : normal;
margin : 0;
padding : 0;
margin-right : 0.02rem;
margin-left:1.5rem;
}*/
.LabNom2 {
width : 12rem;
text-align : left;
color : navy;
cursor : pointer;
font-size : 0.7rem;
font-weight : normal;
margin : 0;
padding : 0;
margin-right : 0.02rem;
}
.colNom {
width : 13rem;
margin : 0;
padding : 0;
color : navy;
}
.colMail {
width : 6rem !important ;
}
.labRadio {
display : inline-block;
width : 3rem;
text-align : right;
color : navy;
cursor : pointer;
font-size : 0.75rem;
font-weight : normal!important;
}
input[type="file"]#CertifM, #Photo {
display : none;
}
input[type="radio"] {
width : 1.5rem;
}
input[type="checkbox"] {
width : 2rem;
margin : 0;
padding : 0;
text-align : left;
}
.CB {
width : 0.75rem !important ;
margin : 0;
padding : 0;
text-align : left;
}
select {
width : 10rem;
margin : 0.2rem;
}
.hidden {
display : none !important ;
}
.attendre {
text-align : center;
font-family : arial;
color : navy;
font-weight : bolder;
}
.BtGo {
width : 2rem;
height : 1.5rem;
vertical-align : top;
}
.BtAction {
width : 3.5rem !important ;
height : 1.5rem;
font-size : 0.5rem;
}
.Fonctions {
font-family : arial;
color : navy;
font-size : 0.8rem;
border : 0 !important ;
text-align : center;
}
input[type="button"] {
width : 40rem;
cursor : pointer;
}
input {
width : 14rem;
background-color : white;
border : lightgrey solid 1px;
font-size : 0.8rem;
margin : 0.2rem;
}
.moyenne{
width : 9rem !important ;
}
.courte {
width : 6rem !important ;
}
textarea {
vertical-align : top;
width : 25rem;
height : 100px;
}
button.big {
border : black solid 1px;
width : 10rem;
height : 2.2rem;
cursor : pointer;
text-align : center;
margin : 0.2rem;
background-color : goldenrod;
color : black;
font-family : verdana;
font-size : 0.8rem;
font-weight : normal;
}
button:disabled {
background-color : lightgrey;
color : grey;
cursor : not-allowed;
}
img.attente {
vertical-align : middle;
width : 6rem;
height : 5rem;
margin : 0;
margin-top : -1.5rem;
padding : 0;
}
img.attente2 {
margin-top : 3rem !important ;
}
img.Score {
	width:5rem;
}
.bodyNews {
color : navy;
background-color : white;
font-family : Arial;
font-size : 1.1rem;
margin : 0;
padding : 1rem 0 0 0;
width : 100%;
max-width : 1020px;
border : unset;
}
.LettresConteneur {
margin : auto;
margin-top : 0.5rem;
font-family : verdana;
font-size : 1rem;
width : 80%;
max-width : 500px;
display : flex;
flex-direction : row;
flex-wrap : wrap;
}
.Lettre {
margin : 0.2rem;
padding : 0.2rem;
padding-top : 1.5rem;
border-radius : 0;
text-align : center;
font-weight : bolder;
height : 2.0rem;
flex-basis : 2rem;
flex-grow : 4;
flex-shrink : 0;
border : navy solid 1px;
cursor : pointer;
}
.Lettre2 {
margin : 0.2rem;
padding : 0.2rem;
padding-top : 0.5rem;
padding-bottom : 0.5rem;
border-radius : 0;
text-align : center;
font-weight : bolder;
height : 2.7rem;
flex-basis : 2rem;
flex-grow : 4;
flex-shrink : 0;
border : navy solid 1px;
cursor : pointer;
}
label.fichier {
display : inline-block;
width : 15rem;
text-align : center;
vertical-align : middle;
font-family : Arial;
color : navy;
font-size : 0.8rem;
cursor : pointer;
border : darkgrey solid 1px;
background-color : lightgrey;
padding : 0.6rem;
}
.NomPhoto {
font-family : Verdana !important ;
color : white !important ;
font-weight : bold;
padding-top : 0.25rem;
padding-right : 1.5rem;
}
.Cases {
max-width : 99%;
display : flex;
flex-direction : row;
flex-wrap : wrap;
vertical-align : baseline;
}
.Case {
flex-basis : 10rem;
/*border : solid 1px blue;*/
text-align : center;
vertical-align : baseline;
height : 7rem;
max-height : 100%;
margin : 3px;
padding : auto;
padding-bottom:0;
}
img.Trombi {
max-height : 6rem;
max-width : 5rem;
/*vertical-align : baseline;
width : auto;
height : auto;*/
margin : auto;
margin-bottom:0;
object-fit:contain:
padding : 0;
border : lightgrey solid 1px;
}
img.TrombiB {
height : 8rem;
margin : 0;
padding : 0;
border : lightgrey solid 1px;
vertical-align : middle;
}
.NomAdhPhoto {
display : inline-block;
height : 0.8rem;
max-height : 0.8rem;
font-size : 0.65rem !important ;
}
.Photo {
width : 15rem;
height : 18rem;
text-align : center;
position : absolute;
top : 5rem;
left : 5em;
background-color : lightgrey;
opacity : 0.98;
border-width : 1px;
border-color : black;
border-style : solid;
box-shadow : 4px 4px 4px darkgrey;
font-family : verdana;
font-size : 1.2rem;
vertical-align : middle;
}
.GrandePhoto {
max-width : 95%;
max-height : 82%;
height : auto;
width : auto;
margin : 0.2rem;
cursor : help;
}
.Caption {
width : 100%;
height : 2.5rem;
text-align : center;
font-size : 1rem;
position : relative;
top : 0;
left : 0;
background-color : darkgrey;
opacity : 0.90;
padding : 0;
}
img.QRCode {
height : 10rem;
margin : 0;
padding : 0;
border : lightgrey solid 0;
vertical-align : middle;
cursor : pointer;
}
img.Switch {
height : 1.25rem;
width : 2.5rem;
}
label.lab {
display : inline-block;
width : 5rem;
text-align : right;
vertical-align : middle;
font-family : Arial;
font-size : 0.8rem;
cursor : pointer;
}
label.lab2 {
display : inline-block;
width : 6rem;
text-align : right;
vertical-align : middle;
font-family : Arial;
font-size : 0.8rem;
cursor : pointer;
margin-right : 0.1rem;
color : navy!important;
font-weight : normal!important;
}
label.lab3 {
display : inline-block;
width : 10rem;
text-align : right;
vertical-align : middle;
font-family : Arial;
font-size : 0.8rem;
cursor : pointer;
margin-right : 0.1rem;
color : navy;
}
label.long {
width : 25rem !important ;
}
div#Patience {
position : absolute;
top : 75px;
left : 10px;
height : 250px;
width : 700px;
background-color : #eff7e1;
opacity : 0.80;
color : red;
font-family : arial;
text-align : center;
}
span.Info {
color : black;
text-align : center;
font-size : 1rem;
}
table, td {
border-width : 0;
border-style : solid;
border-collapse : collapse;
margin:auto;
}
table.Tableau, th.tableau, td.tableau {
border-width : 1px;
border-style : solid;
border-collapse : collapse;
margin:auto;
text-align:center;
}
th.tableau {
	font-size:0.7rem;
	width:4rem;
	max-width:5rem!important;
text-align:center;
}

.MM {
width : 1.6rem !important ;
}
input.CP {
width : 3rem !important ;
}
label.localité {
width : 3.5rem !important ;
}
label.moyen {
width : 25rem !important ;
text-align : left !important ;
cursor: pointer;
}
.options {
font-family : Arial;
font-size : 0.8rem;
color : navy;
}
.informations {
font-family : Arial;
font-size : 0.8rem;
color : navy;
text-align : left;
font-weight : normal;
}
.marge {
margin-left : 2.5rem;
}
.Cap1Car {
text-transform : capitalize;
}
.lien {
text-decoration : underline;
color : red;
cursor : pointer;
}
div.Fond {
background : grey;
opacity : 0.85;
width : 90%;
height : 95%;
position : fixed;
top : 20px;
left : 0.2rem;
z-index : 9990;
}
div.Messages {
border : black solid 1px;
background-color : lightgrey;
color : black;
text-align : justify;
opacity : 1;
width : 75%;
height : 200px;
padding : 2rem;
position : fixed;
top : 25px;
left : 2%;
z-index : 9995;
}
.Activité {
width : 30%;
}
.Payer {
border-collapse : collapse;
border : navy solid 1px;
font-size : 0.8rem;
color : navy !important ;
text-align : right;
}
.Noms {
border : navy solid 1px;
width : 10%;
}
.montant {
border-left : 1px solid navy;
width : 7%;
text-align : right;
}
.Somme {
border : 1px solid navy;
width : 2rem;
text-align : right;
}
.coche {
border-right : 1px solid navy;
width : 4%;
}
.st {
border : navy solid 1px;
text-align : right !important ;
padding-right : 2rem !important ;
}
.total {
border : navy solid 1px;
}
.TabPay {
width : 100% !important ;
font-size : 0.7rem !important ;
text-align : left;
margin : 0 !important ;
padding : 0 !important ;
overflow-x : scroll;
}
.C40ans {width:100%;height:auto!important;max-height:6.5rem!important;vertical-align:middle;text-align:center;font-family:arial;color:navy;display:flex;margin-top:1.6rem;padding-top:0.3rem;}
.img40ans {height:5rem; margin:0.25rem;; width:auto;vertical-align:middle;}
.shadowbox {
	display:inline-block;
  flex-basis:25rem;
  flex-grow:3;
  border: 1px solid #333;
  box-shadow: 8px 8px 5px goldenrod;
  padding: 0.3rem 1rem;
  background-image: linear-gradient(180deg, white, lightgoldenrodyellow 80%, gold );
}
.FCvide {
	display:inline-block;
padding : 1rem;
border-radius : 1rem;
text-align : center;
font-weight : bolder;
  flex-basis:90%;
  margin: auto;
  margin-left:0.25rem;
  flex-grow:3;
  border: 1px solid red;
font-family : arial;
  font-weight : bold;
  font-size:1.5rem;
	background-color: red;
	color:white;
}