/*VARIABLES*/
 
  

/*------------------------------*/

/*SHARED RULES */

/*pointer*/
.pointer,
.remove-class,
.remove-all-class,
.nav-bottom__button{
    cursor:pointer;
}
.no-pointer{cursor:default!important;}

.hide{display: none!important;}

/*download prez*/
.btn-download{cursor: pointer;}
.bd-transparent-again{opacity: 0;}

/*alert*/
.alert{opacity:0;}
.transition-arrive-play .alert{
    opacity:1;
    transition : all 0.5s cubic-bezier(.17,.67,.37,.96) 0.8s;
}

/*theme color body*/
/*.logo-color {opacity:1;transition : all 0.5s cubic-bezier(.17,.67,.37,.96);}
.logo-white {opacity:0;transition : all 0.5s cubic-bezier(.17,.67,.37,.96);}
.body--dark .logo-color {opacity:0;}
.body--dark .logo-white {opacity:1;}*/


/*------------------------------*/

/*TRANSITION PAGE*/

/*BG transition*/
.bg-transition-arrive{
	display: block!important;
}
.transition-arrive-play .bg-transition-arrive{
	top: -140%;
}
.transition-leave-play.transition-leave{
	bottom: 0%;
}

/*Home*/
.home .section.current-screen .wrap-bg {
	transition-delay: 0.2s;
	transition-duration: 1s;
}
/*from*/
.home h1{
	transition : all 0.8s cubic-bezier(.17,.67,.37,.96) 0.8s;
	opacity: 0;
	transform: translateY(20px);
}
/*to*/
.transition-arrive-play.home h1{
	opacity: 1;
	transform: translateY(0px);
}



/*MENU*/
.wrap-menu-2024, .header--for-menu,.wrap-menu-2024 .all-tabs-trigger, .wrap-menu-2024 .all-tab-content {
	transition : all 0.8s cubic-bezier(.17,.67,.37,.96);
	opacity: 0;
}
.wrap-menu-2024{
	transition : 	opacity 0.8s cubic-bezier(.17,.67,.37,.96) 0s,
					left 0s cubic-bezier(.17,.67,.37,.96) 0.8s;
}
.wrap-menu-2024.open{
	transition : 	opacity 0.8s cubic-bezier(.17,.67,.37,.96) 0s,
					left 0s cubic-bezier(.17,.67,.37,.96) 0s;
}
.wrap-menu-2024.open, .wrap-menu-2024.open .header--for-menu, .wrap-menu-2024.open  .all-tabs-trigger, .wrap-menu-2024.open  .all-tab-content{
	opacity: 1;
}
.wrap-menu-2024.open .header--for-menu{
	transition-delay: 0.4s;
	
}
.wrap-menu-2024.open .all-tabs-trigger{
	transition-delay: 0.6s;
}
.wrap-menu-2024.open .all-tab-content{
	transition-delay: 0.8s;
}
.menu-2024__card{
	transition : all 0.8s cubic-bezier(.17,.67,.37,.96);
	transform: scale(0.6);
	opacity:0;
}
.tab-open .menu-2024__card{
	transform: scale(1);
	opacity:1;
}
.menu-2024__card .bg{
	transition : all 0.8s cubic-bezier(.17,.67,.37,.96);
	transform: scale(3.6);
}
.tab-open .menu-2024__card .bg{
	transform: scale(1);
}
.menu-2024__card p{
	transition : all 0.8s cubic-bezier(.17,.67,.37,.96);
	transform: translateY(110%);
}
.tab-open .menu-2024__card p{
	transform: translateY(1%);
}
.menu-2024__card{overflow: hidden;}


.tab-open .menu-2024__card:hover img{
	transform: scale(1.2);
	opacity: 0.4;
}

.tab-open .menu-2024__card:hover p{
	background-color:#000e36; ;
	color: white;
}

/*------------------------------*/

/*SLIDER*/
.slider-arrow{cursor: pointer;}
/*nav dot*/
.wrapper-nav-dot > div{
	width: 15px;
	height:15px;
	border-radius: 50%;
	background: var(--main-1);
	transition : all 0.5s cubic-bezier(.17,.67,.37,.96);
	margin:0 5px;
	opacity:0.6;
	cursor: pointer;
	z-index: 1;
}
.wrapper-nav-dot > div.active-dot{
	opacity:1;
	transform: scale(1.4);
}
.wrapper-nav-dot > div:hover{
	transform: scale(1.2);
}

