/* -------------------------------------------------------------------------------- CAROUSEL HOME */
.home {
  height: 80vh;
}
.home img, .home video {
  min-width: 100% !important;
  min-height: 100% !important;
}
.home h1, .home h2 {
  font-weight: bold;
}
.home .carousel-caption {
  width: auto;
  height: 100%;
  padding-top: 20%;
}
.home .carousel-indicators li {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin: auto 10px;
}
.home .carousel-control-next, .home .carousel-control-prev {
  width: 5%;
}
.home .carousel-control-next-icon, .home .carousel-control-prev-icon {
  width: 40px;
  height: 40px;
}
.home .carousel-item #slide3 {
  float: right;
}
.home .reseau-sociaux {
  position: absolute;
  top: 10%;
  right: 0;
  z-index: 45;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0.6em;
}
.home .reseau-sociaux a {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #f2f2f2;
  display: flex;
  margin-bottom: 1em;
  text-decoration: none;
}
.home .reseau-sociaux a i {
  margin: auto;
  color: #0e895f;
}
.home .reseau-sociaux a:hover {
  background-color: #0e895f;
}
.home .reseau-sociaux a:hover i {
  color: #f2f2f2;
}

@media screen and (max-width: 540px) {
  .home {
    height: 300px;
  }
  .home h1, .home h2 {
    font-size: 1.2em;
    padding-bottom: 40px;
  }
  .home .containerText {
    font-size: 1em;
  }
}
/* -------------------------------------------------------------------------------- ABOUT HOME */
#about {
  padding-bottom: 1rem;
}

/* -------------------------------------------------------------------------------- VALEUR AJOUTEE HOME */
#valeur {
  padding-bottom: 1em;
}
#valeur .listAbout {
  padding: 0;
}
#valeur .pointAbout {
  cursor: pointer;
  overflow: hidden;
  padding: 0.2em;
}
#valeur .pointAbout:hover .icon {
  background-color: #ce7a82;
  color: #f2f2f2;
}
#valeur .pointAbout h3 {
  font-size: 1.2rem;
  text-align: center;
}
#valeur .pointAbout .enterli, #valeur .pointAbout .more, #valeur .pointAbout h3 {
  color: #f2f2f2;
}
#valeur .pointAbout:hover .more, #valeur .pointAbout:hover h3 {
  color: #ce7a82;
}
#valeur .pointAbout .icon {
  color: #f2f2f2;
  width: 80px;
  height: 80px;
  display: block;
  margin: auto;
  padding: 20px;
  border-radius: 50%;
  border: 2px solid #ce7a82;
  text-align: center;
  font-size: 2em;
  transition: background-color 0.5s, color 0.5s;
}
#valeur .pointAbout .more {
  padding: 1rem;
  text-align: center;
  transition: all 0.3s ease-in-out;
}
#valeur .pointAbout .textAbout {
  width: 100%;
  text-align: justify;
  color: #22262b;
  height: 0;
  overflow: hidden;
  transition: height 0.5s;
}
#valeur .pointAbout .textAbout .active {
  overflow: hidden;
}
#valeur .pointAbout .textAbout p, #valeur .pointAbout .textAbout ul {
  padding: 1em 1.4em;
  list-style-type: disc !important;
}
#valeur .pointAbout .textAbout ul {
  padding-top: 0.5em;
  padding-left: 3em;
}
#valeur .pointAbout .textAbout ul li {
  padding-bottom: 0.8em;
}
#valeur .pointAbout .enteteAbout {
  width: 100%;
  background-color: #6c757d;
  border-radius: 6px;
  padding: 1em;
  transition: background-color 0.5s ease-in-out;
}
#valeur .pointAbout .enteteAbout:hover {
  background-color: #22262b;
}
#valeur #itemAbout1 .active {
  height: 223px;
}
#valeur #itemAbout2 .active {
  height: 190px;
}
#valeur #itemAbout3 .active {
  height: 290px;
}
#valeur #itemAbout4 .active {
  height: 280px;
}

@media screen and (max-width: 720px) {
  #valeur #itemAbout1 .active {
    height: 223px;
  }
  #valeur #itemAbout2 .active {
    height: 210px;
  }
  #valeur #itemAbout3 .active {
    height: 330px;
  }
  #valeur #itemAbout4 .active {
    height: 300px;
  }
}
@media screen and (max-width: 540px) {
  #valeur #itemAbout1 .active {
    height: 352px;
  }
  #valeur #itemAbout2 .active {
    height: 250px;
  }
  #valeur #itemAbout3 .active {
    height: 525px;
  }
  #valeur #itemAbout4 .active {
    height: 568px;
  }
}
/* -------------------------------------------------------------------------------- SERVICES HOME */
/* @media screen and (max-width: 992px) {
    header .navbar-nav {
        align-items: flex-start;
    }
} */
.containtsect_service {
  margin: auto;
  padding-bottom: 1rem;
  max-width: 1110px;
}

