/**
* Template Name: JCC 2022/
* Author: Essia MTIRI
*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
 /*.mar50 { padding-right: -50px !important;}*/
:root {
   --noir : #000;
	
    --blanc : #fff;
    --rouge : #c2272d ;
    --jaune : rgba(255, 204, 0, 1);
    --jaune2 : rgba(255, 191, 0, 1);
  --colorText : rgba(49, 49, 49, 1);
    --gris : #e1dee1 ;
	--bleu : #245273 ;
  }
  .blanc {color: var(--blanc) !important }
  .rouge {color: var(--rouge);}
  .jaune{color:var(--rouge) !important; }
.titre-bleu { color: var(--bleu);}

  /*.size20 { font-size: 20px !important;}*/
  .espaceSeparation{ font-size: 20px !important; margin-top: -15px;     font-weight: bold;}
  .retour1 { clear: both;}

.border-bas { border-bottom:#666 dotted 1px;  padding-bottom:5px;} 

  body {
    font-family: "Poppins", sans-serif;
    color: var(--colorText);
  }

  .p-top-separation {
    padding-top: 40px !important;
  }
  body ::selection {
  background-color: var(--rouge) !important;  
  }
  a {
    text-decoration: none;
    color: var(--noir);
    padding: 0px 3px 0px 2px;
  }
  .media.d-block img.avatar-2{
    padding: 0 13px 0px 0px;
  }
  a:hover {
    color: var(--noir);
    text-decoration: none;
  } 
  .social-links2  a {
    text-decoration: none;
    color: var(--rouge) !important;
  }
  
  .social-links2 a:hover{
    color: var(--rouge);
    text-decoration: none;
  } 
 


.card-body > .imgGris {
				  filter: grayscale(10%);
			}

.card-body > .imgGris:hover {
				
				  filter: grayscale(100%);
			}



  .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
    padding-right: var(--bs-gutter-x,0);
    padding-left: var(--bs-gutter-x, 0);
  }
 .mtop15 {margin-top: -15px !important ;}
  .fonteSize50 {font-size: 50px; }
  h1, h2, h3, h4, h5, h6 {
    font-family: "Poppins", sans-serif;
  }
  h1 {
    /*font-size: 40px;*/
    line-height: 30px;
    letter-spacing: -0.03 em; 
    font-weight: 700;
  }
  h2 {
   /* font-size: 30px;*/
    line-height: 30px;
    letter-spacing: -0.03 em; 
    font-weight: 600;
  }
  h3 {
   /* font-size: 18px;*/
    line-height: 30px;
    letter-spacing: -0.01 em; 
    font-weight: 500;
  }
  h4 {
    /*font-size: 15px;*/
    line-height: 30px;
    letter-spacing: 0 em; 
    font-weight: 500;
  }
  h5 {
   /* font-size: 13px;*/
    line-height: 30px;
    letter-spacing: 0 em; 
    font-weight: 500;
  }
  h6 {
   /* font-size: 12px;*/
    line-height: 30px;
    letter-spacing: 0.05 em; 
    font-weight: 500;
  }
  .p-top200 { padding-top: 200px; }

  main { min-height: 700px;}
  .lienJauneBlanc a {
  color: var(--rouge) !important;
  text-decoration: none;
  }
  .lienJauneBlanc a:hover {
  color: var(--blanc) !important;
  text-decoration: none;
  } 
  .lienNoir a {color: #f51818 !important; text-decoration:none; }
  .lienNoir a:hover{color: var(--rouge) !important; text-decoration:none !important; }
  .lienBlanc a {color: var(--blanc) !important; text-decoration:none; }
  .lienBlanc a:hover{color: var(--rouge) !important; text-decoration:none !important; }
  a .lienNoir1 {color: #f51818 !important; text-decoration:none; }
  a:hover .lienNoir1 {color: #f51818 !important; text-decoration:none !important; }
  
  a .lienGris1 {color: var(--colorText) !important; text-decoration:none; }
  a:hover .lienGris1 {color:  var(--rouge)  !important; text-decoration:none !important; }

  .lienBleu a {color: #245273 !important; text-decoration:none; }
  .lienBleu a:hover{color:#0e619d !important; text-decoration:none !important; }

  .lienBleu1 a {color: #245273 !important; text-decoration:none; }
  .lienBleu1 a:hover{color:#b49244/*#cfac5c*/ !important; text-decoration:none !important; }


.bg-bege {background-color: #bfae88;}

  .buttonStyle {
    background: var(--rouge); 
    border: 0;
    padding: 10px 24px;
    color: #fff;
    transition: 0.4s;
    text-transform: uppercase;
    /*border-radius: 50px;*/
  }
  .buttonStyle:hover {
    background: #fcb802;
  }
  
  /*--------------------------------------------------------------
  # Top Bar
  --------------------------------------------------------------*/
  #topbar {
    /*padding: 0;*/
    font-size: 15px;
    height: 90px;
    transition: all 0.5s;
    z-index: 996;
    padding: 10px 0 !important;
   }
  #topbar.topbar-transparent {
    background: var(--gris);
  }
 .separation {
   border-bottom: 2px solid var(--gris);
   padding-bottom: 10px;
  }
  #topbar.topbar-scrolled {
    top: -90px;
  }
 #topbar i {
    color: var(--rouge);
    line-height: 0;
  }
  #topbar i span {
    color: #fff;
    font-style: normal;
    padding-left: 5px;
  } 

  /*--------------------------------------------------------------
  # Header
  --------------------------------------------------------------*/
  #header {
    top: 88px;
    height: auto;
    z-index: 997;
    transition: all 0.5s;
    padding: 10px 0;
   background-color: var(--noir);  
  }
  #header.header-transparent {
    background-color: var(--rouge); /* background: transparent;*/
  }
  #header.header-scrolled {
    top: 0;
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(194,31,31,1) 33%, rgb(173 176 177) 100%);
  }
  /*#header .logo h1 {
    font-size: 28px;
    margin: 0;
    line-height: 1;
    font-weight: 400;
    letter-spacing: 3px;
  }*/ 
   #header .nav-link {
    display: block;
    /*padding: 0.5rem 1rem; */
    color: var(--blanc);
    text-decoration: none;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
  } 

  #header .nav-link a:hover, nav-link:focus {
    color: var(--rouge);
  } 
