.a2a_svg, .a2a_count { 
border-radius : 0!important;
-webkit-transition: width ease .33s; /* For Safari 3.1 to 6.0 */
   transition: width ease .33s;
}
.a2a_svg:hover {
width : 55px !important;

}
.a2a_svg > svg {
height : 32px!important ;}#myfb {
-webkit-transition: all ease .5s; /* For Safari 3.1 to 6.0 */
   transition: all ease .5s;
}
.fb-close {
    color: #fff;
    font-family: sans-serif;
    font-weight: 600;
    background-color: #000;
    position: absolute;
    width: 26px;
    height: 26px;
    line-height: 26px;
    text-align: Center;
    border-radius: 25px;
    top: 0px;
    cursor: pointer;
    left: -10px;
    z-index: 200;
}
#myfbb:hover {
	cursor: pointer;
}#tarteaucitronAlertSmall #tarteaucitronCookiesNumber {
    font-size: 12px!important;
}
#tarteaucitronAlertSmall #tarteaucitronManager #tarteaucitronDot {
    
    border-radius: 5px;
    display: inline-block!important;
    height: 10px!important;
    margin-bottom: 1px!important;
    margin-top: 0px!important;
    width: 10px!important;
}
#tarteaucitronAlertSmall #tarteaucitronManager {
    color: #fff;
    cursor: pointer;
    display: inline-block;
    padding: initial!important;
margin-left:5px;
}
#tarteaucitronAlertSmall  {
 background-color:rgba(0,0,0,0.33)!important;
border-radius:8px;

}.panel-default , .jl-accordion > .tm-item {
border : 1px solid #ccc;
border-radius: 5px;
margin-bottom : 5px;
}
.panel-heading , .jl-accordion-title {

background : #eee;
border-radius: 4px;
padding : 10px;
margin : 0px;
}
.panel-body , .tm-content{
padding : 5px;
}
.panel-title{
margin: 0;
}
.sp-corporex-layout .sp-slider-content {
    display: inline-block;
    width: 40%;
    position: absolute;
    z-index: 999;
    left: 50px;
    top: 35%;
    padding: 40px;
    color: #fff;
    background-color: rgba(0,0,0, .5);
}

.sp-corporex-layout .btn-more {
 bottom: -55px;
letter-spacing: 0.1em;
    display: inline-block;
    color: white;
     background: #fa0;
     font-size: 0.875rem;
    line-height: 1.6;
    margin: 0;
border:solid 2px white;
    border-radius: 100px;
     padding: 0.625rem 1.4rem;
    vertical-align: middle;
  }
 .btn-more:hover {
    color: #fa0;
     background: white;
 
  }/* Conteneur principal */
.myfb2-container {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  padding: 2rem 0;
  justify-content: center;
  align-items: flex-start;
}

/* Post — carte avec image en fond */
.post {
  position: relative;
  border: none;
  border-radius: 16px;
  width: 360px;
  height: 480px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: pointer;
}

.post:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.15);
}

/* Image de fond — couvre toute la carte */
.post-image-container {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.post-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.post:hover .post-image {
  transform: scale(1.05);
}

/* Overlay dégradé — uniquement au survol pour lisibilité du texte */
.post::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: transparent;
  transition: background 0.4s ease;
  pointer-events: none;
}

.post:hover::after {
  background: rgba(0, 0, 0, 0.6);
}

/* Zone contenu — masquée par défaut (0/3) */
.post-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 2;
  padding: 1rem 1.25rem;
  display: flex;
  flex-direction: column;
  transition: top 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  overflow: hidden;
}

/* Au survol : le texte prend toute la carte (3/3) */
.post:hover .post-content {
  top: 0;
  padding-top: 1.5rem;
}

/* Texte — tronqué par overflow de la zone, pas d'ellipsis */
.post-content p {
  overflow: hidden;
  cursor: pointer;
  font-size: 0.92rem;
  line-height: 1.5;
  color: #fff;
  margin: 0;
  flex: 1;
  min-height: 0;
}

/* Date */
.post-content .date {
  margin-top: auto;
  padding-top: 6px;
  text-align: right;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.7);
  font-weight: 500;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}