/*------------------------------*/

/*FILTER*/
.filtre-item .cercle{
	transform: scale(0);
}
.filtre-item.active-filter .cercle{
	transform: scale(1);
}

/*------------------------------*/

/*TAB*/
.tab__item.clicked .div-selected,
.tab__item:hover .div-selected{
	transform: scaleY(1);
}
.tab__item .div-selected{
	transition : all 0.5s cubic-bezier(.17,.67,.37,.96);
	transform: scaleY(0);
    transform-origin: bottom center;
}

/*------------------------------*/





/*------------------------------*/

/*MENU*/

/*Menu card*/
.menu [class^="card"] {
	transition : all 0.5s cubic-bezier(.17,.67,.37,.96);
	transform: scale(0.7); 
	opacity: 0;
}
/*Si menu tab :.open.menu .tab-open [class^="card"]*/
.open.menu [class^="card"] {
	transform: scale(1); 
	opacity: 1;
}

/*------------------------------*/

/*CARD*/
[class^="card"] {
	transition : all 0.5s cubic-bezier(.17,.67,.37,.96);
}
[class^="card"]:hover .bg{
    opacity: 0.6;
	transform: scale(1.5);
}
/*card +*/
[class^="card"]:hover .plus-wave{
	height:150px;
	width:150px;
	opacity: 0;
}
[class^="card"]:hover .plus{
	background: var(--main-2);
}

.halo{
	animation: 1s ease-in infinite    haloAnim;
}
@keyframes haloAnim 
{ 
	0% { 
		opacity: 0.3;
		transform: scale(0); 
	} 
	65% {
		opacity: 0.3;
		transform: scale(2.5); 
	} 
	85% {
		opacity: 0;
		transform: scale(3); 
	} 
	100% {
		opacity: 0;
		transform: scale(3); 
	} 
	 
}
/*POPUP*/
.menu, .popup{
	opacity:0;
	transition : 	left 0s cubic-bezier(.63,.18,.52,.72) 0.6s,
					opacity 0.6s cubic-bezier(.63,.18,.52,.72) 0s;
}

.menu.open, .popup.open{
	left:0%;
	opacity:1;
	transition : 	left 0s cubic-bezier(.63,.18,.52,.72) 0s,
					opacity 0.4s cubic-bezier(.63,.18,.52,.72) 0s;
}

/*popup bg*/
.popup .wrap-bg {
    filter: blur(40px);
    opacity: 0;
    transform: scale(1.4);
    transition : all 0.6s cubic-bezier(0.020, 0.360, 0.335, 0.995) 0s;
}
.popup.open .wrap-bg{
    filter: blur(0px);
    opacity: 1;
    transform: scale(1);
}

/*------------------------------*/


/*ANIMATION WAVE*/
.wave-dot{animation: 2s ease-in infinite  both running roundanim;}
.plus-wave::after {
	width:100%;
	height:100%;
	position: absolute;
	top:0;
	left:0;
	content: "";
	background: var(--main-1);
	transform-origin: center;
	transform: scale(1.5);
	animation: 1s ease-in infinite  both running roundanim;
	border-radius: 50%;
	z-index: -1;
}
@keyframes roundanim 
{ 
	0% { 
		opacity: 1;
		transform: scale(0); 
	} 
	95% {
		opacity: 0;
		transform: scale(1.5); 
	} 
	100% {
		opacity: 0;
		transform: scale(1); 
	}  
}


/************************************************************************/
                                    /*DESKTOP ONLY*/
/************************************************************************/

@media screen and (min-width: 1024px) {
	.alert.open{left:0%;}


	/*NAV BOTTOM*/
	/*apparatition chargement page*/
	.nav-buttom__wrap-button{
		height:0px;
		transition : all 0.5s cubic-bezier(.17,.67,.37,.96) 0.3s;
		overflow: hidden;
		padding-top: 0;
		padding-bottom: 0;
	}

	.transition-arrive-play .nav-buttom__wrap-button{
		height:80px;
	}
	.nav-bottom__button {
		transform: scale(0);
		transition : all 0.5s cubic-bezier(.17,.67,.37,.96) 0.8s;
	}
	.transition-arrive-play .nav-bottom__button {
		transform: scale(1);
	}

}