/* SAFARI attention aux comportements et apparence par défaut sur button et input avec type =["submit"] type =["button"] etc... déja intégré pour input[type=checkbox] */
/* Important spécial Safari correction comportement row bootsrap 4*/
.row:before,
.row:after {
  display: none !important;
}

/* Définition de variables à réintégrer dans des classes */

:root {
    --font-title: 'Roboto', sans-serif;
    --font-text: 'Inter', sans-serif;
  
    /* Fontsize button à harmoniser */
    --font-size-normale-header: 16px;
    --font-size-normale-footer: 1.5rem;
  
    /* Définition d'une palette de couleurs  */
  
    /* Définition de distance */
    --normal_px: 4px;
    --fin_px: 2px;
    --xl_px: 10px;
  
    --color-mainText: #304E67;
    --color-pageBG:   #F8F4ED;

    --color-mainText2: #fff9e8;
    --color-text-dark: #3C5E9F;
    --color-text-light: #F8F4ED;
    --color-hr: linear-gradient(to right, #2490D7, #A998EE);
    --color-hover: #2490D7;
    --color-btn: #A998EE;
    --color-btn-transparent: #a998ee75;
    --color-muted: #6c757d;

    --mainGradient : linear-gradient(to right, #2490D7, #A998EE);
    --topGradient : linear-gradient(to top, #2490D7, #A998EE);
    --downGradient : linear-gradient(to bottom, #2490D7, #A998EE);

    --transition: ease-in-out 0.2s;
    --transition-long: ease-in-out 0.4s;

  }


  .bg-bluedark {
    background-color: var(--color-text-dark);
  }
  .bg-maingradiant {
    background: var(--mainGradient);
  }
  .bg-secondgradiant {
    background: var(--topGradient);
  }
  .bg-btn-light {
    background-color : var(--color-btn-transparent);
  }
  .color-maintxt {
    color: var(--color-mainText);
  }
  .color-maintxt2 {
    color: var(--color-mainText2);
  }
  .color-btn {
    color: var(--color-btn);
  }
  .bg-btn {
    background-color: var(--color-btn);
  }
  .border-violet {
    border: 2px solid var(--color-btn);
    /* min-width: 530px; */

  }
  
  .border-drk {
    border: var(--color-hover) 1px solid;
  }
  .fs-mid {
    font-size: 1.5rem;
  }

  .bord-rad10 {
    border-radius: 10px;
  }
  .bord-rad20 {
    border-radius: 20px;
  }

    /* Container holding the image and the text */
    .containerheader {
        position: relative;
        text-align: center;
        color: white;
        /* margin-top: 73px; */
        margin-bottom: 10px;
        width: 100%;
    }

    /* Centered text */
    .centered {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        /* Ajout */
    }

    div.sticky {
        position: -webkit-sticky;
        /* Safari */
        position: sticky;
        /* anunler le z-index sinon recouvre le footer */
        /* z-index: 100; */
        top: 0;
    }

    /* .dropdownlist {
        Background pattern from Toptal Subtle Patterns 
        height: 400px;
        width: 100%;
    }
 */
    body {
        font-family: var(--font-text);
        color: var(--color-mainText);
        background-color: var(--color-pageBG);  
    }

    /* Paragraphes CK Editor */
.no-padding_paragraph p {
  margin: 0 !important;
  padding-bottom: 0 !important;
}
/* HEADER */
#navbarMainMenuToggler {
    opacity: 0.9;
    background: var(--mainGradient);
  }
  #navbarMainMenuToggler:hover,
  #navbarMainMenuToggler:active {
    transition: var(--transition);
  }
  #desktopUpperMenu  {
    height: 3rem;
  }
  #desktopUpperMenu .navbar-brand {
    position: relative;
    top: -12px;
    margin-left: 10px;
  }
  .logoHeader {
    max-width: 70%;
    min-width: 4vw;
    position: relative;
    left: 12px;
  }
  #desktopUpperMenu a, #mobileUpperMenu a {
      color: white;
      border: transparent 2px solid;
      border-radius:5px;
  }
  #desktopUpperMenu a:hover, #mobileUpperMenu a:hover {
    color: var(--color-pageBG);
    border: var(--color-pageBG) 2px solid;
    text-decoration: none;
    transition: var(--transition);
    background: var(--color-text-dark);
}
#desktopUpperMenu a:active, #desktopUpperMenu a:focus,#mobileUpperMenu a:focus, #mobileUpperMenu a:active {
    color: var(--color-hover);
    border: var(--color-pageBG) 2px solid;
    background-color: var(--color-btn);
    text-decoration: none;
    transition: var(--transition);
}

