/*------------------------------------------------------***Style for Dev 2***------------------------------------------------------*/




/**************************************Style : section Carousel slider*********************************/
.carousel-slider .presenta-content { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; }
.carousel-slider .present-img {height: 107px;width: 107px;background: hsl(0deg 0% 0% / 30%);padding: 5px;border-radius: 50%;display: flex;align-items: center;}

.carousel-slider .present-img img { object-fit: cover; width: 85px!important; height: 66px; min-height: unset!important; }
.carousel-slider .presenta-title-back { font-family: 'Outfit'; font-weight: 600; font-size: 22px; color: white; }
.carousel-slider .presenta-back { display: flex; flex-direction: column; align-items: center; }


.carousel-slider .slick-track .item:has(.presenta-content.portes-automatiques) { background: #0C71B5!important; }
.carousel-slider .slick-track .item:has(.presenta-content.portes-industriel) { background: #0A5487!important; }
.carousel-slider .slick-track .item:has(.presenta-content.portes-garage) { background: #083F65!important; }
.carousel-slider .slick-track .item:has(.presenta-content.portails) { background: #062B44!important; }
.carousel-slider .slick-track .item:has(.presenta-content.portes-control) { background: #052438!important; }
.carousel-slider .slick-track .item:has(.presenta-content.barriere) { background: #031B2B!important; }

.carousel-slider .presenta-button {height:52px;width:52px;background:url(https://www.opencontrol.fr/wp-content/uploads/2025/01/open-control-installation-porte-automatique-cannes-arrow-right.svg);border-radius:50%}
.carousel-slider .presenta-button:hover { background-color: #ef6929; border-radius: 50%; }

.carousel-slider .sub-menu-list ul li .coherence-core-menu-item{text-transform: none;color: #414142;}
.carousel-slider .sub-menu-list ul {flex-direction: column!important;}


.carousel-slider .item-body .presenta-title-back{ min-height: 66px; }

/**************************************Style : Header*********************************/
.sub-menu-list a.coherence-core-menu-item { text-transform: none!important;color:#414142!important;padding-top: 2px;padding-bottom: 2px; }
.sub-menu-list .coherence-core-nav-menu li { list-style: disc!important;margin-bottom: 0px !important; }
.sub-menu-list ul {display: block !important;
}

.mega-menu .coherence-sub-mega-menu { box-shadow: 0px 7px 19px -1px rgba(99,99,99,0.38); }

/**************************************Style : Text Defile*********************************/
.txt_dfl { white-space: nowrap; animation: defl_p 6s linear infinite; line-height: normal !important; transition: all 0.3s ease-in-out !important; }
@keyframes defl_p{
0% { transform: translateX(-20%); }
50% { transform: translateX(-50%); }
100% { transform: translateX(-100%); }
}

/**************************************Style : H1*********************************/
@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-50px);}
	60% {transform: translateY(-30px);}
}

.logo-anim {
  animation: bounce 2s infinite;
}


/**************************************Style : Nos Services*********************************/
.card-services:hover { background: var( --e-global-color-primary ); }
.card-services:hover h3,.card-services:hover p {color:white!important}
.card-services:hover .icon-services .elementor-icon-wrapper{background:var(--e-global-color-accent);border-radius:50%; height: 48px;width: 48px;}
.card-services:hover .icon-services .elementor-icon{background:var(--e-global-color-accent)!important}
.card-services .nos-sevices-cards .elementor-icon{
    border: 2px solid black!important;
    border-radius: 50%;
    margin-right: 20px;
}



/**************************************Style : Nos produits carousel*********************************/

.presta-carousel  .item-content section{height:100%}
.presta-carousel .item-body .item-content { background: hsl(0deg 0% 0% / 0%); height: 100%; z-index: 26!important; }
.presta-carousel .item-body:hover .item-content { background: hsl(0deg 0% 0% / 80%); height: 100%; z-index: 26!important; }
.presta-carousel .item-body .presta-content { position: relative; padding: 50px 80px; height: 100%; opacity: 1;transition: all 0.5s ease-in-out;}
.presta-carousel .item-body:hover .presta-content { opacity: 1}

.presta-carousel h3.presta-title-side { transform: rotate(270deg); position: relative; left: 59%; white-space: nowrap; bottom: -65%; z-index: 9; font-family: 'oswald'; font-size: 64px; color: white; }

.presta-carousel .item-body .presta-back { position: relative; bottom: -17%; z-index: 0; display: flex; flex-direction: column; align-items: center; gap: 10px;opacity: 0;transition: all 0.5s ease-in-out; }
.presta-carousel .item-body:hover  .presta-back { opacity: 1; }

.presta-carousel .presta-title-back {font-family: 'oswald';color: white;font-size: 32px;text-transform: uppercase;opacity: 0;transition: all 0.5s ease-in-out;}
.presta-carousel .item-body:hover .presta-title-back {opacity: 1;}

.presta-carousel .item-body .presta-description p { font-family: 'outfit'; color: white; font-size: 16px; font-weight: 200; text-align: center; opacity: 0;transition: all 0.5s ease-in-out;    margin-top: 10px;}
.presta-carousel .item-body:hover .presta-description p { opacity: 1; }
.presta-carousel a.presta-button { font-family: 'outfit'; font-size: 17px; color: white;opacity: 0;transition: all 0.5s ease-in-out; }
.presta-carousel .item-body:hover a.presta-button { opacity: 1; }

.presta-carousel .presta-button { position: relative; display: inline-block; text-decoration: none; color:var(--e-global-color-accent); font-weight: bold;padding:10px 20px; }
.presta-carousel a.presta-button:hover{ color: white; background: var(--e-global-color-accent);}

.presta-carousel .presta-button::after { content: "→"; font-size: 0.9em; margin-left: 8px; transition: transform 0.3s ease; }  
.presta-carousel .presta-button:hover::after { transform: translateX(4px); }
@media only screen and (min-width: 1360px){
    .presta-carousel .item-body:hover .presta-content { position: relative;  height: 100%;opacity: 1; }
    .presta-carousel .item-body .presta-content { opacity: 1;transition: all 0.5s ease-in-out;padding:80px 80px 80px 30px; }
}


@media only screen and (min-width: 1181px) and (max-width: 1380px) {
    .presta-carousel .item-body .presta-content { position: relative; padding: 12%; height: 100%; }
	 .presta-carousel .item-body:hover .presta-content {opacity: 1; }
	
	.presta-carousel .item-body h3.presta-title-side { display: block; transform: rotate(270deg); position: relative; left: 51%; white-space: nowrap; bottom: -64%; z-index: 9; font-family: 'oswald'; font-size: 50px; color: white; }
    .presta-carousel .item-body:hover h3.presta-title-side{display: none;}
	.presta-carousel .item-body .presta-back { position: relative; bottom: -17%; z-index: 0; display: flex; flex-direction: column; align-items: center; gap: 8px; transition: all 0.5s ease-in-out;opacity: 0;}
	.presta-carousel .item-body:hover .presta-back { opacity: 1; }
	.presta-carousel .item-body .presta-title-back {font-family: 'oswald';color: white;font-size: 28px;text-transform: uppercase;opacity: 0;transition: all 0.5s ease-in-out;}
	.presta-carousel .item-body:hover .presta-title-back {opacity:1 ;}
}

@media only screen and (min-width: 1025px) and (max-width: 1180px) {
    .presta-carousel .item-body .presta-content { position: relative; padding: 5%; height: 100%; }
    .presta-carousel .item-body:hover .presta-content { opacity: 1; }
	.presta-carousel .item-body h3.presta-title-side { display: block; transform: rotate(270deg); position: relative; left: unset; right: -40%; white-space: nowrap; bottom: -57%; z-index: 9; font-family: 'oswald'; font-size: 45px; color: white; }
    .presta-carousel .item-body:hover h3.presta-title-side{display: none;}
    .presta-carousel .presta-title-back { font-family: 'oswald'; color: white; font-size: 25px!important; text-transform: uppercase;opacity: 0;transition: all 0.5s ease-in-out; }
    .presta-carousel .item-body:hover .presta-title-back {opacity: 1; }
    .presta-carousel .presta-description p{font-size: 14px;opacity: 0;transition: all 0.5s ease-in-out;}
    .presta-carousel.item-body:hover .presta-description p{opacity: 1;}
}

@media only screen and (max-width: 1024px){
    .presta-carousel .item-body .presta-content { position: relative; padding:2% 15%; height: 100%; }
    .presta-carousel h3.presta-title-side {transform: rotate(270deg); position: relative; left: 59%; white-space: nowrap; bottom: -65%; z-index: 9; font-family: 'oswald'; font-size: 64px; color: white; }
    .presta-carousel .presta-title-back { font-family: 'oswald'; color: white; font-size: 25px; text-transform: uppercase; opacity: 0; transition: all 0.5s ease-in-out; } 
}

@media only screen and (max-width: 800px){    
	.presta-carousel .item-body .item-content { background: hsl(0deg 0% 0% / 80%); height: 100%; z-index: 26!important; }
    .presta-carousel .item-body .presta-content { opacity: 1}
	.presta-carousel .item-body .presta-back{opacity:1}
	 .presta-carousel .item-body h3.presta-title-side { transform: rotate(270deg); position: relative; left: 55%%; white-space: nowrap; bottom: -63%; z-index: 9; font-family: 'oswald'; font-size: 38px; color: white; }
    .presta-carousel .item-body h3.presta-title-side{display: none;}
	.presta-carousel .item-body .presta-description p{opacity:1}
	.presta-carousel a.presta-button{opacity:1}
	.presta-carousel .presta-title-back { font-family: 'oswald'; color: white; font-size: 23px; text-transform: uppercase; opacity: 1; transition: all 0.5s ease-in-out; }
}


@media only screen and (max-width: 750px){
	
    .presta-carousel .item-body .presta-content { position: relative; padding: 2% ; padding-bottom: 43%; height: 100%; }
    .presta-carousel .item-body:hover h3.presta-title-side { display: none; }
    .presta-carousel .item-body h3.presta-title-side { transform: rotate(270deg); position: relative; left: 43%; white-space: nowrap; bottom: -54%%; z-index: 9; font-family: 'oswald'; font-size: 38px; color: white; }
    .presta-carousel .item-body .presta-back{gap: 0px;}
}
@media only screen and (max-width: 600px){
    .presta-carousel .slick-slide{height: 550px;}
    .presta-carousel .item-body h3.presta-title-side { transform: rotate(270deg); position: relative; left: 40%; white-space: nowrap; bottom: -77%; z-index: 9; font-family: 'oswald'; font-size: 35px; color: white; } 
}
    .presta-carousel .item-body .presta-back { gap: 0px; padding: 2%; }
}

@media only screen and (max-width: 375px){
    .presta-carousel .presta-title-back { font-family: 'oswald'; color: white; font-size: 21px; text-transform: uppercase; opacity: 0; transition: all 0.5s ease-in-out; }
    .presta-carousel .item-body .presta-description p{font-size: 14px;}
    .presta-carousel .item-body .presta-back { gap: 0px; padding: 3%; }
    .presta-carousel .item-body h3.presta-title-side { transform: rotate(270deg); position: relative; left: 39%; white-space: nowrap; bottom: -78%; z-index: 9; font-family: 'oswald'; font-size: 30px; color: white; }
	 .presta-carousel .item-body .presta-description p { font-family: 'outfit'; color: white; font-size: 14px; font-weight: 200; text-align: center; opacity: 0; transition: all 0.5s ease-in-out; }

}


/**************************************Style :Side actions *********************************/
/* .btn-sticky .elementor-button-icon svg{ font-size: 40px!important; } */
.btn-sticky .elementor-button-content-wrapper{ display: flex; justify-content: center;align-items:center; gap: 0px; width: max-content !important; }
.btn-sticky { right: -65px !important; transition: 0.5s all ease-in-out; }
.btn-sticky:hover {right: 0px !important;}
@media only screen and (max-width: 800px) {
	.btn-sticky:hover { right: 30px !important ; }
	.btn-sticky { right: 0px !important;  }
	 body .btn-sticky span.elementor-button-text{display:none}
	 body .btn-sticky a.elementor-button { width: 122px !important; height: 60px !important; }
	 body .btn-sticky .elementor-button-icon svg { width: 25px !important; height: 25px; };
}

@media only screen and (max-width: 600px) {
	.side-actions{display:none};
}



body .btn-sticky,body .btn-sticky * { transition: 0.3s ease-in-out!important; }
body .btn-sticky a.elementor-button { width: 140px; height: 83px; }

body .btn-sticky:hover a.elementor-button { width: 170px; height: 83px; }

body .btn-sticky span.elementor-button-icon{margin-right: 0px!important;}
body .btn-sticky:hover span.elementor-button-icon{margin-right:10px!important;}
body .btn-sticky:hover .elementor-button-content-wrapper{ height: auto !important; }
body .btn-sticky span.elementor-button-text { transform: rotate(-90deg); width: 60px; height: 50px; }
body .btn-sticky:hover span.elementor-button-text { transform: rotate(0deg)!important; height: auto; width: 60px !important; }.btn-sticky .elementor-button-icon svg { width: 40px !important; height: 40px; }


/**************************************Style :Footer *********************************/
.section-footer .coherence-core-nav-menu li {display:block;position: relative;}


@media only screen and (max-width: 600px){
    .section-footer .coherence-core-nav-menu li { display: flex; text-align: center; justify-content: center; }
		.section-footer .coherence-core-nav-menu > li.menu-item:not(:last-child){margin-right:0px!important}
		body .section-footer ul.coherence-core-nav-menu { column-count: 1 !important; display: flex; flex-direction: column; justify-content: center; align-items: center;}
    }

/**************************************Style :Actualite *********************************/
.actualite .post-item-read-more { position: relative; display: inline-block; text-decoration: none; color:var(--e-global-color-accent); font-weight: bold; }
.actualite .post-item-read-more::after { content: "→"; font-size: 0.9em; margin-left: 8px; transition: transform 0.3s ease; }  
.actualite .post-item-read-more:hover::after { transform: translateX(4px); }


/**************************************Style :Contact *********************************/
.form-contact input.wpcf7-form-control.wpcf7-submit::after { content: "→"; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); font-size: 16px; transition: transform 0.3s ease; }
.form-contact input.wpcf7-form-control.wpcf7-submit:hover::after { transform: translate(15px, -50%); }
.phone-contact a:hover{text-decoration:underline;}