/*#header .myButtons{ color:#FFF !important; background-color: transparent; }*/

 #header .myActiveButton {
    color: var(--blanc) !important;
    /*border-bottom: var(--rouge) 5px solid;*/
    /*margin-bottom: -6px;*/
   	background-color: var(--rouge);
    padding: 15px 5px;
  }  
  /*#header .myActiveButton {
    color: var(--blanc) !important;
    border-bottom: var(--rouge2) 5px solid;
    margin-bottom: -15px;
    background-color: var(--rouge);
    padding: 10px 5px;
  }*/
  /*.myActiveButton a { color: #0F0 !important}
  .myActiveButton:hover { color:#000 !important}
  .myActiveButton:a { color: #0F0 !important}*/

  #header .navbar li a:hover {
    color: var(--noir);
  } 
  #header .navbar p {
    color: var(--rouge) !important;
  }
  #header .logo img {
    padding: 0;
    margin: 0;
    max-height: 115px;
  }
  #ban {
    padding-top: 250px;
    height: 120px;
  }



  /*--------------------------------------------------------------
  # banAffiche
  --------------------------------------------------------------*/
.banAffiche {padding-top: 120px; }

  /*--------------------------------------------------------------
  # Navigation Menu
  --------------------------------------------------------------*/
  /**
  * Desktop Navigation 
  */
  .navbar {
    padding: 0;  
  }
  .navbar ul {
    margin: 0;
    padding: 0;
    display: flex;
    list-style: none;
    align-items: center;
  }
  .navbar li {
    position: relative;
  }
  .navbar a, .navbar a:focus {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0 10px 0px;
    font-size: 14px;
    line-height: 30px;
    font-weight: 500;
    color: white; 
    white-space: nowrap;
    transition: 0.3s;
    text-transform: uppercase;
  }
  .navbar a i, .navbar a:focus i {
    font-size: 12px;
    line-height: 0;
    margin-left: 5px;
  }
  .navbar a:hover, .navbar .active, .navbar .active:focus, .navbar li:hover > a {
    color: var(--rouge);
  }
  .navbar .dropdown ul {
    display: block;
    position: absolute;
    left: -21px; /*24px;*/
    top: calc(100% + 30px);
    margin: 0;
    padding: 10px 0;
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    background: var(--rouge);
   padding-top: 10px;
    box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
    transition: 0.3s;
    border-radius: 4px;
  }
  .navbar .dropdown ul li {
   /* min-width: 200px;*/
    width: auto ;
  }
  .navbar .dropdown ul a {
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 400;    /*color: #433f39;*/
    color:var(--blanc);
  }
  .navbar .dropdown ul a i {
    font-size: 12px;
  }
  .navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a {
    color: var(--rouge);
  } 
  .navbar .dropdown:hover > ul {
    opacity: 1;
    top: 100%;
    visibility: visible;
  }

  .navbar .dropdown .dropdown ul {
    top: 0;
    left: calc(100% - 30px);
    visibility: hidden;
	 bootom : 50px;
 
  }

  .navbar .dropdown .dropdown ul li {
    height: 35px !important;
 
  }

  .navbar .dropdown .dropdown:hover > ul {
    opacity: 1;
    top: 0;
    left: 100%;
    visibility: visible;
  }
  @media (max-width: 1366px) {
    .navbar .dropdown .dropdown ul {
      left: -90%;
    }
    .navbar .dropdown .dropdown:hover > ul {
      left: -100%;
    }
  }
   /*--------------------------------------------------------------
  # Mobile Navigation 
  --------------------------------------------------------------*/ 
  .mobile-nav-toggle {
     color:var(--blanc);
    font-size: 28px;
    cursor: pointer;
    display: none;
    line-height: 0;
    transition: 0.5s;
  }  
  @media (max-width: 991px) {
      .navbar li{
          background: #868386;
      }
      #header .myActiveButton {
   
            padding: 15px 19px !important;
        }
      
    .mobile-nav-toggle {
      display: block;
      color:var(--blanc);
    }  
    .navbar ul {
      display: none;
    }
  }
  .navbar-mobile {
    position: fixed;
    overflow: hidden;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(39, 37, 34, 0.9);
    transition: 0.3s;
    z-index: 0;
  }
  .navbar-mobile .mobile-nav-toggle {
    position: absolute;
    top: 15px;
    right: 15px;
  }
  .navbar-mobile ul {
    display: block;
    position: absolute;
    top: 55px;
    right: 15px;
    bottom: 15px;
    left: 15px;
    padding: 10px 0;
    border-radius: 8px;
    background-color: #fff;
    overflow-y: auto;
    transition: 0.3s;
    color:var(--colorText) !important;
  }
  .navbar-mobile a, .navbar-mobile a:focus {
    padding: 10px 20px;
    font-size: 15px;
    color: var(--colorText) !important;
  }
  .navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a {
    color: var(--rouge);
  }
  .navbar-mobile .getstarted, .navbar-mobile .getstarted:focus {
    margin: 15px;
  }
  .navbar-mobile .dropdown ul {
    position: static;
    display: none;
    /*margin: 10px 20px;*/
    padding: 10px 0;
    z-index: 99;
    opacity: 1;
    visibility: visible;
    background: var(--blanc);
    color:var(--colorText);
    box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  }
  .navbar-mobile .dropdown ul li {
    min-width: 200px;
    color:var(--noir);
  }
  .navbar-mobile .dropdown ul a {
    padding: 10px 20px;
    color:var(--colorText);
  }
  .navbar-mobile .dropdown ul a i {
    font-size: 12px;
  }
  .navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a {
    color:  var(--rouge);
  }
  .navbar-mobile .dropdown > .dropdown-active {
    display: block;
    background: #868386;
  }
 
  /*--------------------------------------------------------------
  # Hero Section
  --------------------------------------------------------------*/
  #hero  {
    height: 60vh; /* height: 100vh; size image slide */ 
    width: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden;
    margin-top:140px;
  } 
  .float-end1 {
    margin-top: -70px;
    margin-right: -340px;
    margin-bottom: 30px;
  } 
.float-end2 {
  margin-top: -70px;
  margin-bottom: 30px;
  text-align: right !important;
  }