#navbarDropdownPresentation .dropdown-menu .dropdown-item:hover {
  color: var(--color-hover) !important;
}

.header_connexion_btn {
  width: 14rem;
}

/* FOOTER */
footer {
  z-index: 300;
position: relative;
}
.footer-link {
  color: var(--color-text-dark);
}
.footer-link:hover {
  border-radius: 5px;
  border: none;
  color: var(--color-pageBG);
  background-color: var(--color-btn);
  transition: var(--transition);
}
.logoFooter {
  opacity: 0.9;
  width: 13%;
  margin-bottom: 0.5rem;
}
.logoFooter:hover {
  opacity: 1;
  transition: var(--transition );
}

/* HOME PAGE*/
#mainCenterLogo {
    background-image: url("/img/assets/logo_Main.png");
    height: 131px;
    background-size: contain;
    width: 163px;
    background-repeat: no-repeat;
    position: absolute;
    top: 49%;
    left: 44%;
    z-index: 3;
}
#herobanner-bg, .bg_img_Droits {
    background-size: cover;
    background-position: center;
    height: 670px;
    /* min-width: 443px; */
    /* min-width: 550px; */
    background-repeat: no-repeat;
    border-radius: 0 0 15px 15px;
}
.bg_img_Droits {
  /* background-position: 0px -18rem; */
}
.activite_inHome h2{
  font-size: 1.4rem;
  color: var(--color-btn);
}
.activite_inHome h2 a {
  color: var(--color-btn);
}
.activite_inHome h2 a:hover {
  color: var(--color-hover);
  text-decoration: none;
  transition: var(--transition);
}
.activite_inHome {
  width: 20rem; 
  height: 24rem;
}
.activite_inHome img { 
  max-height: 13.5rem;
}

@media  screen and (max-width:1209px) {

  #dropdownlist > li.nav-item.mx-1.mr-5 > a{
    font-size: 17px;
    width: 12vw;
  }
}
@media  screen and (min-width:1210px) and (max-width: 1400px) {
  #dropdownlist .cta_button, #navbarDropdownPresentation {
    width: 13rem;
  }
 }

 @media  screen and (min-width:1400px){
     #dropdownlist .cta_button, #navbarDropdownPresentation {
    width: 15rem;
  }
  #dropdownlist > li.nav-item.mx-1.d-flex.align-items-center.ml-5{
    margin-left: 15vw;
  }
 } 
/*  
@media  screen and (max-width:1114px) {

    #dropdownlist .cta_button, #navbarDropdownPresentation {
      width: auto;      
    }

    #dropdownlist .cta_button, #navbarDropdownPresentation  a{
      font-size: 1rem!important;
      height: 40px;
      min-width: 215px;

    }

    #dropdownlist > li.nav-item.mx-1.d-flex.align-items-center.ml-5{
      overflow: auto;
    }

} */ 
  /* #dropdownlist .cta_button, #navbarDropdownPresentation {
    width: 15rem;
  } */
  .cta_button:hover, .cta_button:active, .cta_button:focus {
    color: var(--color-text-dark);
    background-color: var(--color-hover);
    text-decoration: none;
    transition: var(--transition);
  }
  .cta_button .dropdown-menu {
  
    background: var(--color-btn);
  }
  .cta_button .dropdown-menu a {
    color: var(--color-text-dark);
  }

  /* OTHER PAGES */

  .my_hr {
    height: 2px;
    background: var(--color-hr);
    /* ajouter class py-1 pour hr plus larges */
  }
  .hr-almond {
    height: 1px;
    background:var(--color-mainText2);;
  }
  .page-container {
    /* margin-top: 73px; */
   

  }
  .page-container h1, .page-container h2, .page-container h3 {
    text-align: center;
  }

  .reservation-link {
    color: var(--color-btn);
  }
  .reservation-link:hover {
    color: var(--color-hover);
  }

  .page-container table {
    color:var(--color-mainText);
  }
  .page-container h2 {
    font-size: 1.5rem ;
  }
  .page-container h3 {
    font-size: 1.5rem ;
  }
  .img-location {
    min-height: 17rem;
  }

  .img-activite {
    max-height: 33rem !important;
  }
  .product_img {
    min-width: 100%;
  }
  .pages-top_img { 
    height:180px;
  }


  .bg_activite {
    background-image: url('/img/bg-mix-resized.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    height: 35rem;
    /* background-position: 0px -294px */
  }
  @media (min-width: 1277px){
      .bg_activite {
    background-size: cover;
    background-repeat: no-repeat;
    height: 35rem;
    background-position: 0px -294px;
    /* border-radius: 50px!important; */
  }
  }
  .activite-presentation h2 {
    /* border :#C5665C 4px solid;
    background: #C5665C; */
    color: var(--color-pageBG);
  }
  .activite-info {
    background: var(--color-pageBG);
    z-index: 1000;
  }
  /* .activite-info h3 {
    text-decoration: 2px underline var(--color-mainText);
  }
  .outline-container {
    outline: 6px solid #83413A;
    outline-offset: -42px;
  } */
  .activite_tarif {
    font-size: 1.3rem;
  }


/* animation reflet */
  .shine div {
    position: relative;
  }
  .shine div::before {
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg);
  }
  .shine div:hover::before {
    -webkit-animation: shine 1.5s;
    animation: shine 1.5s;
  }
  @-webkit-keyframes shine {
    100% {
      left: 125%;
    }
  }
  @keyframes shine {
    100% {
      left: 125%;
    }
  }

  .location-carousel-card {
    /* min-height: 25rem; */
    border: 0;
  }
  .location-carousel-card .card-body {
    flex-direction: column;
  }
  .location-carousel-card .card-title {
    font-size: 1.25rem;
    text-transform: uppercase;
  }
  /* .location-carousel-card:hover .location-carousel-card.card-img-top {
    
background-color: #ce612c80;
background-blend-mode: overlay;
    transition: var(--transition);
  } */
  
  .location-carousel-card .card-img-top {
    height: 15rem;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
  }

  #location-carousel-card:hover #location-carousel-card-img{
    background-color: #6b64ac80;
    background-blend-mode: overlay;
    animation-name: progressiveZoom;
    animation-duration: 1.2s;
    animation-timing-function: ease-in-out;
  }
  /* Animation background-size, pour chagementde taille progressive */