/* Pied de page du post */
.post-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 3;
  height: 44px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.8rem;
  padding: 0 1.25rem;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.post-footer a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  transition: color 0.2s ease;
}

.post-footer a:hover {
  color: #fff;
}

/* Lien Voir sur Facebook */
.post-link {
  position: absolute;
  bottom: 50px;
  left: 0;
  right: 0;
  z-index: 3;
  text-align: center;
  padding: 0 1.25rem 6px;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  pointer-events: none;
}

.post:hover .post-link {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.post-link a {
  width: auto;
  min-width: 150px;
  padding: 7px 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
  border-radius: 8px;
  font-weight: 600;
  font-size: 0.82rem;
  background: #1877f2;
  color: #fff !important;
  text-decoration: none !important;
  transition: background 0.2s ease, transform 0.2s ease;
}

.post-link a:hover {
  background: #166fe5;
  transform: translateY(-1px);
}

/* Styles pour le lightbox */
.lightbox {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.lightbox-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 90%;
  max-height: 90%;
  overflow-y: auto;
}

.lightbox-inner img {
  max-width: 100%;
  max-height: 60vh;
  object-fit: contain;
  border: none;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.lightbox-text {
  margin-top: 1rem;
  padding: 1rem 1.5rem;
  max-width: 700px;
  width: 100%;
  color: #fff;
  font-size: 0.95rem;
  line-height: 1.7;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.lightbox-date {
  margin-top: 0.5rem;
  padding: 0 1.5rem;
  max-width: 700px;
  width: 100%;
  text-align: right;
  font-size: 0.78rem;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 500;
}

.lightbox .close {
  position: absolute;
  top: 20px;
  right: 24px;
  color: #fff;
  font-size: 2.2rem;
  cursor: pointer;
  padding: 0.5rem;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  transition: background 0.2s ease;
}

.lightbox .close:hover {
  background: rgba(255, 255, 255, 0.3);
}

/* Logo Facebook */
.facebook-logo {
  width: 24px !important;
  height: 24px;
  display: inline-block;
  cursor: pointer;
  transition: transform 0.2s;
}

.facebook-logo:hover {
  transform: scale(1.2);
}
.myslider > * > * > .sp-slider-image::after 
 {
content: '';
    display: block;
    width: 100%;
    height: 100%;
   background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8379726890756303) 18%, rgba(255,255,255,0) 40%, rgba(255,255,255,0) 100%);
}
.myslider-allpage > * > * > .sp-slider-image::after{
content: '';
    display: block;
    width: 100%;
    height: 100%;
   background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.6) 100%);
}
.myslider-allpage > * > * > .sp-slider-content {
display:none;
}.panel-title > a:before {
    float: right !important;
    font-family: FontAwesome;
    content:"\f068";
    padding-right: 5px;
}
.panel-title > a.collapsed:before {
    float: right !important;
    content:"\f067";
}
.panel-title > a:hover, 
.panel-title > a:active, 
.panel-title > a:focus  {
    text-decoration:none;
}
a.flag {
padding : 5px;
}

.mce-content-body {
overflow-y: hidden!important;
}
.jl-card.tm-heading > .tm-title{
font-family: 'Anton', sans-serif;
letter-spacing : 2px;
}




div.author {display:none;}
.jl-panel > ul > li {
display : inline-block;
}


.jl-close .jl-icon , svg {
width:30px;
height:30px;
}
.jl-close .jl-icon , svg  , line {
 stroke-width:2;
}

.platform-content {
    margin:0;
    padding: 0;
}

.the-tooltip{
display:none;
}


.themes .listethemes li:before {
    color: #fa0;
}




#mylogo2{
position: absolute;
z-index:1000;
}
.mylogo2{
position: fixed;
width: 80px;
top:7px;
left:30px;
}



.mylogo3 {
position: absolute;
z-index:1000;
top:7px;
left:20px;
}

.jl-width-1-4\@l, .jl-modal-dialog { 
     width: 100%; background:transparent;
}

.tm-modal-module.button {
line-height:1em;

}

