html{
  zoom:0.9;
}

@font-face {
    font-family: Montserrat;
    src: url(ttf/Montserrat-Regular.ttf);
}


body{
   font-family:Montserrat;
               background: #ffffff;
            background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(180, 210, 214, 1) 50%, rgba(227, 243, 253, 1) 98%);
}

.navbar{
   box-shadow: 7px 7px 7px rgba(63, 63, 66, 0.587);
   z-index: 1;
}

.dropdown-menu{
   box-shadow: 3px 3px 3px rgba(47, 47, 51, 0.587);
}

.map-coord{
   float:right;
   font-size:0.5em;
   color:rgb(49, 49, 49);
     text-shadow: 1px 1px 2px rgb(255, 255, 255)
}

.picture-ma{
   position:absolute;
   margin-top:-5%;
   margin-left:68%;
   border-style: solid;
   border-color:white;
   border-width: 5px;
   box-shadow: 3px 3px 3px rgba(47, 47, 51, 0.587);
}

.discover-box{
   width: 25%;
   height: auto;
   position:absolute;
   margin-top:18%;
   margin-left:68%;
   border-style: solid;
   border-color:white;
   opacity: 1;
   text-align: center;
   font-size: 0.9em;
   border-width: 5px;
   background-color: white;
   color:rgb(16, 26, 26);
   box-shadow: 3px 3px 3px rgba(47, 47, 51, 0.124);
}

.discover-box:hover{
   cursor: pointer;
   color:rgb(0, 0, 255);
}




.flag-sign{
   margin-top:5%;
   background-color:rgb(56, 56, 56);
   color:white;
   padding:10px;
   text-shadow: 1px 1px 2px rgb(10, 10, 10);
}

.flag-flowers{
   position: absolute;
   margin-top: -150px;
   margin-left: -130px;
   opacity: 0.9;
}

.remember{
   width: 50%;
   height:auto;
   margin-left:18%;
   margin-top: 55px;
   background-color: white;
   padding:25px;
   box-shadow: 3px 3px 3px rgba(47, 47, 51, 0.587);

}

.page-header,
.footer {
   z-index: 1;
  background-color: rgb(48, 48, 50);
  color: white;
  padding: 20px;
  width: 100%;
  height: 70px;
  position: fixed;
  bottom:0;
  text-align: center;
  font-size: 0.9em;
  box-shadow: 7px 7px 7px rgba(63, 63, 66, 0.587);
  text-shadow: 1px 1px 2px rgb(10, 10, 10);
}

.contact-box{
   float:right;
   margin-right:3%;
   font-size:0.9em;
   opacity:0.5;
   text-decoration: none;
   color: white;
}

.head-y-article{
   background-color: lightyellow;
   width:auto;
   text-align: center;
   height:30px;
   opacity:1;
   padding:2px;
   
}