#nosServices {
  /* width: 124%; */
  margin: auto;
}
#nosServices .pointServices {
  display: flex;
  flex-direction: row;
  align-items: center;
}
#nosServices .containtptServices, #nosServices .iconServices {
  display: inline-block;
}
#nosServices .iconServices {
  padding: 15px;
  text-align: center;
}
#nosServices .iconServices i {
  font-size: 1.2em;
}
#nosServices .containtptServices {
  padding: 20px 30px;
  width: 100%;
  min-height: 230px;
  margin-bottom: 10px;
  text-align: justify;
  -moz-text-align-last: center;
       text-align-last: center;
  background-color: #f2f2f2;
  color: #22262b;
}
#nosServices .docptServices {
  background-color: #f2f2f2;
  border-radius: 5px;
  margin-bottom: 1rem;
  height: 660px;
  position: relative;
}
#nosServices .docptServices h3 {
  color: #22262b;
  padding: 10px 5px 5px;
}
#nosServices .docptServices sub {
  font-size: 0.8em;
}
#nosServices .servicesTexts {
  padding-bottom: 0.6rem;
  text-align: center;
  color: #22262b;
}
#nosServices .servicesTexts p, #nosServices .servicesTexts ul {
  margin: 0;
  padding: 0 0 0.6em;
}
#nosServices .servicesTexts ul {
  text-align: left;
  padding-left: 1.5em;
}
#nosServices .servicesTexts ul li {
  padding-bottom: 0.4em;
}
#nosServices .bkServices {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  border-radius: 5px;
  width: 100%;
  height: 100%;
  background-color: grey;
  opacity: 1;
  transition: opacity cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.2s;
}
#nosServices .bkServices:hover {
  opacity: 0;
}

#nosServices #service1 .bkServices {
  background: url("/images/services/bk/1.jpg") no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}

#nosServices #service2 .bkServices {
  background: url("/images/services/bk/2.jpg") no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}

#nosServices #service3 .bkServices {
  background: url("/images/services/bk/3.jpg") no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}

#nosServices #service4 .bkServices {
  background: url("/images/services/bk/4.jpg") no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}

#nosServices #service5 .bkServices {
  background: url("/images/services/bk/5.jpg") no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}

#nosServices #service6 .bkServices {
  background: url("/images/services/bk/6.jpg") no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}

@media screen and (max-width: 950px) {
  #nosServices .bkServices {
    opacity: 0;
  }
}
@media screen and (max-width: 750px) {
  #nosServices .docptServices {
    height: auto;
  }
}
/* -------------------------------------------------------------------------------- ABOUTU HOME */
#aboutU {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}
#aboutU h3 {
  color: #f2f2f2;
  font-size: 1.2rem;
}
#aboutU .item {
  width: 250px;
  height: 250px;
  position: relative;
}
#aboutU .item .black-overlay {
  position: absolute;
  z-index: 1;
  margin: 0;
  padding: 80px 20px 20px;
  width: 100%;
  height: 100%;
  color: #f2f2f2;
  opacity: 0;
  transition: opacity 0.3s ease-out;
  -moz-transition: opacity 0.3s ease-out;
  -webkit-transition: opacity 0.3s ease-out;
  -o-transition: opacity 0.3s ease-out;
}
#aboutU .item .black-overlay h3 {
  opacity: 0;
  transition: opacity 0.3s ease-out;
  -moz-transition: opacity 0.3s ease-out;
  -webkit-transition: opacity 0.3s ease-out;
  -o-transition: opacity 0.3s ease-out;
  text-shadow: 1px 1px 0 black, 1px -1px 0 black, -1px 1px 0 black, -1px -1px 0 black;
}
#aboutU .item .black-overlay .traitTitre {
  height: 2px;
  opacity: 0;
  transition: opacity 0.3s ease-out;
  -moz-transition: opacity 0.3s ease-out;
  -webkit-transition: opacity 0.3s ease-out;
  -o-transition: opacity 0.3s ease-out;
}
#aboutU .item .teintebkU {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  background-color: #22262b;
  opacity: 0;
  transition: opacity 0.3s ease-out;
  -moz-transition: opacity 0.3s ease-out;
  -webkit-transition: opacity 0.3s ease-out;
  -o-transition: opacity 0.3s ease-out;
}
#aboutU .item:hover .teintebkU {
  opacity: 0.6;
}
#aboutU .item:hover .black-overlay, #aboutU .item:hover .traitTitre, #aboutU .item:hover h3 {
  opacity: 1;
}