.jl-link:hover {
    color: white;
  
}/* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card h1{
	font-size: 1.8em;
	font-family: 'Anton', sans-serif;
	color : white;
	text-shadow: 2px 2px 4px #000;
	margin-bottom:10px;
	margin-top:10px;
	letter-spacing: 0.1em;
	line-height: 0.8em;
}
.myflipcard {	
	min-width: 235px;
	margin: auto;
}
.flip-card-inner {
        display: block;
        margin-left: auto;
        margin-right: auto;
        padding: 6px;
        border: 1px solid #ddd;
        border-radius:3px;
}	
	.flip-card {
  background-color: transparent;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
   line-height:1.6em;
   font-weight: 800;
   margin:0;
}
 .flip-card-back p {
  
   margin: 0 0 10px!important;
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 249px; /* +14px soit (6+1)*2 */
  height: 159px; /* +14px */
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
  box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.5);
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 235px;
  height: 145px;
  backface-visibility: hidden;
  background-size: 235px 145px;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  background-color: white;
  
}

/* Style the back side */
.flip-card-back {
 
  color: white;
 // background-image: url("/images/ico/tour.jpg");
  transform: rotateY(180deg);
 // background:  rgba(255,255,255,0.5) 18%;
}
.flip-card-back::before {
background-image: url("/images/ico/tour.jpg");
background-size: cover;
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -2;
opacity: 0.4;
}
#tour::before {
background-image: url("/images/ico/tour.jpg");
}
#sp::before {
background-image: url("/images/ico/sp.jpg");
}
#eco::before {
background-image: url("/images/ico/eco.jpg");
}
.flip-card-back > a {
	color:blue;
}.inputbox.search-query.input-medium,  .button.btn.btn-primary {
margin: 0 10px 0 0;
    border-radius: 40px;
    padding: 15px 25px 15px 25px;
    background: #fff f;
    font-size: 16px;}

input[type=\"search\"] {
    box-shadow: inset 0 6px 4px rgba(0, 0, 0, 0.2);}.mylogo , .mylogo-ap{
 -webkit-filter: drop-shadow(5px 5px 4px rgba(0,0,0,0.4));      
    filter: drop-shadow(5px 5px 4px rgba(0,0,0,0.4)); 
}


.mylogo{
position: relative;
     top: -110px;
     height: 0px;	


 }
.mylogo-ap{
position: relative;
     top: -150px;
   height: 0px;
	 }			
			.g-menu-item-145 { background-color : hsla(0, 100%, 75%, 1); }
			.g-menu-item-150 { background-color : hsla(30, 100%, 75%, 1); }
			.g-menu-item-274 { background-color : hsla(60, 100%, 75%, 1); }
			.g-menu-item-146 { background-color : hsla(90, 100%, 75%, 1); }
			.g-menu-item-283 { background-color : hsla(120, 100%, 75%, 1); }
			.g-menu-item-148 { background-color : hsla(150, 100%, 75%, 1); }
			.g-menu-item-147 { background-color : hsla(180, 100%, 75%, 1); }
			.g-menu-item-149 { background-color : hsla(210, 100%, 75%, 1); }
			.g-menu-item-284 { background-color : hsla(240, 100%, 75%, 1); }
			
			
			.g-menu-item-145:hover { background-color : hsla(0, 100%, 90%, 1); }
			.g-menu-item-150:hover { background-color : hsla(30, 100%, 90%, 1); }
			.g-menu-item-274:hover { background-color : hsla(60, 100%, 90%, 1); }
			.g-menu-item-146:hover { background-color : hsla(90, 100%, 90%, 1); }
			.g-menu-item-283:hover { background-color : hsla(120, 100%, 90%, 1); }
			.g-menu-item-148:hover { background-color : hsla(150, 100%, 90%, 1); }
			.g-menu-item-147:hover { background-color : hsla(180, 100%, 90%, 1); }
			.g-menu-item-149:hover { background-color : hsla(210, 100%, 90%, 1); }
			.g-menu-item-284:hover { background-color : hsla(240, 100%, 90%, 1); }
			
			
			
.my1clic{
background:$accent-color-2;
height:110px;
}
.g-main-nav .g-sublevel > li.my1clic > .g-menu-item-container{
 color :black;

font-size: 12px;
}