.float-end2 img, svg {
  vertical-align: top !important;
  margin-top:-100px;
  margin-right: 75px;
  }
  .carousel-background {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
  }
  #hero .carousel-item {
    width: 100%;
    height: 80vh; /* height: 100vh; size image slide */ 
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /*clear: both !important;*/
  }
  #hero .carousel-item::before {
    content: "";
   /* background-color: rgba(12, 11, 10, 0.5);*/
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
  }
  #hero .carousel-container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
  }
  #hero .carousel-content {
    text-align: center;
    padding:20px;
  }
  #hero h2 {
    /*font-family: 'Montserrat', sans-serif;*/
    font-family: "Poppins", sans-serif;
    text-shadow: rgb(0 0 0 / 50%) 2px 1px 0px;
    color: var(--rouge);
    margin-bottom: 30px;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 57px;
  }
  #hero h3 {
    /*font-family: 'Montserrat', sans-serif !important;*/
    font-family: "Poppins", sans-serif;
    color: #fff;
    text-shadow: rgb(0 0 0 / 60%) 2px 1px 0px;
    margin-bottom: 30px;  
   margin-top: -38px;
    line-height: 55px;
    letter-spacing: 0px;
    font-weight: 400;
    font-size: 34px;
    }
  #hero p {
    width: 80%;
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
    margin: 0 auto 30px auto;
    color: #fff;
  }
  #hero .carousel-inner .carousel-item {
    transition-property: opacity;
    background-position: center top;  
      background-size: cover;
     /* background-position: center center;*/
      background-repeat: no-repeat;  
  }
  #hero .carousel-inner .carousel-item,
  #hero .carousel-inner .active.carousel-item-start,
  #hero .carousel-inner .active.carousel-item-end {
    opacity: 0;
  }
  #hero .carousel-inner .active,
  #hero .carousel-inner .carousel-item-next.carousel-item-start,
  #hero .carousel-inner .carousel-item-prev.carousel-item-end {
    opacity: 1;
    transition: 0.5s;
    background-size: cover !important;
      background-position: center center;
      background-repeat: no-repeat !important;
	  }
  #hero .carousel-inner .carousel-item-next,
  #hero .carousel-inner .carousel-item-prev,
  #hero .carousel-inner .active.carousel-item-start,
  #hero .carousel-inner .active.carousel-item-end {
    left: 0;
    transform: translate3d(0, 0, 0);
  }
  #hero .carousel-control-next-icon, #hero .carousel-control-prev-icon {
    background: none;
    font-size: 30px;
    line-height: 0;
    width: auto;
    height: auto;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50px;
    transition: 0.3s;
    color: rgba(255, 255, 255, 0.5);
    width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #hero .carousel-control-next-icon:hover, #hero .carousel-control-prev-icon:hover {
    background: rgba(255, 255, 255, 0.3);
    color: rgba(255, 255, 255, 0.8);
  }
  #hero .carousel-indicators li {
    cursor: pointer;
  }
  #hero .btn-menu, #hero .btn-book {
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    display: inline-block;
    padding: 12px 30px;
    border-radius: 50px;
    transition: 0.5s;
    line-height: 1;
    margin: 0 10px;
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
    color: #fff;
    border: 2px solid var(--rouge); 
  }
  .carousel-indicators [data-bs-target] {
    background-color: transparent !important;
  }
  #hero .btn-menu:hover, #hero .btn-book:hover {
    background: var(--rouge);
    color: #fff;
  }


  /*--------------------------------------------------------------
  # Sections General
  --------------------------------------------------------------*/
  section {
    padding: 10px 0;
  }
    .section-bg {
    background-color: white;
  }
    .section-title {
    text-align: center;
    /*padding-bottom: 30px;*/
  }
  .section-title h1 {
    margin: 15px 0;
    font-weight: 700;
    color: #5f5950;
    text-transform: uppercase;
    /* font-size: 32px;*/
  }
  .section-title h2 {
    margin: 15px 0;
    font-weight: 700;
    color: #5f5950;
    text-transform: uppercase;
    /* font-size: 32px;*/
  }
  .section-title h1 span {
    color: var(--rouge); 
  }
  .section-title h2 span {
    color: var(--rouge); 
  }

  .section-title p {
    margin: 15px auto 0 auto;
    font-weight: 300;
    font-size: 1.2rem;
  }

/*--------------------------------------------------------------
# Home direction générale
--------------------------------------------------------------*/
  .homeEdito {
    background-color: transparent ;
    padding-left: 10px; padding-right:10px;
  }
  .homeEdito h5 {
    text-align: center;
    /*font-size:15px; */
  }
  .homeEdito p {
    text-align: justify;
    padding: 10px;
    min-height: 110px;
  }
  .homeEdito img {
    max-width: 100%;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.3);
  }
  .homeEdito .gris {
    color: var(--gris);
  }
  .text-center-img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);   
  }
  .btn-jaune {
    color: var(--blanc); 
  /* background-color: var(--rouge);
    display: block;
    justify-content: center;
    align-items: center;*/
  }
  .btn-jaune a{
    color: var(--blanc); 
    background-color: var(--rouge);
    border-radius: 0;
    text-transform: uppercase;
    padding: 7px 10px;
  }
  .btn-jaune a:hover {
    color: var(--blanc); 
    background-color: var(--rouge);
  }

