@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

html{
background:#FFF;
width     :100%;
height    :100%;
}
body{
color      : #474747;
font-family: 'Open Sans', sans-serif;
font-size  : 16px;
background : #FFFFFF;
width      :100%;
height     :100%;
}

/* GLOBAL
-------------------------------------------------- */
.color1{color:#b00211;}
.color2{color:#474747}
.color3{color:#ee7e00}
.color4{color:#9600bc}
.color5{color:#0096bc}
.color6{color:#00bc00}
.color7{color:#ffd941}

.fs-13{font-size: 13px;}
.align-super{vertical-align: super;}

.bg-gris{background-color: #F5F3F4}
.orange-bg { background: #ee7e00; }
.violet-bg { background: #9600bc; }
.bleu-bg { background: #0096bc; }
.vert-bg { background: #00bc00; }
.rouge-bg { background: #b00211; }
.jaune-bg { background: #ffd941; }


.divider-little{color: #b00211;}
.divider-little::before {display: inline-block;content: "";border-top: .2rem solid #b00211;width: 2rem;margin-right: 0.6rem!important; transform: translateY(-0.2rem);}

.divider-double{color: #b00211;}
.divider-double::before {display: inline-block;content: "";border-top: .2rem solid #b00211;width: 2rem;margin-right: 0.6rem!important; transform: translateY(-0.2rem);}
.divider-double::after {display: inline-block;content: "";border-top: .2rem solid #b00211;width: 2rem;margin-left: 0.6rem!important; transform: translateY(-0.2rem);}

/*
TAILLE LOGO ---*/
.logobig{width: 220px;height: auto;}
.logosmall{width: 140px;height: auto;}


/*
SEPARATOR
-------------------------------------------------- */
.separator {
line-height: 0.5;
margin     : 10px 0;
text-align : center;
}
.separator span {
display : inline-block;
position: relative;
}
.separator span::before, .separator span::after {
border-bottom: 1px solid rgba(0, 0, 0, 0.5);
content      : "";
position     : absolute;
top          : 5px;
width        : 600%;
}
.separator span::before {
margin-right: 15px;
right       : 100%;
}
.separator span::after {
left       : 100%;
margin-left: 15px;
}

/*
EFFET FADEIN PAGE ---*/
.tcc-effect {
    animation-name: fadeInOpacity;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: 1s;
}
@keyframes fadeInOpacity {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* BOX ACCUEIL */
  .card-body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* FULLSCREEN HAUT DE PAGE */
.fullscreen {
  background-image: url("../tccimg/para-002.webp");
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
/*
BACKGROUND  ---*/
 .bg-opacity-black-10:before {  background: rgba(0, 0, 0, 0.1); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-black-20:before {  background: rgba(0, 0, 0, 0.2); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-black-30:before {  background: rgba(0, 0, 0, 0.3); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-black-40:before {  background: rgba(0, 0, 0, 0.4); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-black-50:before {  background: rgba(0, 0, 0, 0.5); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-black-60:before {  background: rgba(0, 0, 0, 0.6); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-black-70:before {  background: rgba(0, 0, 0, 0.7); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-black-80:before {  background: rgba(0, 0, 0, 0.8); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-black-90:before {  background: rgba(0, 0, 0, 0.9); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-white-10:before {  background: rgba(255, 255, 255, 0.1); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-white-20:before {  background: rgba(255, 255, 255, 0.2); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-white-30:before {  background: rgba(255, 255, 255, 0.3); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-white-40:before {  background: rgba(255, 255, 255, 0.4); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-white-50:before {  background: rgba(255, 255, 255, 0.5); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-white-60:before {  background: rgba(255, 255, 255, 0.6); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-white-70:before {  background: rgba(255, 255, 255, 0.7); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-white-80:before {  background: rgba(255, 255, 255, 0.8); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-white-90:before {  background: rgba(255, 255, 255, 0.9); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-orange-20:before {  background: rgba(248, 144, 28, 0.2); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-orange-50:before {  background: rgba(248, 144, 28, 0.5); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-orange-70:before {  background: rgba(248, 144, 28, 0.7); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-opacity-orange-90:before {  background: rgba(248, 144, 28, 0.9); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; }
 .bg-gradient:before { background: rgba(0, 0, 0, 0.8); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #b00211), color-stop(100%, #000000)); background: -webkit-linear-gradient(-315deg, #b00211 0%, #000000 100%); background: -webkit-linear-gradient(0deg, #b00211 0%, #000000 100%); background: linear-gradient(0deg, #b00211 0%, #000000 100%);  opacity: 0.6; content:""; height:100%; left:0; position:absolute; top:0; width:100%; z-index: 0; }


.banner-commandant { background: url(../tccimg/banner/banner-commandant.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }
.banner-guide { background: url(../tccimg/banner/banner-guide.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }

.banner-civilisation { background: url(../tccimg/banner/banner-civilisation.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }
.banner-jump { background: url(../tccimg/banner/banner-jump.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }
.banner-debutant { background: url(../tccimg/banner/banner-debutant.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }
.banner-migrer { background: url(../tccimg/banner/banner-migrer.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }
.banner-farm { background: url(../tccimg/banner/banner-farm.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }
.banner-alliances { background: url(../tccimg/banner/banner-alliances.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }




.banner-contact { background: url(../tccimg/banner/banner-contact.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }

.bg-debutant { background: url(../tccimg/banner/bg-debutant.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: fixed; }



/*.bg-histoire { background: url(../tccimg/banner-histoire.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }
.bg-organisation { background: url(../tccimg/banner-organisation.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }
.bg-equipe { background: url(../tccimg/banner-equipe.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }
.bg-contact { background: url(../tccimg/banner-contact.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }*/


.bg-mentions { background: url(../tccimg/banner/banner-mentions.webp); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: center center; background-repeat: no-repeat; background-size: cover !important; position: relative; z-index: 0; background-attachment: scroll; }
.bg-footer-contact { background: url(../tccimg/map-contact.png); background-clip: initial; background-color: rgba(0, 0, 0, 0); background-origin: initial; background-position: 60% 95%; background-repeat: no-repeat; position: relative; z-index: 0; }



/*
COULEUR ICON ---*/
.navbar-toggler,
.navbar-toggler:focus,
.navbar-toggler:active{
    border: none;
    box-shadow: none;
}

.navbar {
  --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 210, 65, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/*
NAVBAR TRANSPARENTE AU SCROLL ---*/
.navbar {
    background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
    transition: background-color 0.3s; /* Ajoute une transition en douceur pour le changement de couleur */
    font-family: 'Raleway', sans-serif;
    z-index: 1100;
}
.navbar.scrolled {
-webkit-transition: background 0.5s linear;
-moz-transition   : background 0.5s linear;
-ms-transition    : background 0.5s linear;
-o-transition     : background 0.5s linear;
transition        : background 0.5s linear;
background-color  : rgba(0, 0, 0, 0.7);
-webkit-box-shadow: 0px 0px 8px -2px #000000;
-moz-box-shadow: 0px 0px 8px -2px #000000;
box-shadow: 0px 0px 8px -2px #000000;
}
.fixed-top-2 {
    position: fixed !important;
    top: 35px;
    left: 0;
    width: 100%;
    z-index: 1100;
}
.navbar-nav > li > a,
.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus {
color: #ffd941;
line-height: 94px;
}
.navbar-nav > li > a:hover {
color           : #FFF;
}
.navbar-nav > .active > a,
.navbar-nav > .active > a:hover,
.navbar-nav > .active > a:focus {
color           : #FFF;
}
.navbar-nav > .open > a,
.navbar-nav > .open > a:focus,
.navbar-nav > .open > a:hover{
color           :#FFF;
}

.navbar-nav > li > a.encours {
  color: #fff;
}
.navbar-nav .dropdown-menu a.encours {
  background-color: #000;
  color: #fff;
}
.nav-item.dropdown.encours > .nav-link {
  color: #fff;
}

/*
CUSTOMIZE DROPDOWN NAVBAR
-------------------------------------------------------*/
/* Cache la fleche*/
/*.dropdown-toggle::after {
    display:none
}*/

/*
DEVELOPPE DROPDOWN AU SURVOL/HOVER---*/
.nav-item.dropdown:hover .dropdown-menu {
    display: block;
}

.navbar-nav > li > .dropdown-menu{
  border-top:none;
  margin-top: 0px;
  padding-top: 0px;
}

.dropdown-menu {
background-color:#FFF;
border-radius   : 0px;
}
.dropdown-menu > li > a {color: #000;}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
color           : #b00211;
text-decoration : none;
background-color: transparent;
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:focus,
.dropdown-menu > .active > a:hover {
background-color: #000;
color           : #fff;
outline         : 0 none;
text-decoration : none;
}
/*.dropdown-menu.active, .nav-link:active{background-color: #000;}*/

/*
MASQUER SCROLLBAR OFFCANVAS
-------------------------------------------------- */
.offcanvas-body {
    overflow-y: scroll;
    scrollbar-width: none; /* Masque la barre de défilement pour Chrome, Firefox et Edge */
    -ms-overflow-style: none; /* Masque la barre de défilement pour Internet Explorer et Edge */
}

.offcanvas-body::-webkit-scrollbar {
    width: 0; /* Masque la barre de défilement pour Chrome, Safari, et Opera */
}

/*
UNDERLINE MENU HOVER
-------------------------------------------------- */
.underlined {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    overflow: hidden;
}
.underlined:before {
    content                           : "";
    position                          : absolute;
    z-index                           : 1;
    left                              : 50%;
    right                             : 50%;
    bottom                            : 35px;
    background                        : #b00211;
    height                            : 2px;
    visibility                        : hidden;
    -webkit-transition-property       : left, right;
    transition-property               : left, right;
    -webkit-transition-duration       : 0.3s;
    transition-duration               : 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function        : ease-out;
}
.underlined:hover:before, .underlined:focus:before, .underlined:active:before {
    visibility: visible;
    left      : 10%;
    right     :10%;
}

/* MODAL ACCUEIL
-------------------------------------------------- */
.modal-accueil{z-index: 1200;}

/* COULEURS LIENS
-------------------------------------------------- */
a.link-color0{color:#b00211;text-decoration:none}a.link-color0:focus,  a.link-color0:hover{color:#b00211;text-decoration:none}
a.link-color1{color:#b00211;text-decoration:none}a.link-color1:focus,  a.link-color1:hover{color:#474747;text-decoration:none}
a.link-color2{color:#b00211;text-decoration:none}a.link-color2:focus,  a.link-color2:hover{color:#FFFFFF;text-decoration:none}
a.link-color3{color:#FFFFFF;text-decoration:none}a.link-color3:focus,  a.link-color3:hover{color:#b00211;text-decoration:none}
a.link-color4{color:#474747;text-decoration:none;} a.link-color4:focus, a.link-color4:hover{color:#474747;text-decoration:none;}
a.link-color5{color:#474747;text-decoration:none;} a.link-color5:focus, a.link-color5:hover{color:#b00211;text-decoration:none;}
a.link-color6{color:#b00211;text-decoration:none;} a.link-color6:focus, a.link-color6:hover{color:#ffd941;text-decoration:none;}

.lien-container-global a {color:#b00211;text-decoration:none;} .lien-container-global a:focus, .lien-container-global a:hover{color:#474747;text-decoration:none;}

/* COULEURS TABLEAUX
-------------------------------------------------- */
    .table-rouge {
    --bs-table-color: #000;
    --bs-table-bg: #b00211;
    --bs-table-border-color: #a6b5cc;
    --bs-table-striped-bg: #c5d7f2;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #bacbe6;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #b7cbea;
    --bs-table-hover-color: #000;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}


/*
VIDEO
-------------------------------------------------- */
/*hauteur video*/
.hv25{height: 25vh;}
.hv50{height: 50vh;}
.hv80{height: 80vh;}

.bgvid {
  position: relative;
  background-color: black;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
}
/* pour video youtube remplacer video par iframe */
.bgvid video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  /*height: calc(100vw/1.5);*/
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.bgvid .container {
  position: relative;
  z-index: 2;
}

.bgvid .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: black;
  opacity: 0;
  z-index: 1;
}

/* BOUTON
-------------------------------------------------- */
.btn-outline-n{
border-color    : #000;
border-radius   :0px;
font-family     : 'Raleway', sans-serif;
font-weight     : 700;
font-size       : 15px;
background-color: transparent;
color           : #000;
transition      : all .5s;
}
.btn-outline-n:hover,
.btn-outline-n:focus,
.btn-outline-n:active,
.btn-outline-n.active {
color           : #FFF;
background-color: #b00211;
border-color    : #b00211;
}
.btn-outline-b{
border-color    : #FFF;
border-radius   :0px;
font-family     : 'Raleway', sans-serif;
font-weight     : 700;
font-size       : 15px;
background-color: transparent;
color           : #FFF;
transition      : all .5s;
}
.btn-outline-b:hover,
.btn-outline-b:focus,
.btn-outline-b:active,
.btn-outline-b.active {
color           : #000;
background-color: #b00211;
border-color    : #b00211;
}
.btn-outline-call{
border-color    : #FFF;
border-radius   :0px;
font-family     : 'Raleway', sans-serif;
font-weight     : 700;
font-size       : 15px;
background-color: transparent;
color           : #FFF;
transition      : all .5s;
}
.btn-outline-call:hover,
.btn-outline-call:focus,
.btn-outline-call:active,
.btn-outline-call.active {
color           : #b00211;
background-color: #FFF;
border-color    : #FFF;
}
.btn-outline-color{
border-color    : #b00211;
border-radius   :0px;
font-family     : 'Raleway', sans-serif;
font-weight     : 700;
font-size       : 15px;
background-color: transparent;
color           : #b00211;
transition      : all .5s;
}
.btn-outline-color:hover,
.btn-outline-color:focus,
.btn-outline-color:active,
.btn-outline-color.active {
color           : #FFF;
background-color: #b00211;
border-color    : #b00211;
}
.btn-plain-color{
border-color    : #b00211;
border-radius   :0px;
font-family     : 'Raleway', sans-serif;
font-weight     : 700;
font-size       : 15px;
background-color: #b00211;
color           : #FFF;
transition      : all .5s;
}
.btn-plain-color:hover,
.btn-plain-color:focus,
.btn-plain-color:active,
.btn-plain-color.active {
color           : #FFF;
background-color: #000;
border-color    : #000;
}

/*
RESEAUX SOCIAUX
-------------------------------------------------- */
/* FACEBOOK */
.btn-outline-fb{
border-color    : #FFF;
color           : #FFFF;
}
.btn-outline-fb-n{
border-color    : #000;
color           : #000;
}
.btn-outline-fb, .btn-outline-fb-n{
border-radius   :0px;
background-color: transparent;
transition      : all .5s;
}
.btn-outline-fb:hover,
.btn-outline-fb:focus,
.btn-outline-fb:active,
.btn-outline-fb.active,
.btn-outline-fb-n:hover,
.btn-outline-fb-n:focus,
.btn-outline-fb-n:active,
.btn-outline-fb-n.active {
color           : #FFF;
background-color: #3B5998;
border-color    : #3B5998;
}
/* TWITTER */
.btn-outline-tw{
border-color    : #FFF;
color           : #FFFF;
}
.btn-outline-tw-n{
border-color    : #000;
color           : #000;
}
.btn-outline-tw, .btn-outline-tw-n{
border-radius   :0px;
background-color: transparent;
transition      : all .5s;
}
.btn-outline-tw:hover,
.btn-outline-tw:focus,
.btn-outline-tw:active,
.btn-outline-tw.active,
.btn-outline-tw-n:hover,
.btn-outline-tw-n:focus,
.btn-outline-tw-n:active,
.btn-outline-tw-n.active {
color           : #FFF;
background-color: #4099FF;
border-color    : #4099FF;
}
/* LINKEDIN */
.btn-outline-lk{
border-color    : #FFF;
color           : #FFFF;
}
.btn-outline-lk-n{
border-color    : #000;
color           : #000;
}
.btn-outline-lk, .btn-outline-lk-n{
border-radius   :0px;
background-color: transparent;
transition      : all .5s;
}
.btn-outline-lk:hover,
.btn-outline-lk:focus,
.btn-outline-lk:active,
.btn-outline-lk.active,
.btn-outline-lk-n:hover,
.btn-outline-lk-n:focus,
.btn-outline-lk-n:active,
.btn-outline-lk-n.active {
color           : #FFF;
background-color: #0e76a8 ;
border-color    : #0e76a8 ;
}
/* INSTAGRAM */
.btn-outline-in{
border-color    : #FFF;
color           : #FFFF;
}
.btn-outline-in-n{
border-color    : #000;
color           : #000;
}
.btn-outline-in, .btn-outline-in-n{
border-radius   :0px;
background-color: transparent;
transition      : all .5s;
}
.btn-outline-in:hover,
.btn-outline-in:focus,
.btn-outline-in:active,
.btn-outline-in.active,
.btn-outline-in-n:hover,
.btn-outline-in-n:focus,
.btn-outline-in-n:active,
.btn-outline-in-n.active {
color           : #FFF;
background-color: #e4405f;
border-color    : #e4405f;
}
/* PINTEREST */
.btn-outline-pi{
border-color    : #FFF;
color           : #FFFF;
}
.btn-outline-pi-n{
border-color    : #000;
color           : #000;
}
.btn-outline-pi, .btn-outline-pi-n{
border-radius   :0px;
background-color: transparent;
transition      : all .5s;
}
.btn-outline-pi:hover,
.btn-outline-pi:focus,
.btn-outline-pi:active,
.btn-outline-pi.active,
.btn-outline-pi-n:hover,
.btn-outline-pi-n:focus,
.btn-outline-pi-n:active,
.btn-outline-pi-n.active {
color           : #FFF;
background-color: #bd081c;
border-color    : #bd081c;
}
/* MAIL */
.btn-outline-mail{
border-color    : #FFF;
color           : #FFFF;
}
.btn-outline-mail-n{
border-color    : #000;
color           : #000;
}
.btn-outline-mail, .btn-outline-mail-n{
border-radius   :0px;
background-color: transparent;
transition      : all .5s;
}
.btn-outline-mail:hover,
.btn-outline-mail:focus,
.btn-outline-mail:active,
.btn-outline-mail.active,
.btn-outline-mail-n:hover,
.btn-outline-mail-n:focus,
.btn-outline-mail-n:active,
.btn-outline-mail-n.active {
color           : #FFF;
background-color: #b00211;
border-color    : #b00211;
}

/*
BOUTON RETOUR HAUT
-------------------------------------------------- */
.bouton_haut {
position     : fixed;
bottom       : 60px;
right        : 6px;
cursor       : pointer;
display      :none;
border-radius: 0px;
background   : none repeat scroll 0 0 #fff;
height       :40px;
width        :40px;
line-height  :2.5;
text-align   :center;
z-index: 2;
}
.bouton_haut:hover {
background-color:#b00211;
color           :#FFF;
transition      : all 0.3s ease-in-out 0s;
}

/*
LIGHTBOX
-------------------------------------------------- */
/* Styles pour assombrir le média au survol et afficher l'icône de loupe */
.lightbox-trigger {
  position: relative;
  display: inline-block;
}
.zoom-icon-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: none;
}
.lightbox-trigger:hover .zoom-icon-container {
  display: block;
}

.lightbox-trigger:hover img {
  /*filter: brightness(70%);*/
    filter: sepia(1) saturate(400%) hue-rotate(-40deg) brightness(0.9); /*changer hue-rotate pour changer la couleur*/
}
/* Styles pour l'icône de loupe */
.zoom-icon {
  width: 40px;
  height: 40px;
  fill: #fff;
}
.lightbox-container {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 1101;
}
.lightbox-content {
  position: relative; /* Positionnement relatif pour pouvoir positionner l'icône de fermeture absolument */
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.lightbox-content img {
  max-width: 90%;
  max-height: 90%;
}
.close-lightbox {
  position: absolute;
  top: 10px; /* Ajustez la position verticale selon vos besoins */
  right: 20px; /* Ajustez la position horizontale selon vos besoins */
  font-size: 30px;
  color: #fff;
  cursor: pointer;
    z-index: 1101 !important;
}
.lightbox-media {
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;
}

.lightbox-caption {
  color: #fff;
  font-size: 18px;
  text-align: center;
  margin-top: 10px; /* Ajustez selon vos besoins */
}
.prev-media,
.next-media {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24px;
  color: #fff;
  cursor: pointer;
    z-index: 1101 !important;
}
.prev-media {
  left: 20px;
}
.next-media {
  right: 20px;
}

/*
COMPTEUR DYNAMYQUE
-------------------------------------------------- */
   .single_counter {
     position:relative;
     padding: 32px 0;
     text-align: center;
     -webkit-transition: all 0.3s ease 0s;
     transition: all 0.3s ease 0s;
     border-top: 2px solid #8a7557;
     border-bottom: 2px solid #8a7557;
}
 .single_counter:before {
     content: "";
     position: absolute;
     left: 0;
     bottom: 0;
     right: 0;
     border-left: 2px solid #8a7557;
     border-right: 2px solid #8a7557;
     height: 40%;
}
 .single_counter:after {
     content: "";
     position: absolute;
     left: 0;
     top: 0;
     right: 0;
     border-left: 2px solid #8a7557;
     border-right: 2px solid #8a7557;
     height: 40%;
}
 .single_counter:hover:before, .single_counter:hover:after {
     border-color:#b00211;
}
 .single_counter:hover {
     background: #b00211;
     border-color: #b00211;
          color:#fff;
}
 .single_counter:hover{
     color: #fff;
}
/*
CUSTOM DIVIDER
-------------------------------------------------- */
.custom-divider, .custom-divider-bas{
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
}

.custom-divider, .custom-divider-bas, .pente {
    position: relative;
    display: block;
    width: calc(100% + 0.4px);
    height: 66px;
}
.custom-divider-bas{
    transform: rotate(180deg);
}

.custom-divider, .custom-divider-bas, .shape-fill {
    fill: #FFFFFF;
}
/*
HOVER IMAGE EQUIPE
-------------------------------------------------- */
.thecaption {
    position: relative;
}
.thecaption .text {
    z-index: 1;
    opacity: 0;
    transition: all 0.8s ease;
}

.thecaption:hover .text {
    opacity: 1;

}
.thecaption:hover img {
    -webkit-filter: brightness(0.4)
}
/* ACCORDION
-------------------------------------------------- */
.accordion {
  /* Personnaliser les icônes avec des SVG */
  --bs-accordion-btn-icon: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus" viewBox="0 0 16 16"%3E%3Cpath d="M8 4a.5.5 0 0 1 .5.5V7.5h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3V4.5A.5.5 0 0 1 8 4z"/%3E%3C/svg%3E');

  --bs-accordion-btn-active-icon: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x" viewBox="0 0 16 16"%3E%3Cpath d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/%3E%3C/svg%3E');

  /* Ajuster la taille des icônes */
  --bs-accordion-btn-icon-width: 24px; /* Augmente la taille de l'icône */
  
  /* Changer la couleur de l'accordéon actif */
  --bs-accordion-active-bg: #b00211;/* Couleur de fond active */
  --bs-accordion-active-color: #ffffff;/* Couleur du texte actif */
}
.accordion-button:focus {
    box-shadow: 0 0 0 0.25rem var(--focus-acc);
	/*box-shadow: none;/* Pas de bordure */
}

/*
CUSTOM ACCORDION
-------------------------------------------------- */
/*.accordion {
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(255, 217, 65, 0.25);
}
.accordion-button {
  color: #b00211;
}
.accordion-button:not(.collapsed) {
  background-color: #ffd941;
}
.accordion-flush > .accordion-item {
  border-right: 1px solid #DEE2E6;
  border-left: 1px solid #DEE2E6;
}
.accordion-flush > .accordion-item:first-child {
  border-top: 1px solid #DEE2E6;
}
.accordion-flush > .accordion-item:last-child {
  border-bottom: 1px solid #DEE2E6; 
}*/


.carousel-caption{bottom: 5%;text-align: left;background-color: rgba(0, 0, 0, 0.5);padding: 1%;}
.carousel-caption > h2{font-size: 40px;}
/*==================================================
=            Bootstrap 5 Media Queries             =
==================================================*/
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {  }

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 767.98px) {
    .underlined {bottom : 0px;}
    .carousel-caption{bottom: 0%;text-align: left;}
    .carousel-caption > h2 {font-size: 20px;}
}

/* Medium devices (tablets, 768px and up) */
@media (max-width: 991.98px) {
    .centered-menu .offcanvas-body {margin: 0 auto; /* Cette règle centre horizontalement le contenu du offcanvas body */
    }

/* SI LOGO + HAUT QUE NAVBAR
    .navbar-brand img{width: 155px;
    top: 8px;}*/
	.bouton_haut {bottom : 90px;}
    .underlined:before {bottom: 0px;}

    .navbar-nav > li > a, .navbar-nav > li > a:hover, .navbar-nav > li > a:focus {line-height: 20px;}
    .navbar{background-color  : rgba(0, 0, 0, 1);}
    .fixed-top-2 {position: fixed !important;top: 0;left: 0;width: 100%;z-index: 1100;}
    .dropdown-menu {background-color: transparent;text-align: center !important;border: none;}
    .navbar-nav .dropdown-menu a.encours {background-color: transparent; color: #fff;}
    .dropdown-menu > li > a {color: #b00211;padding-left: 1rem !important;}
    .offcanvas { background-color: rgba(183, 203, 234, 1);}

	.dropdown-menu > li > a:hover,
	.dropdown-menu > li > a:focus {
	color           : #FFF;
	text-decoration : none;
	background-color: transparent;
	}


    .navbar-nav .open .dropdown-menu > a:focus,
    .navbar-nav .open .dropdown-menu > a:hover {
    background-color: transparent;
    color           : #FFF;
    }
    .dropdown-item.active, .dropdown-item:active{background-color: transparent;}

    .carousel{top: 40px;}
}
/* `xl` applies to large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) { ... }

/* `xxl` applies to x-large devices (large desktops, less than 1400px)*/
@media (max-width: 1399.98px) { ... }