.g-main-nav .g-sublevel > li.my1clic:hover > .g-menu-item-container, .g-main-nav .g-sublevel > li.active > .g-menu-item-container {
    color: #2e5fff;
   padding: 0.805rem 0.805rem;
   
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}
/* Style the Un-order list by setting its list-style to none */
.wrapper ul {
  list-style: none;
}

/* Style the list items inside the UL list, by setting its width, height and line-height 
  and float them to left and set its border and border-radius.
 */
.wrapper ul li {
  width: 75px;
  height: 75px;
  line-height: 75px;
  margin: 0 10px;
  text-align: center;
  cursor: pointer;
  border-radius: 50%;
  border: 3px solid #D8E2DC;
  float: left;
  transition: all 0.5s ease;
}

/* Style the icons by setting its color and margin-top value to 20px 
to align it properly */
.wrapper ul li .fa {
  color: #D8E2DC;
  margin-top: 20px;
  transition: all 0.5s ease;
}

/* Now target the specific li classes for styling and use box-shadow effect to border and text-shadow effect
  to icons for glowing effect and use transition property for smooth transition effect. */
/*facebook*/
.wrapper ul li:hover.facebook {
  border: 3px solid #33f;
  box-shadow: 0 0 25px #33f;
  transition: all 0.5s ease;
}

.wrapper ul li:hover .fa-facebook {
  color: #33f;
  text-shadow: 0 0 25px #33f;
  transition: all 0.5s ease;
}


/* instagram */
.wrapper ul li:hover.instagram {
  border: 3px solid #bc2a8d;
  box-shadow: 0 0 25px #bc2a8d;
  transition: all 0.5s ease;
}

.wrapper ul li:hover .fa-instagram {
  color: #bc2a8d;
  text-shadow: 0 0 25px #bc2a8d;
  transition: all 0.5s ease;
}

/* android */
.wrapper ul li:hover.android {
  border: 3px solid #0c0;
  box-shadow: 0 0 25px #0c0;
  transition: all 0.5s ease;
}

.wrapper ul li:hover .fa-android {
  color: #0c0;
  text-shadow: 0 0 25px #0c0;
  transition: all 0.5s ease;
}
.jl-transition-slide-bottom-medium{
font-size:1em!important;
font-family: Consolas, Monaco, monospace!important;
font-weight: 600;
letter-spacing: 2px;
line-height : 0.85em;
//padding-right:50px;
}
.g-news-ticker > .jl-child-width-expand  {
border : 1px solid red;
}


.myflash > div.jl-position-relative{
font-size:1em;
font-family: Consolas, Monaco, monospace;
font-weight: 600;
letter-spacing: 2px;
line-height : 0.85em;
//padding-right:50px;
border : 1px solid red;
}
.myflashtitle  {
	font-family: 'Anton', sans-serif;
    letter-spacing: 2px;
	background: red;
	color: #ffffff;
    font-size: 22px;
	margin: 0;
	padding : 6px;
	}
	
	.myflash .jl-card-body{
		
	padding : 0!important ;
	}
	
	.myflash h4.tm-title::before {
    color: red!important;
    font-size: 150%;
    padding-right: 5px;
}.parallax {

   /* The image used */
background:
        /* top, transparent black, faked with gradient */ 
        linear-gradient(
          rgba(0, 0, 0, 0.35), 
          rgba(0, 0, 0, 0.35)
        ),
        /* bottom, image */
        url("/images/slideshow/2.jpg");

 

  /* Set a specific height */
  min-height: 450px; 

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
} 


.parallax2 {

  /* The image used */
background:
        /* top, transparent black, faked with gradient */ 
        linear-gradient(
          rgba(0, 0, 0, 0.35), 
          rgba(0, 0, 0, 0.35)
        ),
        /* bottom, image */
        url("/images/slideshow/gdeanse.jpg");

  

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
} 

#myInlineFrame {
height:80vh;
}.preloader::after{
Content: "\A\A Chargement...";
display:inline-block;
width: 150px;
//height:200px;
font-size:14px;
white-space: pre;
padding : 15px;
background-image: url("/images/vdd.png");
background-repeat: no-repeat;
background-size: 150px 70px;

}
.preloader{
background:rgba(0,0,0,0.2);
padding : 15px;
}
.preloader img{
position : absolute;
padding-bottom : 20px;
width : 150px;
bottom :-15px;
}