@keyframes progressiveZoom {
  0% {
    background-size:100%;
  }
  
  100% {
    background-size: 124%;
  }
}
  .location-list-card:hover {
    background: linear-gradient(to right, #6b64ac80, #F8F4ED);
    transition: var(--transition);
  }


/* Buttons */
.return-btn {
  border-radius: 10px;
  text-transform: uppercase; 
}
.return-btn:hover, .return-btn:hover a {
  transition: var(--transition);
  background-color: var(--color-btn);
  color: white;
  text-decoration: none;
}
#myTopBtn {
  display: none;
  background-color: var(--color-pageBG);
}
.topBtnLink {
  position: fixed;
  bottom: 123px;
  right: 20px;
  z-index: 1000;
  cursor: pointer;
}
.topBtnLink img {
  position: relative;
  top: -3px;
  transition-duration: 1s;
  transition-delay: 1ms;
  width: 20%;
  margin: auto;
}

.topBtnLink a:hover {
  text-shadow: 0px 0px 8px var(--color-hover);
  transition: var(--transition);
}
#myTopBtn:hover #topBtnLink_img {
  text-shadow: 0px 0px 8px var(--color-btn);
  top: -40px;
  margin: auto;
}

.btn-mainBtnColor {
  box-shadow: 0px 1px 0px 0px var(--color-btn);
}
.btn-mainBtnColor:hover {
  transition: var(--transition);
  box-shadow: 0px 1px 7px 1px var(--color-hover);
  text-decoration: none;
  transform: scale(1.1);
}
.btn-mainBtnColor:active {
  background-color: var(--color-text-dark);
  box-shadow: 4px 4px 4px 0px var(--color-mainText);
  transform: translateY(4px);
}

.formSubmit:hover {
  background-color: var(--color-text-dark);
  transition: var(--transition);
  box-shadow: 0px 1px 7px 1px var(--color-btn);
  text-decoration: none;
  transform: scale(1.05);
}


/* Owl Carousel, alternative aux carousel Bootsrap; permet de configurer plusieurs images dans une slide; nécessite js voir layout/default.ctp  */
/* def Owl Carousel  */
.owl-prev {
  left: -60px;
}
.owl-next {
  right: -60px;
}
.owl-prev,
.owl-next {
  position: absolute;
  top: 30%;
  background: transparent !important;

}
.owl-prev span,
.owl-next span {
  font-size: 60px;
  color: var(--color-hover) !important;
}


/* Connexion modal */
#connexionModal {
  margin-top: 14rem;
  margin-bottom: 16.5rem;
}
#connexionModal > div { 
  width: 95%;
}
#connexionModal .nav-pills .nav-link.active {
  background-color:var(--color-text-dark);
}
#connexionModal .nav-pills .nav-link {
  background-color:var(--color-btn-transparent); 
}

