body {
    background-image: linear-gradient(#333333, #9b9b9b);
	background-size: 100% 100%;
	font-family: "Helvetica", sans-serif;
/*	font: ;*/
/* font-size: clamp(1rem, 3.4783vw + 0.3043rem, 3rem); */
/* line-height: 1.25em;*/
}

div {
	border-radius: 5px;
}

li {
	margin: 5px;
}
h1 {
	margin:10px 10px 10px 10px;
	text-align: center;
	color: rgb(4, 0, 53);
	font-size: 25pt;
	font: bold;
}
h2 {
	margin:10px 10px 10px 10px;
	text-align: left;
	color: rgb(4, 0, 53);
	font-size: 17pt;
	font: bold;
}

h3 {
	margin:10px 10px 10px 10px;
	text-align: center;
	color: rgb(95, 95, 95);
	font-size: 12pt;
	font: bold;
}

#divmain {
	background-image:url('background.png');
    background-size: cover;
	width:80%;
    margin:10px auto auto auto;
	padding-top: 5px;
	border-radius: 7px;
}


#divhead {
	display: flex;
    background-color:rgba(234, 186, 50, 0.5);
	/* background-color:rgba(219, 219, 219, 0.5); */
    background-size: cover;
	width:100% - 20px;
	height:auto;
	min-height: 100px;

	margin:10px 10px 10px 10px;
}

#divlogo {
	background-image:url('logo_melimelo.png');
	background-size: cover;
    float: left;
	width:100px;
	height:100px;
	left:10px;
}
#divcontact {
    float: left;
	width:250px;
	height: auto;
	right: 10px;
}
#divinter {
    float: left;
/*	width:100px;*/
	height: auto;
	left: 120px;
}



#divmenu {
    background-color:rgba(212, 104, 162, 0.5);
	/* background-color:rgba(219, 219, 219, 0.5); */
    background-size: cover;
	width:100% - 20px;
	height:auto;
	margin:10px 10px 10px 10px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
}

#divreunion {
    background-color:rgba(0, 247, 255, 0.5);
	/* background-color:rgba(219, 219, 219, 0.5); */
    background-size: cover;
	width:100% - 20px;
	height:auto;
	margin:10px 10px 10px 10px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
	
	text-align: left;
}

#divcorp {
    /* background-color:rgba(79, 93, 164, 0.5); */
	background-color:rgba(219, 219, 219, 0.7);
    background-size: cover;
	width:100% - 20px;
    min-height: 200px;
	margin:10px 10px 10px 10px;
}

#divpied {
	background-image:url('pied.png');
	background-color:rgba(202, 211, 92, 0.5);
    /* background-color:rgba(219, 219, 219, 0.5); */
	background-size: cover;
	width:100% - 20px;
	height:150px;
	margin:10px 10px 10px 10px;
}



.a1, .a4:hover, .adoc1, .adoc4:hover{
	background-image:url('lien-t1.png');
	border-radius: 10px;
	background-size: 100% 25px; 
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 2px;
	padding-bottom: 3px;
	margin: 5px;
	line-height: 24px;
	font-style:normal;
	text-decoration: none;
	color: black;
	font-size: 13pt;
	transition-duration: 250ms;
}
.a1:hover, .a2, .adoc1:hover, .adoc2{
	background-image:url('lien-t2.png');
	border-radius: 10px;
	background-size: 100% 25px; 
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 2px;
	padding-bottom: 3px;
	margin: 5px;
	line-height: 24px;
	font-style:normal;
	text-decoration: none;
	color: rgb(0, 0, 0);
	font-size: 13pt;
	transition-duration: 250ms;
}
.a2:hover, .a3, .adoc2:hover, .adoc3 {
	background-image:url('lien-t3.png');
	border-radius: 10px;
	background-size: 100% 25px; 
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 2px;
	padding-bottom: 3px;
	margin: 5px;
	line-height: 24px;
	font-style:normal;
	text-decoration: none;
	color: rgb(0, 0, 0);
	font-size: 13pt;
	transition-duration: 250ms;
}
.a3:hover, .a4, .adoc3:hover, .adoc4 {
	background-image:url('lien-t4.png');
	border-radius: 10px;
	background-size: 100% 25px; 
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 2px;
	padding-bottom: 3px;
	margin: 5px;
	line-height: 24px;
	font-style:normal;
	text-decoration: none;
	color: rgb(0, 0, 0);
	font-size: 13pt;
	transition-duration: 250ms;
}

.mygallerySubDiv {
	display:inline-block;
	text-align: center;
}