#aboutU #bkU1 {
  background: url("/images/projects/1.jpg") no-repeat;
}

#aboutU #bkU2 {
  background: url("/images/projects/2.jpg") no-repeat;
}

#aboutU #bkU3 {
  background: url("/images/projects/3.jpg") no-repeat;
}

#aboutU #bkU4 {
  background: url("/images/projects/4.jpg") no-repeat;
}

#aboutU #bkU5 {
  background: url("/images/projects/5.jpg") no-repeat;
}

#aboutU #bkU6 {
  background: url("/images/projects/6.jpg") no-repeat;
}

#aboutU #bkU7 {
  background: url("/images/projects/7.jpg") no-repeat;
}

#aboutU #bkU8 {
  background: url("/images/projects/8.jpg") no-repeat;
}

#aboutU #bkU9 {
  background: url("/images/projects/9.jpg") no-repeat;
}

@media screen and (max-width: 950px) {
  #aboutU .item.teintebkU, #aboutU .item:hover .teintebkU {
    opacity: 0.2;
  }
  #aboutU .item .black-overlay, #aboutU .item .black-overlay .traitTitre, #aboutU .item .black-overlay h3, #aboutU .item:hover .black-overlay {
    opacity: 1;
  }
}
/* -------------------------------------------------------------------------------- TEAM HOME */
#team #staff1 {
  background: url("/images/staff/Webjch.jpg") no-repeat;
}
#team #staff2 {
  background: url("/images/staff/WebValerie.jpg") no-repeat;
}
#team #staff3 {
  background: url("/images/staff/WebDamien.jpg") no-repeat;
}
#team #staff4 {
  background: url("/images/staff/WebMarylin.jpg") no-repeat;
}
#team #staff5 {
  background: url("/images/staff/WebGregoire.jpg") no-repeat;
}
#team #staff6 {
  background: url("/images/staff/WebKevin.jpg") no-repeat;
}
#team #staff7 {
  background: url("/images/staff/WebManuella.jpg") no-repeat;
}
#team #staff8 {
  background: url("/images/staff/WebMarie.jpg") no-repeat;
}
#team #staff9 {
  background: url("/images/staff/WebJocia.jpg") no-repeat;
}
#team #staff10 {
  background: url("/images/staff/WebAurelie.jpg") no-repeat;
}
#team #staff11 {
  background: url("/images/staff/WebMarc.jpg") no-repeat;
}
#team #staff12 {
  background: url("/images/staff/WebMartial.jpg") no-repeat;
}
#team .staffcard {
  max-width: 240px;
  height: 350px;
  position: relative;
  margin: 5px;
  background-size: cover !important;
  -webkit-background-size: cover !important;
  -moz-background-size: cover !important;
  -o-background-size: cover !important;
}
#team .staffcard .cross:hover i {
  color: #ce7a82;
  cursor: pointer;
}
@media (min-width: 992px) {
  #team .staffcard {
    max-width: 25%;
  }
}
#team .teamContentCard {
  padding: 1rem;
}
#team .descriptionStaff {
  opacity: 0;
  transition: opacity 0.3s ease-out;
  -moz-transition: opacity 0.3s ease-out;
  -webkit-transition: opacity 0.3s ease-out;
  -o-transition: opacity 0.3s ease-out;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background-color: #f2f2f2;
}
#team .descriptionStaff:hover {
  opacity: 1;
}
#team .descriptionStaff ul {
  margin: 0.5em 0;
  padding: 0;
}
#team .descriptionStaff ul li {
  display: inline;
  background-color: #22262b;
  color: #f2f2f2;
  padding: 0.5em;
  text-align: center;
  border-bottom: solid 2px #22262b;
}
#team .descriptionStaff ul li h4 {
  font-size: 1em;
  margin: 0;
  padding: 0;
}
#team .descriptionStaff ul li:hover {
  background-color: #ce7a82;
  border-bottom: solid 2px #ce7a82;
  cursor: pointer;
}
#team .descriptionStaff ul .liselect {
  border-bottom: solid 2px #ce7a82;
}
#team .textStaff {
  text-align: justify;
  color: #22262b;
  padding: 0.6em;
}
#team .textStaff .textInfoStaff {
  font-size: 0.9em;
  -webkit-hyphens: auto;
  hyphens: auto;
  height: 0;
  opacity: 0;
  transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
}
#team .textStaff .textInfoStaff p {
  font-size: 0.9em;
  margin: 0;
  line-height: 1.3;
}
#team .textStaff .textHorStaff {
  text-align: center;
  font-size: 0.9em;
  height: 0;
  opacity: 0;
  transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
}
#team .textStaff .textHorStaff strong {
  font-weight: bold;
}
#team .textStaff .textHorStaff p {
  font-size: 0.9em;
  margin: 0;
  line-height: 1.3;
}
#team .textStaff .textActiveStaff {
  height: auto;
  opacity: 1;
}
#team .cross {
  display: none;
  font-size: 15px;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 50;
  padding: 15px;
  color: #22262b;
  transition: all 0.3s ease-in-out;
}
#team .staffPresentation {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 80px;
  text-align: center;
  color: #22262b;
  background-color: #f2f2f2;
}
#team .staffPresentation h3, #team .staffPresentation h4 {
  font-size: 1em;
  padding: 0;
  margin: 0;
}
#team .staffPresentation h3 {
  padding: 0.5em 0;
}
#team .staffPresentation h4 {
  font-size: 0.9em;
}