.box-article-info{
   width: 113%;
   height:100%;
   text-align: justify;
   background-color:white;
   padding:25px;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

.desc-article{
   background-color:rgba(170, 234, 217, 0.33);
   width:auto;
   padding:5px;
   text-align:center;
   border-color:white;
   border-width:3px;
}

.title-form{
   padding: 50px;
   opacity: 0.8;
   margin-top:-5px;
   margin-left:-5px;
   color:rgb(28, 94, 127)
}

.input-form-text{
   width: 80%;
   height:40px;
   padding-left:5px;
   margin-left:10%;
   border-color:rgb(178, 208, 208);
   border-style: solid;
}

.capital {
   text-transform: capitalize;
}

.contact-box:hover{
   opacity: 1;
   cursor: pointer;
}

th.col-form{
   background-color: rgb(60, 98, 122);
   opacity: 0.7;
   color: white;
   cursor: default;
   text-shadow: 1px 1px 2px rgb(0, 0, 0);
   border-color:rgb(178, 208, 208);
   border-style: solid;
}

td.mention-form{
   color: rgb(255, 255, 255);
   background-color: rgb(115, 135, 115);
   text-align: right;
   font-size: 0.9em;
}

.msg-form{
   width: 100%;
   height: 250px;
   padding: 15px;
   border-color:rgb(178, 208, 208);
   border-style: solid;
}

.btn-form{
   width: 150px;
   background-color: rgb(71, 81, 74);
   border-style: none;
   color: white;
   padding: 10px;
   float: right;
   text-shadow: 1px 1px 2px rgb(0, 0, 0);
}

.btn-form:hover{
   cursor: pointer;
   background-color: rgb(72, 109, 83);
}

h1{
   cursor: default;
}

.notif-error{
   color:red;
   font-weight: bold;
   margin-left:3%;
   position:absolute;
}

.obligatory{
   color: red;
   font-weight: bold;
   font-size: 1.1em;
   margin-right: 1%;
}

.notif-success{
   color:rgb(72, 154, 56);
   font-weight: bold;
   margin-left:3%;
   position:absolute;
}

.btn-link{
   text-decoration: none;
   background-color: rgb(44, 45, 67);
   color: white;
   border-style: none;
   border-radius: 3%s;
   padding: 5px;
   width: 150px;
}

td.back-ly{
   background-color: lightyellow;
}

td.back-lmy{
   background-color: rgb(217, 235, 235);
}

.btn-link:hover{
   cursor: pointer;
   color: white;
   background-color: rgb(51, 76, 115);
}

.card{
   box-shadow: 2px 5px 5px rgba(90, 90, 90, 0.322);
   border-style: solid;
   border-color:rgb(255, 255, 255);
   border-width: 5px;
   padding: 5px;
   background-color: rgb(238, 247, 224);
   margin-left: 1%;
}

td.title-item{
   background-color: lightblue;
}

.card-title{
   box-shadow: 3px 3px 3px rgb(90, 90, 90);
   background-color: rgb(182, 243, 185);
   color:rgb(13, 54, 29);
   border-style: solid;
   border-color: rgb(248, 255, 249);
   border-width: 3px;
   width: 100%;
   padding:5px;
   font-size: 1.1em;
   text-align: center;
   margin-top: 0%;
}

.card-text{
   color: rgb(4, 54, 4);
   font-size: 0.9em;
}

.card-link{
   background-color: rgb(243, 232, 182);
   padding:5px;
   width: 100%;
   font-size: 1em;
   text-align: center;
   color: rgb(7, 54, 19);
}

.card-link:hover{
   color: rgb(10, 95, 31);
}

.slotPrice{
   box-shadow: 3px 3px 3px rgba(90, 90, 90, 0.267);
   width: 100%;
   border-style: solid;
   border-color: rgb(248, 255, 249);
   border-width: 3px;
   background-color: rgb(250, 250, 141);
   text-align: center;
}

.card-img-top {
   border-style: solid;
   border-color:rgb(233, 231, 231);
   border-width: 5px;
   
}

h5{
   margin-top: -25%;
   color: rgb(255, 255, 255);
   font-size: 1.8vw;
   text-shadow: 1px 1px 2px rgb(10, 10, 10);
}

.desc {
   font-size: 1.4vw;
   color: rgb(255, 255, 255);
   text-shadow: 1px 1px 2px rgb(10, 10, 10);
}

a.interact{
   opacity: 0.8;
}

a.interact:hover{
   opacity: 1;
   cursor: pointer;
}

a.nolnk{
   text-decoration: none;
   color: gray;
}

img.photo-design {
   border-radius: 50%;
   width: 160px;
   height: 160px;
   border-color: rgb(255, 253, 242);
   border-style: solid;
   border-width: 5px;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

.photos-section{
   padding: 15px;
   background-color: white;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

th.member-name {
   color: gray;
   font-size: 1.3em;
   text-align: center;
}

td.c{
   text-align: center;
}

td.member-title{
   color: rgb(71, 96, 119);
   font-size: 1.3em;
   text-align: center;
}

.intro-section{
   background-color: rgb(236, 243, 197);
   height: 107px;
   padding:15px;
   border-style: solid;
   border-color:white;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

.slot1-assoc-section{
   background-color: rgb(215, 245, 250);
   height: 150px;
   margin-top: 2%;
   padding:15px;
   border-style: solid;
   border-color:white;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

.slot2-assoc-section{
   background-color: rgb(215, 250, 225);
   height: 150px;
   margin-top: 2%;
   padding:15px;
   border-style: solid;
   border-color:white;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

.slot3-assoc-section{
   background-color: rgb(255, 238, 212);
   height: 150px;
   margin-top: 2%;
   padding:15px;
   border-style: solid;
   border-color:white;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

.slog-donation{
   color:#fd6593;
   font-size: 1.8em;
   font-weight: bold;
   padding: 25px;
}

.box-mention {
  background-color:white;
  padding:25px;
}

.box-rgpd {
  background-color:white;
  padding:25px;
}

.slog-mailto{
   color:#818692;
   font-size: 1.8em;
   font-weight: bold;
   padding: 25px;
}

.slog-formto{
   color:#315244;
   font-size: 1.8em;
   font-weight: bold;
   padding: 25px;
}

.social-assoc-facebook{
   margin-top: 2%;
   font-size: 1.8em;
   background-color: rgb(41, 91, 121);
   border-style: solid;
   border-color:white;
   padding:15px;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

.social-assoc-tiktok{
   margin-top: 2%;
   font-size: 1.8em;
   background-color: rgb(66, 41, 121);
   border-style: solid;
   border-color:white;
   padding:15px;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

.social-assoc-youtube{
   margin-top: 2%;
   font-size: 1.8em;
   background-color: rgb(184, 77, 77);
   border-style: solid;
   border-color:white;
   padding:15px;
   height: 150px;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

.slogan-facebook{
   color:#ffffff;
   font-size: 1.1em;
   padding: 25px;
}

.slogan-tiktok{
   color:#ffffff;
   font-size: 1.1em;
   padding: 25px;
}

.slogan-youtube{
   color:#ffffff;
   font-size: 1.1em;
   padding: 25px;
}

.list-group{
   overflow-y: scroll;
   height: 550px;
   background: #e6e0d3;
   background: linear-gradient(90deg, rgba(230, 224, 211, 1) 0%, rgba(255, 253, 245, 1) 50%, rgba(204, 202, 190, 1) 97%);
}

.box-content-p{
   background-color: #ffffff;
   width: 100%;
   height: 700px;
   border-width: 5px;
   padding:35px;
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
   overflow-y: scroll;
}

.article-content{
   width: 70%;
   padding: 5px;
   font-size: 1em;
   margin-left:15%;
   background-color: rgba(255, 255, 255, 0.829);
   box-shadow: 1px 1px 2px rgba(97, 97, 96, 0.096);
}

.clip-design{
   border-style: solid;
   border-width: 5px;
   min-width: 5vw;
   max-width: 40vw;
   max-height: 250px;
   min-height: 180px;
   color: rgb(255, 248, 227);
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.096);
}

.btn-onglet-lp{
   color:rgb(83, 83, 83);
   background: #dedede;
   background: linear-gradient(90deg, rgba(222, 222, 222, 1) 1%, rgba(255, 255, 255, 1) 50%, rgba(230, 230, 230, 1) 97%);
   margin-top: 1%;
   border-style: none;
   padding:10px;
   box-shadow: 3px 1px 1px rgba(97, 97, 96, 0.5);
}

.btn-onglet-lp-val{
   color:rgb(83, 83, 83);
   background: #f2f2f0;
   background: linear-gradient(90deg, rgba(242, 242, 240, 1) 1%, rgba(255, 255, 242, 1) 50%, rgba(255, 255, 224, 1) 97%);
   border-style: solid;
   border-color: rgb(255, 248, 216);
   margin-top: 1%;
   padding:10px;
   box-shadow: 3px 1px 1px rgba(97, 97, 96, 0.5);
}

.btn-onglet-lp:hover{
   background: #f2f2f0;
   background: linear-gradient(90deg, rgba(242, 242, 240, 1) 1%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 1) 97%);
   margin-top: 1%;
}

.list-btn-onglet-lp{
   background-color: white;
   text-decoration: none;
   padding:10px;
   color:rgb(31, 31, 31);
   border-style: solid;
   border-color: rgb(252, 241, 196);
   border-width: 1px;
   box-shadow: 3px 1px 1px rgba(97, 97, 96, 0.5);
   opacity: 0.7;
}

.list-btn-onglet-lp-val{
   background-color: rgb(253, 253, 233);
   text-decoration: none;
   padding:10px;
   color:rgb(94, 75, 17);
   box-shadow: 3px 1px 1px rgba(97, 97, 96, 0.5);
}

.list-btn-onglet-lp-val:hover{
   color:rgb(151, 120, 27);
   cursor: default;
}

.list-btn-onglet-lp:hover{
   opacity: 1;
   color:rgb(151, 120, 27);
   cursor: pointer;
}

.article-title{
   cursor: default;
   color:rgb(21, 19, 18);
   background: #e3d1a8;
   background: linear-gradient(90deg, rgba(227, 209, 168, 1) 0%, rgba(255, 246, 212, 1) 50%, rgba(196, 184, 134, 1) 98%);
   padding:10px;
   font-size: 1.2em;
   text-shadow: 1px 1px 2px rgb(255, 255, 255);
}

.bordure-gold{
   margin-left: -10px;
   margin-right: 5px;
   margin-top:39px;
   position: absolute;
   height: 520px;
}

.deco-head-gold{
   position:absolute;
   margin-left:25%;
   margin-top: -25px;
   opacity:0.9;
}

a.btn-print{
   opacity: 0.7;
   float:right;
   text-decoration: none;
   color:rgb(92, 82, 71);
}

a.btn-print:hover{
   opacity: 1;
   cursor: pointer;
}

th.slot-calendar-accent{
   background-color: rgb(244, 255, 224);
   text-align: center;
}
th.slot-calendar{
   background-color: rgb(235, 246, 250);
   text-align: center;
}
td.body-calendar{
   background-color: rgb(255, 255, 235);
   text-align: center;
   font-size: 0.9em;
}
th.slot-event{
   background-color: azure;
   text-align: center;
   font-size: 1em;
}
th.l{
   text-align: left;
}
th, td, span  {
   cursor: default; 
   font-size: 1em;

}
th.slot-event-b{
   background-color: rgb(252, 239, 221);
   text-align: center;
   font-size: 1em;
}
th.slot-event-c{
   background-color: rgb(239, 255, 237);
   text-align: center;
}
th.slot-event-cl{
   background-color: rgb(239, 255, 237);
   text-align: left;
   font-size: 1em;
}
td.body-event{
   background-color: rgb(246, 255, 251);
   text-align: center;
   font-size: 1em;
}
td.body-event-b{
   background-color: rgb(252, 255, 220);
   text-align: center;
   font-size: 1em;

}
td.body-event-c{
   background-color: rgb(254, 255, 236);
   text-align: center;
   font-size: 1em;
}

.info-body {
   padding: 5px;
   width: 100%;
}

.info-body-t {
   padding: 5px;
   width: 100%;
}

.box-event{
   width: 100%;
}

.interact{
   opacity: 0.5;
}

.interact:hover{
   opacity: 1;
   cursor: pointer;
}

a.lnk{
   text-decoration: underline;
}

a.lnk:hover{
   cursor: pointer;
}

td.box-event-border{
   background-color: rgb(227, 241, 241);
}

.title-event{
   background-color: rgb(162, 212, 255);
   padding:10px;
   box-shadow: 3px 3px 1px rgba(96, 96, 97, 0.205);
   text-shadow: 1px 1px 2px rgb(255, 255, 255);
}

.flag-tevent{
   position: absolute;
   width: 55px;
   margin-top: -15px;
   margin-left: 15px;
}

.label-print-event{
   font-size:0.7em;
   opacity:0.5
}

.label-print-event:hover{
   cursor: pointer;
   opacity: 1;
}

.notif-stat-event{
   float: right;
   color: green;

}

.box-stat-event{
   background-color: #f3ffd3;
}

#graph-stat-c, #graph-stat-p, #graph-stat-l, #graph-stat-cd{
   padding-left: 5px;
   margin-bottom: 1%;
   height: 30px;
}

.section-stat{
   background-color: rgb(255, 253, 235);
   height: 210px;
   padding:25px;
}

.lib-graph{
   font-size: 1.5em;
   margin-left: 1%;
   margin-right: 1%;
   font-weight: bold;
}

.tp{
   margin-top: 0%;
   height:550px;
}

.title-indices{
   color: rgb(3, 83, 114);
   font-weight: bold;
   font-size: 2.1em;
   margin-bottom: 1%;
}

.notif-mail{
   position: absolute;
   width:35px; 
   margin-top: -5px;
   margin-left:10px;
}

.notif-flag{
   width: 20px;
   height: 20px;
   border-radius: 50%;
   background-color: brown;
   padding:3px;
   font-size: 0.7em;
   color: white;
   font-weight: bold;
   padding-left: 7px;
   position: absolute;
   margin-top: -35px;
   margin-left: 110px;
}

.ico-settings{
   position: absolute;
   width: 47px;
   margin-left: -87px;
   margin-top: -12px;
}

.in-production{
   color:green;
   font-weight: bold;
   border-color: green;
   border-style:dashed;
   border-width: 1px;
   padding: 5px;
   opacity: 0.5;
}

.out-production{
   color: red;
   font-weight: bold;
}

.middle-size{
   width: 222px;
   background-color: rgb(71, 92, 148);
   box-shadow: 3px 5px 2px rgba(97, 97, 96, 0.356);
}

.clip {
   width: 250px;
   aspect-ratio: 1/1;
   object-fit: cover;
}

.interact{
   opacity: 0.7;
}

.interact:hover{
   opacity: 1;
   cursor: pointer;
   animation-name: pulseAnimation;
   animation-duration: 0.5s;
   animation-timing-function: ease;
   animation-iteration-count: 1;
   animation-direction: normal;
   animation-fill-mode: both;
}

.legend-group{
   width: 100%;
   background-color: beige;
   padding:15px;
   margin-bottom: 1%;
   box-shadow: 10px 5px 5px rgba(92, 92, 92, 0.274);
   text-shadow: 1px 1px 2px rgb(255, 255, 255);
   border-style: solid;
   border-width: 3px;
   font-size: 1.1em;
   border-color: white;
   font-weight: bold;
}

.date-slot{
   float: right;
   font-weight: normal;
   font-style: italic;
   text-shadow: 1px 1px 2px rgb(255, 255, 255);
}

@keyframes pulseAnimation {
   0%, 100% { transform: scale(1); }
   50% { transform: scale(1.05); }
}