#forgotpsw_link {
  color: var(--color-text-dark);
}
#forgotpsw_link:hover {
  color: var(--color-mainText);
  text-decoration: none;
}

.icon-psw {
  /* position: relative;
  top: 7px;
  right: 12px; */
  position: absolute;
  top: 5px;
  right: 22px;
}
.edit_icon-psw {
  position: absolute;
  top: 34px;
  right: 22px;
  
}

.border-drk {
  border: var(--color-hover) 1px solid;
}
#searchResult {
  min-height: 23rem;
}

/* Contact Page */
.contactPage, #editUser, #searchResult {
  margin-top: 11rem;
  margin-bottom: 8.5rem;
}
/* mes infos Page */
#user_infos {
  margin-top: 7rem;
  margin-bottom: 8.5rem;
}

.info1 {
  border-bottom: none;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
}
.info2 {
  border-top: none;
  border-top-left-radius: 0px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}
.edit-link::after {
  font-family: "Font Awesome 5 Free"; 
	font-weight: 400;
  content: "\f044";
  margin: 10px;
}
.cart-link::after {
  content: url("/img/assets/Icon_awesome-shopping-cart.svg");
  margin: 10px;
}
.info_section {
  background: linear-gradient(to right, var(--color-text-dark)78%, #1947b3);
}

/* PRESENTATION Page */
.trobino-title {
  color: var(--color-mainText2);
}
.info_message {
  background: var(--topGradient);
}
.info_message p{
  font-size: 1.5rem;
}
.info_message img{
  width: 50%;
}

.trombino > img  {
  width: 100%;
height: auto;
aspect-ratio: attr(width) / attr(height); /*  not working on firefox ? */
aspect-ratio: 286 / 286;
max-height: 286px;
}

/* PV Page */
#pv-pdf.toolbar {
  display: none !important;
}

/* COMMISSION Page */
.commission_img {
height: 15rem;
}


body {
  -webkit-user-select: none !important;
  -moz-user-select: -moz-none !important;
  -ms-user-select: none !important;
  user-select: none !important;
  }

/* VOS DROITS Page */
.resume_img {
  background-size: cover;
  background-repeat: no-repeat;
  height: 27rem;
}
/* LEGALES Page */
.page_legales {
  margin-top: 13rem;
  margin-bottom: 6rem;
}
.img-droits-pv-commissions {
  height: 10rem;
}

@media  screen and (max-width:414px) {
  #navbarMainMenuToggler {
    opacity: 1;
    height: 73px;
    border-bottom-right-radius: 26px;
    border-bottom-left-radius: 0px;
  }
  .bg_img_Droits {
    background-position: center;
  }
  .resume_img {
    height: 13rem;
  }
  .page_legales {
    margin-top: 7rem;
  }
  #mainCenterLogo {
    left: 32%;
  }
  #location_table {
    font-size: small;
  }

  #user_infos h1 {
    font-size: 1.5rem;
    text-align: center;
    padding: 1rem;
  }
  #cart {
    font-size: small;
  }
  .activite_tarif {
    font-size: 1rem;
  }

  .topBtnLink img {
    width: 50%;
  }
}

  .copy-input{
    border: none;
    text-align: center;
    align-items: center;
    cursor: pointer;
    outline: none;
  }

  /* button header*/
  .navbar-toggler{
    margin-right: 10px!important;
  }
  /*search cards*/
.owl-item{
  margin-right: 2px;
  margin-bottom: 10px;
  min-width: 338px!important;
}
.owl-nav {
  display: none;
}



/* navbar */
/* #centralNavBar{
  width: 100%;
} */



/* #dropdownlist{
  margin-left: -10vw;
  width: 50vw;
  padding-left: -20vw;
  padding-right: 30vw;
  margin-right: 30vw;
  flex: none;
  display: none;
} */

#strcontact{

    font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
     margin-top: -75px;
  margin-bottom: 30px;
    box-sizing: border-box;
    text-align: center;
    align-items: center;
    border-radius: 8px;
    color: #ffffff;
    border-color: #23923d;
    background: #23923d;
    height: 8vh;
}

#strcontacterror{
    font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
     margin-top: -75px;
  margin-bottom: 30px;
    box-sizing: border-box;
    text-align: center;
    align-items: center;
    border-radius: 8px;
    color: #ffffff;
    background: #dc3545;
    border-color: #d32535;
    height: 8vh;
}