@media screen and (max-width: 950px) {
  #team .cross {
    display: block;
  }
  #team .descriptionStaff:hover {
    opacity: 0;
  }
  #team .descActive:hover {
    opacity: 1;
  }
  #team .descActive {
    opacity: 1;
  }
}
/* -------------------------------------------------------------------------------- PARTENAIRES */
#partenaires #partenairesSlides {
  max-width: 700px;
  margin: auto;
}
#partenaires #partenairesSlides .carousel-indicators {
  margin: 0;
}
#partenaires #partenairesSlides .carousel-indicators li {
  cursor: pointer;
  background-color: white;
  opacity: 0.5;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin: 0.5em 1em;
}

#partenaires,
#partenaires .carousel-inner {
  padding-bottom: 1.5em;
}

#partenaires .carousel-item {
  min-height: 64px;
}

/* -------------------------------------------------------------------------------- CONTACT */
#contact {
  background: url("/images/videos/diapo/slide-1.jpg") no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}
#contact form {
  margin: auto;
  max-width: 550px;
}
#contact .objetSelect {
  margin: auto;
}
#contact p {
  width: 100%;
  text-align: justify;
  padding-top: 10px;
  font-style: italic;
  color: #f2f2f2;
}
#contact label {
  width: 100%;
  text-align: right;
  font-size: 0.8em;
  padding-top: 0.5em;
  vertical-align: bottom;
}
#contact select option:hover {
  background-color: #22262b;
  color: #ce7a82;
}
#contact select option:first-child {
  color: var(--gris1);
}
#contact .form-group {
  margin-bottom: 0;
}

.send .bouton {
  display: block;
  width: 120px;
  font-weight: bold;
  box-shadow: none;
  margin: 30px auto;
  padding: 10px;
  border-radius: 50px;
  background-color: #f2f2f2;
  color: #ce7a82;
  text-decoration: none;
  text-align: center;
  transition-property: background-color;
  transition-duration: 0.3s;
}
.send .bouton:hover {
  background-color: #ce7a82;
  color: #f2f2f2;
  text-decoration: none;
  cursor: pointer;
}

/* -------------------------------------------------------------------------------- MAPS */
#maps .mapsContent {
  padding-bottom: 3em;
  max-width: 550px;
  margin: auto;
}
#maps .adressMaps {
  padding-bottom: 1em;
}
#maps .adressMaps div, #maps .adressMaps p {
  display: flex;
}
#maps .adressMaps .iconAdress {
  font-size: 30px;
  color: #ce7a82;
}
#maps .adressMaps .iconAdress i {
  font-size: 1em;
}
#maps .adressMaps p {
  font-size: 17px;
  padding: 10px;
  text-align: left;
  font-weight: 700;
}
#maps #carte {
  width: 100%;
  height: 550px;
  margin: auto;
}

/* -------------------------------------------------------------------------------- MENTIONS LEGALES */
#mentions {
  padding-bottom: 2vh;
}
#mentions h2 {
  font-size: 1.8rem;
}

/* -------------------------------------------------------------------------------- PROVISOIRE */
.temp {
  display: none;
}

.desactive {
  display: none;
}

.info-important {
  position: fixed;
  top: 66px;
  left: 0;
  width: 100%;
  z-index: 999;
  padding: 1em;
  background: #ce7a82;
  border: none;
  border-radius: 0;
  color: #f2f2f2;
  font-weight: bold;
}
.info-important p:first-child {
  padding-bottom: 1em;
  font-size: 1.4em;
}