/*--------------------------------------------------------------
  # saveDate
  --------------------------------------------------------------*/
  .saveDate .box {
    padding: 40px 30px;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
   /* transition: all ease-in-out 0.3s;*/
    height: 100%;
   background-color: var(--rouge);
    color:var(--blanc);
  }
  .saveDate .box span {
    display: block;
    font-size: 18px; /* 28px font-weight: 700; color: var(--rouge);*/
    font-weight: 400;
    color:var(--blanc);
    text-align: center; 
    text-transform: uppercase;
  }  
  .saveDate .box h2 {
    /*font-family: 'Montserrat', sans-serif;*/
    font-family: "Poppins", sans-serif;
    line-height: 40px;
    font-weight: 600;
    padding: 0;
    margin: 100px 0 20px 0;
    color: var(--blanc);
	  text-transform: uppercase;
    text-align: center; 
    height: 100px;
    justify-content: center !important;
    align-items: center !important;
    display: flex;
    /*font-size: 29px;*/
  }
  .saveDate .box h3 {
    /*font-family: 'Montserrat', sans-serif;*/
    font-family: "Poppins", sans-serif;
    /*font-size: 19px;*/
    padding: 0;
    color: var(--blanc);
    height: 90px;
    justify-content: center !important;
    align-items: inherit;
    display: flex;
    text-transform: uppercase;
  }
  .saveDate .box h5 {
    /*font-family: 'Montserrat', sans-serif;*/
    font-family: "Poppins", sans-serif;
    /*font-size: 14px; */
    padding: 0;
    margin: 0;
    color: var(--blanc);  
    /*height: 70px;*/
    justify-content: center !important;
    align-items: center;
    display: flex;
    text-transform: uppercase;
  }
  .saveDate .box p {
 	color: var(--colorText);
    font-size: 15px;
    margin: 0;
    padding: 0;
  }  
  .saveDate .box:hover {
   /* background: var(--rouge); */
	background: var(--blanc); 
    /*padding: 30px 30px 70px 30px;*/
   /* padding: 40px 30px;*/
    box-shadow: 10px 15px 30px rgba(0, 0, 0, 0.18);
    color: var(--colorText);
    height: 100%;
  }
  .saveDate .box:hover span, .saveDate .box:hover h2, .saveDate .box:hover h3, .saveDate .box:hover p {
    color: var(--colorText);
  }
  .saveDate .btn-savoirPlus {
    border-color: var(--blanc);
    border-radius: 0;
    color: var(--blanc) !important;
    text-transform: uppercase;
    /*font-family: 'Montserrat', sans-serif;*/
    font-family: "Poppins", sans-serif;
    font-size: 14px;
  }
  .box:hover h5 .btn-savoirPlus a{ 
    border: 3px var(--rouge) solid;
    color: var(--rouge) !important;
    border-radius: 0;
    padding: 10px;
  }
  .saveDate .btn-savoirPlus a {
    color: var(--blanc) !important;
  }
  .saveDate .btn-savoirPlus:hover   {
    border-color: var(--rouge);
    border-radius: 0;
    background-color: var(--rouge);
    color:var(--blanc) !important;
  } 
  .saveDate .box:hover h5 .btn-savoirPlus a {
    border-color: var(--rouge) !important;
  }
  .saveDate .box:hover h5 .btn-savoirPlus a:hover {
    color: var(--blanc) !important;
  }
  #gallery {
      padding-bottom: 0;
    }
  #gallery .row {
      padding-bottom: 0;
    --bs-gutter-x: 0;
      --bs-gutter-y: 0;
    }
  #gallery .gallery-item {
      overflow: hidden;
    /* border-right: 3px solid #fff;
      border-bottom: 3px solid #fff; */
    }
  #gallery .gallery-item img {
      transition: all ease-in-out 0.4s;
    }
  #gallery .gallery-item:hover img {
      transform: scale(1.1);
    }
    
  /*--------------------------------------------------------------
  # Footer
  --------------------------------------------------------------*/
  #footer {
    /*background: var(--noir);*/
    background: rgb(0,0,0);
    background: linear-gradient(90deg, rgba(0,0,0,1) 39%, rgba(135,44,44,1) 69%, rgba(5,5,5,1) 87%);
    color: #fff;
    font-size: 14px;
    text-align: center;
    padding: 30px 0;
  }
  #footer h3 {
   /* font-size: 26px;*/
    font-weight: 100;
    color: var(--rouge); 
    position: relative;
    padding: 0;
    margin: 0 0 15px 0;
  }
  /*#footer h4 {text-align: left!important; }*/
  #footer p {
    padding: 0;
    margin:0;
  }
  #footer .social-links {
    margin: 0 0 40px 0;
  }
  #footer .social-links a {
    font-size: 18px;
    display: inline-block;
    background: #46423b;
    color: #fff;
    line-height: 1;
    padding: 8px 0;
    margin-right: 4px;
    border-radius: 50%;
    text-align: center;
    width: 36px;
    height: 36px;
    transition: 0.3s;
  }
  #footer .social-links a:hover {
    background: var(--rouge); 
  }
  #footer .copyright {
    font-size: 10px;
    text-transform: uppercase;
    text-align: left;
  }
  /*#footer .credits {font-size: 13px;}*/
  #footer ul { padding-left: 0rem !important; text-align: left; }
	#footer ul li {	list-style: none; text-align: left; line-height: 24px; font-size: 12px; }
  #footer ul li  a {color: #FFFFFF !important; text-decoration:none; }
  #footer ul li  a:hover {color: var(--rouge) !important; text-decoration:none !important; }
  #footer .archive  a {color: #FFFFFF !important; text-decoration:none; font-size: 12px; }
  #footer .archive   a:hover {color: var(--rouge) !important; text-decoration:none !important; }
  #footer ul li:before { content: ">"; display: inline-block; width: 1.3em; /* same as padding-left set on li */ }
 

  /*--------------------------------------------------------------
  # Line separateur 1
  --------------------------------------------------------------*/  
  .section-title1 {position: relative;}
  .line-sep {
    overflow: hidden;
    position: relative;
    padding-right: 20px; 
    padding-left:20px;
    padding-top: 0.5em;
    margin-top: -0.5em;
    padding-bottom: 0.5em;
    margin-bottom: -0.5em;
  }
  .line-sep .title_center {
    text-align: center;
    padding: 0.5em 20px;
    color: var(--colorText);
    text-transform: uppercase;
  }
  .line-sep h2 {
    text-align: center;
    color:#00f !important;
  }
  .line-sep > span {
    display:block;
  }
  .line-sep.title_center > p {
    margin-right: 50px;
    margin-left: 50px;
      text-transform: uppercase;
  } 
  .line-sep.title_center span {
    display: inline-block;
    padding: 0 10px;
    position: relative;
    vertical-align: baseline;
    color: var(--rouge);
  }
  .line-sep:after,
  .line-sep:before {
    content : "";
    font-size: 8px;
    position: absolute;
    height: 9px;
    top: 50%;
    overflow: hidden;
    background-image: url('../../assets/img/divider1.png');     
      margin-top: -4.5px;
  }
  .title_center.line-sep:after,
  .title_center.line-sep:before {
    width: 10%;
  }
  .line-sep:before {
    width: 0;
    margin-left: -10%;
    text-align: right;
  }
  .line-sep:after {
    width: 100%;
  }
  /* **************** End Line separateur ******************* */
  
 
  /*--------------------------------------------------------------
  # Portfolio Details
  --------------------------------------------------------------*/
  
  /* Clients Section
  --------------------------------*//*
  #clients { padding: 60px 0; }
  #clients img { opacity: 1; transition: 0.3s; }
  #clients img:hover { opacity: 0.5; }
  #clients .swiper-pagination { margin-top: 30px; position: relative; }
  #clients .swiper-pagination .swiper-pagination-bullet {
    width: 12px; height: 12px; background-color: #fff; opacity: 1; border: 1px solid #18d26e; }
  #clients .swiper-pagination .swiper-pagination-bullet-active { background-color: #18d26e; } */

  /*--------------------------------------------------------------
# Clients : # Partenaire
--------------------------------------------------------------*/
.clients .clients-slider .swiper-slide img { opacity: 1; transition: 0.3s; }
.clients .clients-slider .swiper-slide img:hover { opacity: 0.5; }
.clients .clients-slider .swiper-pagination { margin-top: 20px; position: relative; }
.clients .clients-slider .swiper-pagination .swiper-pagination-bullet {
  width: 12px; height: 12px; background-color:var(--blanc); opacity: 1; border: 1px solid var(--gris); }