.mygalleryDiv {
	display: block;
	border: 1px solid #C0AAD5;
	box-shadow: 8px 8px 5px #C0AAD5;
	padding: 8px 12px;
	background-image: linear-gradient(180deg, #fff, #ddd 40%, #ccc);
	text-align: center;
	width:160px;
	height:260px;
	float:left;
	margin: 20px 10px;
	transition-duration: 500ms;
  }


  .mygalleryDiv:hover {
	display: block;
	border: 1px solid #C0AAD5;
	box-shadow: 8px 8px 5px #C0AAD5;
	padding: 8px 12px;
	background-image: linear-gradient(180deg, #fff, #ddd 40%, #ccc);
	text-align: center;
	width:160px;
	height:260px;
	float:left;
	margin: 20px 10px;
	transform: rotate(5deg) scale(1.2);
	transition-duration: 500ms;
  }

  .mygalleryimg:hover {
	transform:translate(-5px,-10px);
	transition-duration: 100ms;
  }


  .mygalleryimg {
	transition-duration: 100ms;
  }

  .adminDiv {
	display: block;
	border: 1px solid #C0AAD5;
	box-shadow: 8px 8px 5px #C0AAD5;
	padding: 8px 12px;
	background-image: linear-gradient(180deg, #fff, #ddd 40%, #ccc);
	text-align: center;
	/*width:160px;
	height:260px; */
	float:left;
	margin: 20px 10px;
	/* transition-duration: 500ms; */
  }
  .membregrpDiv {
	display: inline-block;
  }
.logopartenaire {
  max-height: 180px;
}
  .membreDiv {
	display: block;
	border: 1px solid #C0AAD5;
	box-shadow: 8px 8px 5px #C0AAD5;
	padding: 8px 12px;
	background-image: linear-gradient(180deg, #fff, #ddd 40%, #ccc);
	text-align: center;
	width:190px;
	height:280px;
	float:left;
	margin: 20px 10px;
	/* transition-duration: 500ms; */
	cursor:help;
  }

  .box {
	border: 1px solid #c4c4c4;
	padding: 30px 25px 10px 25px;
	background: white;
	margin: 30px auto;
	width: 360px;
  }
  h1.box-logo a {
	text-decoration:none;
  }
  h1.box-title {
	color: #AEAEAE;
	background: #f8f8f8;
	font-weight: 300;
	padding: 15px 25px;
	line-height: 30px;
	font-size: 25px;
	text-align:center;
	margin: -27px -26px 26px;
  }
  .box-button {
	border-radius: 5px;
	background: #d2483c;
	text-align: center;
	cursor: pointer;
	font-size: 19px;
	width: 100%;
	height: 51px;
	padding: 0;
	color: #fff;
	border: 0;
	outline:0;
  }
  .box-register
  {
	text-align:center;
	margin-bottom:0px;
  }
  .box-register a
  {
	text-decoration:none;
	font-size:12px;
	color:#666;
  }
  .box-input {
	font-size: 14px;
	background: #fff;
	border: 1px solid #ddd;
	margin-bottom: 25px;
	padding-left:10px;
	border-radius: 5px;
	width: 347px;
	height: 50px;
  }
  .box-input:focus {
	  outline: none;
	  border-color:#5c7186;
  }
  .sucess{
	  text-align: center;
	  color: white;
  }
  .sucess a {
	  text-decoration: none;
	  color: #58aef7;
  }
  p.errorMessage {
	  background-color: #e66262;
	  border: #AA4502 1px solid;
	  padding: 5px 10px;
	  color: #FFFFFF;
	  border-radius: 3px;
  }





.TRU:hover {
	border: #1c242d;
}



  .TDN {
	background-image:url('lien-t1.png');
  }
  .TDM {
	background-image:url('lien-t2.png');
  }
  .TDT {
	background-image:url('lien-t3.png');
  }
  .TDE {
	background-image:url('lien-t4.png');
  }



  
.tree {
	--spacing: 1rem;
	--radius: 10px;
	--marker-bg-default: #000000;
	--marker-bg-haschild: #6b9abb;
	line-height: 2rem;
  }
  .tree li {
	display: block;
	position: relative;
	padding-left: calc(2 * var(--spacing) - var(--radius) - 2px);
  }
  .tree ul {
	/*margin-left: calc(var(--radius) - var(--spacing));*/
	padding-left: 0;
  }
  
  .tree ul li {
	border-left: 2px solid #000000;
  }
  .tree ul li:last-child {
	border-color: transparent;
  }
  
  .tree ul li::before {
	content: "";
	display: block;
	position: absolute;
	top: calc(var(--spacing) / -2);
	left: -2px;
	width: calc(var(--spacing) + 2px);
	height: calc(var(--spacing) + 1px);
	border: solid #000000;
	border-width: 0 0 2px 2px;
  }
 
  

.imglogobu {
	height: 30px;
}

.litemoncompte {
	background: url(./background.png) 0 0 / cover no-repeat;
	background-clip: text;
	text-emphasis-color: transparent;
}


.divprochainement {
	display: grid;
	background-color:rgba(0, 247, 255, 0.5);
	/* background-color:rgba(219, 219, 219, 0.5); */
    background-size: cover;
	width:100% - 20px;
	height:auto;
	margin:10px 10px 10px 10px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
	
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-template-rows: 1fr;
	gap: 0px 0px;
	grid-auto-flow: row;
	grid-template-areas:
	  "divprochainementtxt divprochainementevent1 divprochainementevent2 divprochainementevent3";
  }
  
  .divprochainementtxt { grid-area: divprochainementtxt;
	margin:10px 10px 10px 10px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px; }
  
  .divprochainementevent1 { grid-area: divprochainementevent1; 
	margin:10px 10px 10px 10px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;}
  
  .divprochainementevent2 { grid-area: divprochainementevent2; 
	margin:10px 10px 10px 10px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;}
  
  .divprochainementevent3 { grid-area: divprochainementevent3; 
	margin:10px 10px 10px 10px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;}