/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 @font-face {
  font-family: BastardoGroteskish;
  src: url('../font/BastardoGroteskish-Regular.woff2');  
}

@font-face {
  font-family: BastardoGroteskishbold;
  src: url('../font/BastardoGroteskish-Bold.woff2');
  font-weight: bold;
}


* {  
  font-family: BastardoGroteskish !important;
  color: #000000 !important;
}

 .st0{fill:#4F4F4F;stroke:#FFFFFF;stroke-width:0.25;stroke-miterlimit:10;}
 .st1{fill:#E07C8D;}
 .hrefpath {
  cursor: pointer;
 }

.fiche-peda a {
  color:#ffffff !important;
  float: right;
  background-color: #B1C5A4;
}

 .parcous-logo {
  font-family: BastardoGroteskishbold !important;
  font-size: 1.3em;
  color: #b1c5a4 !important;
  font-weight: 600;
 }

 .content_page {
  margin-left: auto !important;
  margin-right: auto !important;
  margin: 10px;
  width: var(--wp--style--global--content-size);
 }

 .cont-main {
  display: none;
  position: fixed; 
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  /*background-color: rgba(0, 0, 0, 0.5);*/
  z-index: 100;
  overflow-y: auto;
 }
 
.cont-participant {
  display: none;
  min-width: 14em;
  min-height: 10em;
  background-color: #ffffff;
  position: absolute;
  width: 14%; 
  border-radius: 5px;
  cursor: pointer;
  padding: 0;
  margin: 0;
  box-shadow: 0px 9px 27px 0px #828282f5;
  border: 2px solid;
  background-color: #f2ffdb;
  padding: 0.5em;
}

.cont-participant>div {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

.cont-participant h4 {
  padding: 0;
  margin: 0;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  text-align: center;
}

.cont-participant p {
  margin: 0;
  padding: 0;
}

.cont-participant .date-arrivee {
  font-size: 0.7em;
}

.cont-participant .dphoto {
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 9em;
  border-radius: 5px;
}

.embed_video .dphoto {
  background-size: cover;
  background-repeat: no-repeat;
  cursor: pointer;
}

.embed_video .dphoto div {
  min-height: 21em;
  position: relative;
  opacity: 0.4;
  /*border-radius: 5px;
  height: 100%;*/
}

.cont-participant .dphoto div {
  width: 100%;
  min-height: 9em;
  position: relative;
  opacity: 0.4;
  border-radius: 5px;
}

.parcours_vimeo_wrapper .dphoto img {
  max-width: 100%;
  width: 100%;
 }
 
.cont-participant img {
  border-radius: 5%;
  width: 100%;
}

 .cont-main>article {
   max-width: 100%;
   /*margin-left: auto;
   margin-right: auto;*/
   margin-top: 3%;
  /* background-color: rgba(255, 255, 255, 0.75);*/
   /*border: 1px solid #000;*/
   overflow-y: auto;
   height: 579pt;
   padding-bottom: 36pt;
 }
 
 .cont-main>article>span {
   display: flex;
   float: right;
   min-height: 27pt;
   min-width: 27pt;
   font-size: 19pt;  
   align-items: center;
   align-content: center;
 }
 
 .cont-main>article section {
   width: 65%;
   /*margin: 2%;
   padding: 0;*/
   margin-left: auto;
   margin-right: auto;
   background-color: rgba(255, 255, 255,0.7);
   padding: 1em;
 }
 
 /*.cont-main>article section>div {
   display: flex;   
   flex-flow: column;
   width: 100%;
   margin: 0;
   padding: 0;
   font-size: 1em;
 }*/
 
 /*.cont-main>article section>div>h2 {
  margin-left: auto;
  margin-right: auto;
 }*/

 .code-media {
   width: 100%;
   margin-left: auto;
   margin-right: auto;
 }
 

 .url-close {
  position: relative;
  background-color: #E07C8D;
  border-radius: 50%;
  cursor: pointer;
  float: right;
  padding: 0.2em;
  /*right: 4em;
  top: 3em;*/
 }

 .url-close>a {
  color: #ffffff !important;
  text-decoration: none;
  cursor: pointer;
  font-size: 1.4em;
  padding: 8px;
  margin: 0;
 }

 .cont-video-partici {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;  
 }

 .videos-partici {
  width: 70%;
 }

 .present-partici {
  width: 25%;
  margin-left: 1em;
  font-size: 0.9em;
  padding-right: 1em;
 }

 .present-partici h1 {
  padding: 0;
  margin: 0; 
  font-weight: 600;
 }

 .url-video {
  font-weight: 200;
 }

 .carr-right .present-partici {
  width: 25%;
  margin-left: 1em;
  font-size: 0.9em;
  height: 30em;
  overflow-y: auto;
  padding-right: 1em;
 }

 .dcont-carrusel {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  height: 100%;
 }

 .carr-left {
  width: 20%;
  /*min-width: 9em; */ 
  font-size: 0.9em;
  padding-left: 1em;
  padding-right: 1em;
 }

 .carr-right {
  display: flex;
  flex-wrap: nowrap;
  width: 80%;
  min-width: 50em;
 }

 .embed_video {
  width: 587px;
  min-width: 23em;
 }

 .btn-carr-left, .btn-carr-right {
  display: flex;
 }

 .btn-carr-left>div, .btn-carr-right>div {
  /*display: table-cell;*/
  /*vertical-align: middle;*/
  border: 1px solid #B1C5A4;
  border-radius: 5px;
  margin-top: auto;
  margin-bottom: auto;
  height: 5em;
  align-content: center;
  cursor: pointer;
 }

 .btn-carr-left>div svg, .btn-carr-right>div svg {
  display: block;
 }


 .btn-carr-left div:hover, .btn-carr-right div:hover {
  background-color: #DEE8D7;
 }

 .cont-partici-carr {
  display: flex;
  flex-wrap: nowrap;
  margin-left: 0.5em;
  margin-right: 0.5em;
 }

 .cont-carrousel {
  width: 100%;
  /*height: 42em;*/
 }

 .btns-nav-carr ul {
  display: flex;
  flex-wrap: nowrap;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
 }

 .liparti {
  margin: 0.3em;
  list-style: none;
  cursor: pointer;
 }

 .liparti svg circle:hover {
  fill: #B1C5A4;
 }

 @media only screen and (max-device-width: 950px) {

  .dcont-carrusel svg {
    width: 25px;
    height: 25px;
  }

  .cont-partici-carr {
    flex-wrap: wrap;
  }

  .cont-partici-carr .carr-left {
    width: 100%;
    padding: 0;
  }

  .cont-partici-carr .carr-right {
    flex-wrap: wrap;
    min-width: 0;
    width: 100%;
  }

  .cont-partici-carr .carr-right .present-partici {
    width: 100%;
    margin-top: 0.5em;
  }

}

@media only screen and (max-device-width: 700px) {

  .embed_video {
    width: 530px;
  }
}

@media only screen and (max-device-width: 600px) {
  .embed_video {
    width: 458px;
  }

}

@media only screen and (max-device-width: 400px) {
  .embed_video {
    width: 285px;
    min-width: 0;
  }

  .embed_video .dphoto {
    background-size: contain;
  }

  .embed_video .dphoto div {
    min-height: 10em;
  }

  .carr-right .present-partici {
    overflow-y: visible;
    height: 100%;
  }

}