.clients .clients-slider .swiper-pagination .swiper-pagination-bullet-active { background-color: var(--gris); }

/*--------------------------------------------------------------
# Sections 
--------------------------------------------------------------*/  
 
  /* ************************************************************* */
  
.pt-style-1 .page-title.bklyn-divider-styles,
.pt-style-1 .section-title.bklyn-divider-styles {
    background: none !important;
}
.pt-style-1 .section-title span,
.pt-style-1 .page-title span {
    display: inline-block;
    padding: 0 20px;
    position: relative;
    vertical-align: baseline;
}
.pt-style-1 .page-title.bklyn-divider-styles span::before,
.pt-style-1 .page-title.bklyn-divider-styles span::after,
.pt-style-1 .section-title.bklyn-divider-styles span::before,
.pt-style-1 .section-title.bklyn-divider-styles span::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    width: 1160px;
    background-attachment: scroll;
    background-repeat: repeat-x;
    background-position: center center;
}
.pt-style-1 .page-title.bklyn-divider-styles span::before,
.pt-style-1 .section-title.bklyn-divider-styles span::before {
    right: 100%;
}
.pt-style-1 .page-title.bklyn-divider-styles span::after,
.pt-style-1 .section-title.bklyn-divider-styles span::after {
    left: 100%;
}

.pt-style-1 .page-title.bklyn-divider-style-1 span::before,
.pt-style-1 .page-title.bklyn-divider-style-1 span::after,
.pt-style-1 .section-title.bklyn-divider-style-1 span::before,
.pt-style-1 .section-title.bklyn-divider-style-1 span::after {
    background-image: url('images/divider/divider1.png');
    height: 9px;
    margin-top: -4.5px;
}


/* ============================================== Start Formulaire ====================================== */
	
	
form {padding:10px; }
fieldset {padding:20px !important; margin-bottom:10px !important; border:1px solid #999 !important;  text-align:center !important; background-color:#f2f2f2; }
legend {color: var(--rouge) !important; text-align: center !important;  width: inherit !important; padding:10px !important; float: none !important;  } 
.form-row>.col, .form-row>[class*=col-] { padding-top: 10px !important;     display: inline-flex; }
.colRight { text-align: right !important;/*** Need edit in RTL ****/  /*** Code in RTL ****/}
 .colleft { text-align: left !important;}
 
label.inline {display:inline; }
input, textarea, select, option { margin: 5px 0 5px 0;  }
input, textarea, select { padding:3px;/* border:1px solid #CCC; */ color:#000;  font-size:14px; }

.custom-select.is-invalid, .form-control.is-invalid, .was-validated .custom-select:invalid, .was-validated .form-control:invalid {background-color: #ffddee;}
.custom-select.is-valid, .form-control.is-valid, .was-validated .custom-select:valid, .was-validated .form-control:valid, .custom-file-input.is-valid {background-color:  #ddffdd ;}
 .custom-file-input.is-valid {background-color: #F90 /*#ddffdd*/;}

.form-check-inline .form-check-input:invalid  {
  background-color: #ffddee; /*position: static;  margin-top: 0; margin-right: .3125rem; margin-left: 0;*/}
 
input[type=submit], input[type=reset] {
	 /*width:200px; */padding:5px; margin-left:5px; background-color:#c2272d; color:#FFF; font-size:14px; border:0px; box-shadow:0;cursor:pointer;
  }

  .form-check-input {
    margin-right: 10px;
}
 
input[type=submit]:focus, input[type=reset]:focus {  background-color:#ed0202; }
input[type=submit]:hover, input[type=reset]:hover { background-color:#ed0202; }
input[type=submit]:active, input[type=reset]:active { background-color:#ed0202;  }
.form-check-inline {display: inline-flex !important;     margin-right: 1rem;}
 .custom-control {
    position: relative;
    display: inline-flex;
	 float: left;
    min-height: 1.5rem;
    padding-left: 1.5rem;
}
label {
    display: inline-flex !important;
    text-align: left !important;
	padding-left: 5px;
}

.bg-rq {
    padding: 1rem; margin:1rem;
    border: 1px solid #eee;
    border-left-width: .5rem; /*** Need edit in RTL ****/ 
	border-right-width: .5rem; /*** Code in RTL ****/
    border-radius: .5rem;
}
.bg-rq-warning {
	background-color:#cdcdcd;
	border-left-color: #999; /*** Need edit in RTL ****/
	border-right-color: #999; /*** Code in RTL ****/
}

.bg-rouge {background-color:#c2272d; color:#FFF; padding:5px; cursor:pointer;  }

 /* ============================================== End Formulaire ====================================== */ 


/* ======================================= Vidéo ======================================= */
  .outer-container{
        width: 1050px; /*100%*/
    }
    .video-container {
        position: relative;
        padding-bottom: 56.25%;
        padding-top: 35px;
        height: 0;
        overflow: hidden;
    }
    .video-container iframe {
        position: absolute;
        top:0;
        left: 0;
        width: 100%;
        height: 100%;
    }


  /* Start Video */
  .video {
    position: relative;

  }
  .video::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 40%);
  }
  .video video {
    width: 100%;
  }

.video .bg1 {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 50%; 
  transform: translateY(-50%); 
  /*background-color: rgba(23, 245, 3, 1)  ;*/ 
}

.video .text {
  width: 100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  padding: 50px;
 /* background-color: rgb(0 0 0 / 80%)  ;*/
  color: white;
  text-align: center;
}
.video .text h2 {
  margin: 0 0 30px;
  text-transform: uppercase;
  font-weight: normal;
}
.video .text p {
  margin-bottom: 30px;
}
.video .text button {
  background-color: black;
  color: white;
  padding: 10px 20px;
  border: none;
  text-transform: uppercase;

}
/* End Video */

.main-title::after {
content:"";
width:50vh /*120px*/;
height: 2px;
background-color: var(--gris);
position : absolute;
bottom : -20px;
left:50%;
transform: translateX(-50%)

}
.paddingTop150 {
  padding-top: 150px;
}

.reseauSociau {
  text-align: center;
}
.reseauSociau h4 {
  color: var(--rouge);
  /*font-size: 25px;*/
}
.reseauSociau h5 {
  color: var(--blanc);
  /*font-size: 15px;*/
}

.reseauSociau .social-links   a {
    color: var(--blanc) !important;
}
.reseauSociau  .social-links   a:hover {
  background: var(--rouge) !important; 
}
.reseauSociau  .social-links   h5 {
  text-transform: uppercase;
}


/*--------------------------------------------------------------
# Slide Belgacem
--------------------------------------------------------------*/
.citation { 
  background-color: transparent;
}
.citation h2 {
  color: var(--blanc);
  /*font-size: 22px; */
  /* border-bottom: 2px var(--gris) solid; */  
}
.citation h3 {
  color:var(--blanc);
  /*font-size:14px; */
}


/* ======================================= Start Responsive h1 h2 h3 h4 h5 h6 p ======================================= */
/* 1- Small devices (landscape phones, 576px and up) @media (min-width: 576px) {*/

  @media screen and (min-width: 250px) and (max-width: 576px){
  h1 { font-size: 30px; }
  h2 { font-size: 27px; }
  h3 { font-size: 25px; }
  h4 { font-size: 22px; }
  h5 { font-size: 19px; }
  h6 { font-size: 15px; }
  p  { font-size: 15px; }

  #hero h2 {font-size: 22px; }
  #hero h3 {font-size: 15px;  }
  #hero .carousel-content { padding-top: 160px; }
  #hero .carousel-content .float-end2 img, svg { width: 60% !important; text-align: center !important; }

  .saveDate { padding: 30px;}
  .saveDate .box h2 { font-size: 22px; }
  .saveDate .box h3 { font-size: 18px; }
  .saveDate .box h5 { font-size: 14px; }

  .homeEdito h5 { font-size:0.8rem; }
  .homeEdito p { font-size: 0.8rem;}
  .section-title p { font-size: 0.8rem;}
  .section-title h1 { font-size: 1rem;}
  .section-title h2 { font-size: 1rem;}

  .citation h2 { font-size: 18px; }
  .citation h3 { font-size: 12px; } 
  .citation .carousel-caption h2 { padding-top:300px}
  .citation .carousel-caption  { position: absolute;}
  .citation .multi-carousel,  .citation .multi-carousel-inner, .citation .multi-carousel-item {
    padding-top:100px;}
 
  .reseauSociau h4 { font-size: 14px; }
  .reseauSociau h5 { font-size: 10px; line-height: 12px;}
  .reseauSociau p { font-size: 1rem;}
  .reseauSociau .fa-6x {font-size: 3em; }

  .video .text { padding-left: 0 !important; padding-right: 0 !important; }
  .text .section-title {padding-bottom: 10px; padding-top: 50px; }
 
  #footer { padding: 30px; } 
  #footer h4 { font-size: 15px; }  
  #footer p { font-size: 10px; }
  #footer .social-links a {width: 36px; height: 36px; font-size: 18px;} 

  #clients {padding: 30px; }

}

/* 2- Medium devices (tablets, 768px and up) @media (min-width: 768px) {*/

  @media screen and (min-width: 576px) and (max-width: 768px){
  h1 { font-size: 32px; }
  h2 { font-size: 29px; }
  h3 { font-size: 26px; }
  h4 { font-size: 24px; }
  h5 { font-size: 20px; }
  h6 { font-size: 16px; }
  p  { font-size: 16px; }

  #hero h2 {font-size: 36px; }
  #hero h3 {font-size: 25px; }
  #hero .carousel-content { padding-top: 160px; }
  #hero .carousel-content .float-end2 img, svg { width: 90% !important; text-align: center !important; }

  .saveDate .box h2 { font-size: 22px; }
  .saveDate .box h3 { font-size: 18px; }
  .saveDate .box h5 { font-size: 14px; }

  .homeEdito h5 { font-size:15px; }
  .homeEdito p { font-size: 0.8rem;}
  .section-title p { font-size: 0.8rem;}

  .citation h2 { font-size: 18px; }
  .citation h3 { font-size: 14px; } 

  .reseauSociau h4 { font-size: 16px; }
  .reseauSociau h5 { font-size: 10px; line-height: 12px; }
  .reseauSociau p { font-size: 1rem; }
  .reseauSociau .fa-6x {font-size: 2em; }

  #footer h4 { font-size: 15px; }  
  #footer p { font-size: 10px; }
  #footer .social-links a {width: 36px; height: 36px; font-size: 16px;}


 }

/* 3- Large devices (desktops, 992px and up) @media (min-width: 992px) { */

  @media screen and (min-width: 768px) and (max-width: 1023px){
  h1 { font-size: 36px; }
  h2 { font-size: 32px; }
  h3 { font-size: 29px; }
  h4 { font-size: 27px; }
  h5 { font-size: 22px; }
  h6 { font-size: 18px; }
  p  { font-size: 18px; }

  #hero h2 {font-size: 50px; }
  #hero h3 {font-size: 32px;  padding-bottom: 50px;}
  #hero .carousel-content { padding-top: 160px; }
  #hero .carousel-content .float-end2 img, svg { width: 90% !important; text-align: center !important; }
  
  .saveDate .box h2 { font-size: 22px; }
  .saveDate .box h3 { font-size: 18px; }
  .saveDate .box h5 { font-size: 14px; }

  .homeEdito h5 { font-size:15px; }
  .homeEdito p { font-size: 0.8rem;}
  .section-title p { font-size: 1rem;}

  .citation h2 { font-size: 26px; }
  .citation h3 { font-size: 22px; } 

  .reseauSociau h4 { font-size: 25px; }
  .reseauSociau h5 { font-size: 15px; line-height: 18px; }
  .reseauSociau p { font-size: 1rem; }

  #footer h4 { font-size: 15px; }  
  #footer p { font-size: 10px; }
  #footer .social-links a {width: 36px; height: 36px; font-size: 18px;} 

 }

/* 4- X-Large devices (large desktops, 1200px and up) @media (min-width: 1200px) {*/

  @media screen and (min-width: 1023px) and (max-width: 1280px){
  h1 { font-size: 38px; }
  h2 { font-size: 34px; }
  h3 { font-size: 31px; }
  h4 { font-size: 28px; }
  h5 { font-size: 23px; }
  h6 { font-size: 19px; }
  p  { font-size: 19px; }

  #hero h2 {font-size: 57px; }
  #hero h3 {font-size: 34px;     padding-bottom: 50px; }
  #hero .carousel-content { padding-top: 150px; }
  #hero .carousel-content .float-end2 img, svg { width: 35% !important; /*text-align: center !important;*/ }

  .saveDate .box h2 { font-size: 22px; }
  .saveDate .box h3 { font-size: 18px; }
  .saveDate .box h5 { font-size: 14px; }

  .homeEdito h5 { font-size:15px; }
  .homeEdito p { font-size: 0.8rem;}

  .citation h2 { font-size: 30px; }
  .citation h3 { font-size: 24px; } 

  .reseauSociau h4 { font-size: 25px; }
  .reseauSociau h5 { font-size: 15px; }
  .reseauSociau p { font-size: 1rem; }
  .reseauSociau .fa-6x {font-size: 0.9em; }

  #footer h4 { font-size: 15px; }  
  #footer p { font-size: 10px; }
  #footer .social-links a {width: 30px; height: 30px; font-size: 15px;}
 }

/* 5- XX-Large devices (larger desktops, 1400px and up) @media (min-width: 1400px) {@media (min-width: 1400px) {  */

  @media screen and (min-width: 1280px) and (max-width: 1600px){
  h1 { font-size: 40px; }
  h2 { font-size: 36px; }
  h3 { font-size: 33px; }
  h4 { font-size: 30px; }
  h5 { font-size: 25px; }
  h6 { font-size: 20px; }
  p  { font-size: 1.2 rem ; }

  #hero h2 {font-size: 57px; margin-top: 80px; }
  #hero h3 {font-size: 34px;  padding-bottom: 150px;} 
  #hero .carousel-content { padding-top: 240px; }
  #hero .carousel-content .float-end2 img, svg { width: 35% !important;  }
 
  .saveDate .box h2 { font-size: 29px; }
  .saveDate .box h3 { font-size: 18px; }
  .saveDate .box h5 { font-size: 14px; }

  .homeEdito h5 { font-size:15px; }
  .homeEdito p { font-size: 1rem;}

  .citation h2 { font-size: 40px; }
  .citation h3 { font-size: 24px; } 

  .reseauSociau h4 { font-size: 25px; }
  .reseauSociau h5 { font-size: 15px; }
  .reseauSociau p { font-size: 1rem;}

  #footer h4 { font-size: 15px; }  
  #footer p { font-size: 10px; }
  #footer .social-links a {width: 36px; height: 36px; font-size: 18px;}
}

/* ======================================= End Responsive h1 h2 h3 h4 h5 h6 p ======================================= */











/*--------------------------------------------------------------
# Whu Us
--------------------------------------------------------------*/
.why-us .box {
  padding: 50px 30px;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  transition: all ease-in-out 0.3s;
  height: 100%;
}
.why-us .box span {
  display: block;
  font-size: 28px;
  font-weight: 700;
  color: #ffcf88;
}
.why-us .box h4 {
  font-size: 24px;
  font-weight: 600;
  padding: 0;
  margin: 20px 0;
  color: #6c665c;
}
.why-us .box p {
  color: #aaaaaa;
  font-size: 15px;
  margin: 0;
  padding: 0;
}
.why-us .box:hover {
  background: var(--rouge); 
  padding: 30px 30px 70px 30px;
  box-shadow: 10px 15px 30px rgba(0, 0, 0, 0.18);
}
.why-us .box:hover span, .why-us .box:hover h4, .why-us .box:hover p {
  color: #fff;
}


/* ********** Bloc revue de presse *** */
	.image_bord { padding: 2px; border: solid 1px #999999; }
	.image_right { text-align:right; margin-left:20px; float:right;}
	.image_left { text-align:left; margin-right:20px; float:left;}
	.img-presse {	float:left; margin:0px 16px 20px 0 !important; }
	.bloc-presse{ overflow:hidden;}
	.date-presse { background:#000; color:#FFFFFF; padding:1px;}
	/*.date-presse { margin-bottom:100px !important}*/
	.margin_bottom10 { margin-bottom:10px;  }
	.bordeau{ color:#af293d;}
	.img_jury{text-align:right; margin-left:20px;  padding: 2px; border: solid 1px #999999;float:right;}
.bloc-presse a{  color:#8B8B8B;}
.bloc-presse a:hover {  color: var(--rouge) !important;}

.marginL30 { margin-left:5%;  }
.marginR30 { margin-right:5%; }
	
/* ================================================  media ======================================== */


/*--------------------------------------------------------------
# team
--------------------------------------------------------------*/
.chefs {
  /*background: url("../img/bg-jcc.jpg") center center no-repeat;*/
  background-size: cover;
  padding: 60px 0;
  position: relative;
}
.chefs::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.8);
  z-index: 9;
}
.chefs .container {
  position: relative;
  z-index: 10;
}
.chefs .member {
  text-align: center;
  margin-bottom: 80px;
  position: relative;
}
.chefs .member .pic {
  overflow: hidden;
}
.chefs .member .member-info {
  position: absolute;
  bottom: -80px;
  left: 20px;
  right: 20px;
  background: #fff;
  padding: 20px 0;
  color: #433f39;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  transition: max-height 0.5s ease-in-out;
}
.chefs .member h4 {
  font-weight: 500;
  margin-bottom: 10px;
  font-size: 16px;
  color: #6c665c;
  position: relative;
  padding-bottom: 10px;
}
.chefs .member h4::after {
  content: "";
  position: absolute;
  display: block;
  width: 50px;
  height: 1px;
  background: var(--rouge);
  bottom: 0;
  left: calc(50% - 25px);
}
.chefs .member span {
  font-style: italic;
  display: block;
  font-size: 13px;
}
.chefs .member .social {
  margin-top: 15px;
font-size: 0.8rem !important;
}
.chefs .member .social a {
  transition: color 0.3s;
  color: #7a7368;
}
.chefs .member .social a:hover {
  color: var(--rouge); 
}
.chefs .member .social i {
  font-size: 16px;
  margin: 0 2px;
}
@media (max-width: 992px) {
  .chefs .member {
    margin-bottom: 110px;
  }
}
@media (min-width: 1024px) {
  .chefs {
    background-attachment: fixed;
  }
}
 
 /*--------------------------------------------------------------
# jurys 
--------------------------------------------------------------*/
.jurys {
  /*background: url("../img/bg-jcc.jpg") center center no-repeat;*/
  background-size: cover;
  padding: 60px 0;
  position: relative;
}
.jurys::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.8);
  z-index: 9;
}
.jurys .container {
  position: relative;
  z-index: 10;
}
.jurys .member {
  text-align: center;
  margin-bottom: 80px;
  position: relative;
}
.jurys .member .pic {
  overflow: hidden;
}
.jurys .member .member-info {
  position: absolute;
  bottom: -80px;
  left: 20px;
  right: 20px;
  background: #fff;
  padding: 20px 0;
  color: #433f39;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  transition: max-height 0.5s ease-in-out;
}
.jurys .member h4 {
  font-weight: 500;
  margin-bottom: 10px;
  font-size: 16px;
  color: #6c665c;
  position: relative;
  padding-bottom: 10px;
}
.jurys .member h4::after {
  content: "";
  position: absolute;
  display: block;
  width: 50px;
  height: 1px;
  background: #ffcf88;
  bottom: 0;
  left: calc(50% - 25px);
}
.jurys .member span {
  font-style: italic;
  display: block;
  font-size: 13px;
}
.jurys .member .social {
  margin-top: 15px;
font-size: 0.8rem !important;
}
.jurys .member .social a {
  transition: color 0.3s;
  color: #7a7368;
}
.jurys .member .social a:hover {
  color: var(--rouge); 
}
.jurys .member .social i {
  font-size: 16px;
  margin: 0 2px;
}
@media (max-width: 992px) {
  .jurys .member {
    margin-bottom: 110px;
  }
}
@media (min-width: 1024px) {
  .jurys {
    background-attachment: fixed;
  }
}



/* ================================================  start style photo films ======================================== */
	/* *********************** page films  ********* */
.films p .lead{
	    font-size: 1rem !important;
}
.films h3{
	    font-size: 1rem;
}

/* ================================================  End style photo films ======================================== */
/* ================================================ galery photo ================================================== */
 
.photo  .col-3, .col-md-3, .col-sm-6  {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 0px;
    padding-left: 0px;
}
 
 
.boxphoto1 {
	overflow:hidden;
	width: 100%;   
	height:245px;  max-height:100% !important   ;
	position: relative;
	background-color:#FFF;  
	float: left !important;
	margin-bottom: 10px;
	padding-top: 7px;
}

.boxphoto1 .text-wrap {
	width: 80%;
	height: auto;
	padding-left: 10px;
	border-left: 2px solid #000;
	overflow: hidden;
	position: absolute;
	top: 30px;
	left: 5px;
	z-index: 999;
	opacity: 0;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.boxphoto1 .text-wrap h2 {
	margin: 0px;
	text-align: left;
	color: #000;
	display: block;

}
.boxphoto1 .text-wrap h2 a { color:#000 !important; /* color:#f6a910;*/ }

.boxphoto1 .text-wrap p {
	margin-top: 10px;
	width: 100%;
	margin: 0px;
	/*font-size: 13px;*/
	text-align: left;
	color: #000;
	display: block;
}

.boxphoto1 img {
	/*width: 370px;*/ width: 100%;
	height: 270px;  /*270px  100%; */
	position: absolute;
	top: -3px;
	/*left: -70px; */left: -0px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	opacity: 9;
	padding-left: 10px;
	
 
    object-fit: cover;
 
    filter: grayscale(100%);	
	
}




/*.boxphoto1 img {
	width: 130%;
	height:  130%;
	position: absolute;
	top: -40px;
	left: -30px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	opacity: 9;
}*/
.boxphoto1:hover .text-wrap {
	left: 50px;
	opacity: 9;
}

.boxphoto1:hover img {
	/*width: 350px;*/ width: 100%;
	height: auto; /*100%; 230px;*/
	top: 0px;
	left: 0px;
	opacity: 0.3;
}



/* ============================= End gallery photo ======================= */ 



#photo1 .card-header {
    min-height: 80px;
	font-size: 18px;
}


/* ********************************* texte bloc ****************************** */
.puce-1 ul {
  list-style: none;
  padding: 0;
}
.puce-1 ul li + li {
  margin-top: 15px;
}
.puce-1 ul li {
  position: relative;
  padding-left: 26px;
}
.puce-1 ul i {
  font-size: 20px;
  color: #ffb03b;
  position: absolute;
  left: 0;
  top: 2px;
}


/* *************************************************  Breadcrumbs *********************************** */

/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs {
  padding: 10px;
  background-color: #d2c29e;
  min-height: 40px;
  margin-top: 2px;
  color: var(--noir);
}
@media (max-width: 992px) {
  .breadcrumbs {
    margin-top: 70px;
  }
}
.breadcrumbs h2 {
  font-size: 24px;
  font-weight: 300;
  margin: 0;
}
@media (max-width: 992px) {
  .breadcrumbs h2 {
    margin: 0 0 10px 0;
  }
}
.breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 14px;
}
.breadcrumbs ol li + li {
  padding-left: 10px;
}
.breadcrumbs ol li + li::before {
  display: inline-block;
  padding-right: 10px;
  color: #6c757d;
  content: "|";
}
@media (max-width: 768px) {
  .breadcrumbs .d-flex {
    display: block !important;
  }
  .breadcrumbs ol {
    display: block;
  }
  .breadcrumbs ol li {
    display: inline-block;
  }
}
.justify-content-start .d-md-inline-block img{
    width: 37%;
}
.logo.me-auto img{
    background: var(--gris);
    border-radius: 50%;
    padding: 0px 17px 0px 17px !important;
    width: 68% !important;
}
.d-md-inline-block .img-fluid.mar50{
    width: 45%;
    float: right;
}
.reseauSociau a{
  color: #f00;
}
/*-------------------------------------------------  Breadcrumbs ------------- ------------------------------ */


#header a{
    color: #FFFFFF !important;
}
#header a:hover{
    color: var(--noir) !important;
}