/*  Theme Name:  Protection incendie OTECH
Theme URI:    https://azulii.com
Description:  OTECH
Author:       AZULII GESTION DE L'IMAGE
Author URI:   https://azulii.com
Template:     Divi  
Version:      4.27.2 */

/*----BROWSER----*/

.otech-cursor {cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 40 40.46'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; %7D .cls-2 %7B fill: %2300a7e1; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-2' d='M34.45,5.69c-1.79-1.81-3.92-3.21-6.38-4.21-2.46-.99-5.16-1.49-8.1-1.49s-5.64,.5-8.1,1.49c-2.46,.99-4.58,2.39-6.35,4.21-1.77,1.81-3.14,3.95-4.09,6.41-.95,2.46-1.43,5.18-1.43,8.15s.48,5.65,1.43,8.13c.95,2.48,2.32,4.63,4.09,6.44,1.77,1.81,3.89,3.2,6.35,4.18,2.46,.97,5.16,1.46,8.1,1.46s5.64-.49,8.1-1.46c2.46-.97,4.59-2.36,6.38-4.18,1.79-1.81,3.17-3.96,4.12-6.44,.95-2.48,1.43-5.19,1.43-8.13s-.48-5.69-1.43-8.15c-.95-2.46-2.33-4.6-4.12-6.41Z'/%3E%3Cpath class='cls-1' d='M14.53,11.29c5.64-4.25,4.48-8.16,4.48-8.16,5.43,3.32,5.99,10.8,.97,14.75-6.33,4.96-5.5,10.89-5.5,10.89-7.16-6.82-5.02-13.64,.06-17.47Z'/%3E%3Cpath class='cls-1' d='M26.61,26.89c-6.33,4.96-5.5,10.89-5.5,10.89-7.16-6.82-5.02-13.64,.06-17.47,5.64-4.25,4.48-8.16,4.48-8.16,5.43,3.32,5.99,10.8,.97,14.75Z'/%3E%3C/svg%3E") 30 30, auto;}

::-moz-selection{color:#fff;background:#00a9e0;}
::selection{color:#fff;background:#00a9e0;}


/*----HEADER----*/

header .header-general {
    transition: all 0.3s ease-in-out!important;
    background-color: transparent;
}
header .header-general .et_pb_menu__logo svg{height:40px;}

header .scrolled {
    background-color: white;
    transition:all 0.3s ease-in-out;
	border-bottom:1px solid #cccccc;
}
body.home header .header-general .et_pb_menu ul li a{
    color: white!important;
    transition: all 0.3s ease-in-out;
}

body.home header .header-general.scrolled .et_pb_menu ul li a{
    color: black!important;
    transition: all 0.3s ease-in-out;
}
body.home header .header-general .et_pb_menu__logo svg g>* {fill: white;transition: fill 0.3s ease-in-out}
header .header-general .et_pb_menu__logo svg g>*, header .header-general .svg-convert svg g>*, body.home header .header-general.scrolled .et_pb_menu__logo svg g>*  {fill: #00a9e0;transition: fill 0.3s ease-in-out}

body.home header .header-general .svg-convert svg g>* {fill: white;transition: fill 0.1s ease-in-out}
header .header-general .svg-convert svg, header .header-general .et_pb_menu__logo svg {height:40px;width:auto;}
header .header-general .svg-convert svg g>*, body.home header .header-general.scrolled .svg-convert svg g>* {fill: #00a9e0;transition: fill 0.1s ease-in-out}

header .header-general #menu-header-superieur .menu-patch {margin-top:0;}
header .header-general #menu-header-superieur .menu-patch a {background:#00a9e0;padding:8px 10px!important;color:white!important;}

header .header-general .hamburger-menu span {background-color:black;transition: 0.3s ease-in-out;}
body.home header .header-general .hamburger-menu span {background-color:white;transition: 0.3s ease-in-out;}
body.home header .header-general.scrolled .hamburger-menu span {background-color:black;transition: 0.3s ease-in-out;}

header .header-general #menu-header-menu-fr>li {height:75px;}

.et-menu-nav li>a {padding:0!important;}

.et-menu-nav .uline>a:hover:before {
    transform: scaleX(1);
    transform-origin: left;
}

.et-menu-nav .uline>a {
    display: inline-flex;
    white-space: nowrap;
}

.et-menu-nav .uline>a:before{
    background-color: currentColor;
    bottom: 25px;
    content: "";
    height: 1.5px;
    left: 0;
    position: absolute;
    right: 0;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .75s cubic-bezier(.19,1,.22,1);
}

/*----SUB-MENU----*/
.sousmenu a:after {display:none!important;}
header .header-general .nav .sousmenu ul.sub-menu {
	margin-top: 0;
    position: fixed;
    width: 100vw;
    left: 0;
    border: none;
    top: 84px;
    padding: 25px 5%;
    background-color: white !important;
    box-shadow: none;
    transition: all .3s ease-in-out;
    display: flex;
    justify-content: space-between;
}

header .header-general #menu-header-menu-fr .sub-menu>li {min-width:300px;width:30%;padding:0;}
header .header-general #menu-header-menu-fr .sub-menu>li a {width:100%;}

header .header-general:has(.sousmenu:hover) {
    background-color: white!important;
	border-bottom:1px solid #cccccc;
    transition: all 0.2s ease-in-out;
}

header .header-general:has(.sousmenu:hover) .et_pb_menu__logo svg g>*  {fill:#00a9e0;transition: all 0.3s ease-in-out;}
header .header-general:has(.sousmenu:hover) .et_pb_menu ul li a{
    color: black!important;
    transition: all 0.3s ease-in-out;
}
body:has(.sousmenu:hover) {overflow:hidden;}
body:has(.sousmenu:hover) #et-main-area::after {
	content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; /* Prend toute la largeur de l'élément */
    height: 100%; /* Prend toute la hauteur de l'élément */
    background-color: rgba(0, 0, 0, 0.5); /* Noir avec 10% d'opacité */
    pointer-events: none; /* Permet de cliquer à travers le filigrane */
    z-index: 1;
    transition: all 0.3s ease-in-out;
}

header .header-general .sub-menu a img.menu-featured-image {
	display: block;
    width: auto;
    height: auto;
    max-height: 200px;
    margin: 0 0 25px 0;
    border-radius: 25px;
}

header .header-general ul.sub-menu>li>a {
	font-size: 2vw;
    font-family: 'BeVietnamPro-medium', sans-serif;
    line-height: 1em;
    letter-spacing: -1px;
}

header .header-general ul.sub-menu li a:hover {
    background-color:white!important;opacity:1;
}

/*----GENERAL----*/
body.page-id-841 #page-container, body.page-id-961 #page-container {padding-top:100px;}

body #page-container a.et_pb_button.large-btn:after {right:18px;font-size: 3rem !important;}

.vertical-align {
	display:flex;
	flex-direction:column;
	justify-content:center;
}
.bottom-align {
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
}
.between-align {
	display:flex;
	flex-direction:column;
	justify-content:space-between;
}

.textline {border-bottom:0.05em solid black!important;} .textline.accent-color {border-color:#00a9e0!important;}

.black {font-family:'BeVietnamPro-black', sans-serif;font-weight:900;}

a.et_pb_button.large-btn {padding:15px 75px 15px 30px!important;}

.play-icon::before{
	content: 'I';
    display: inline-block;
	left: auto;
    font-family: ETmodules !important;
    font-weight: 400 !important;
}
.bullet-point.color-white::before{background-color:white;}
.bullet-point.color-black::before{background-color:black;}

.bascule-service .et_pb_toggle {
	padding:0;margin-bottom:25px;
}
.bascule-service .et_pb_toggle .et_pb_toggle_title::before {display:none;}

.rotating-circle {
    width: 100px!important;
    height: 100px!important;
    background-color: transparent;
    border-radius: 50%;
    animation: rotate 5s linear infinite;
}
.rotating-circle img {width:100px!important;height: 100px!important;}

@keyframes rotate {
    from {
        transform: rotate(0deg); /* Départ de la rotation */
    }
    to {
        transform: rotate(360deg); /* Fin de la rotation */
    }
}

.strate-animTitle {
    background-color: var(--strate-animTitle-bg-color);
    grid-column: full;
    overflow: hidden;
    padding: max(6.25vw, 4rem) 0;
}

.strate-animTitle__animCtn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: max(4vw, 2rem);
}

.strate-animTitle__scroll {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-animation: infiniteRotation;
    animation: infiniteRotation;
    -webkit-animation-duration: 30s;
    animation-duration: 30s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

.animTitle {
    color: var(--title-color);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: clamp(2.25em, 6vw, 5.625em);
    font-weight: 600;
    line-height: 1;
    margin-right: .45em;
    white-space: nowrap;
}

/*----FORMULAIRE DE CONTACT / DEMANDE DE SOUMISSION-----*/
/* Conteneur principal */
.form-container {
  display: flex;
  gap: 40px;
  color: #f0f0f0;
  padding: 0;
}

.form-container .form-column h3 {
	text-transform:uppercase;
	font-family:'BeVietnamPro-bold',sans-serif;
	font-size:5vw;
}

/* Colonnes */
.form-column {
  flex: 1;
  min-width: 300px;
}

/* Titres de sections */
.form-container .form-column h3 {
    color: #666666;
    margin-bottom: 20px;
    font-size: 1.4em;
    border-top: 1px solid #666666;
    padding-top: 15px;
	text-transform:uppercase;
	font-family:'BeVietnamPro-bold',sans-serif;
}

/* Champs du formulaire */
.form-container .form-column textarea, .form-container .form-column select, .form-container .form-column input[type="text"], .form-container .form-column input[type="email"], .form-container .form-column input[type="tel"], .form-container .form-column input[type="checkbox"], .form-container .form-column input[type="radio"] {
  width: 100%;
  padding: 12px;
  margin-bottom: 15px;
  border: 1px solid #333;
  border-radius: 5px;
  background-color: #222;
  color: #f0f0f0;
}
.form-container .form-column .wpcf7-checkbox, .form-container .form-column .wpcf7-radio {
  display: block;
  width: 100%;
  padding: 12px;
  margin-bottom: 15px;
  border: 1px solid #333;
  border-radius: 5px;
  background-color: #222;
  color: #f0f0f0;
}

.form-container .form-column input[type="checkbox"], .form-container .form-column input[type="radio"] {
  width: auto;
  margin-bottom:3px;
}


/* Labels */
.form-container .form-column label {
  display: inline-block;
  margin-bottom: 5px;
  color: #eeeeee;
  font-weight: bold;
}
.form-container .form-column p {padding-bottom:0;margin-top:15px;}
.form-container .form-column p:first-child {margin-top:0;}

/* Style pour aligner les checkbox à gauche du label */
.form-container .form-column .wpcf7-checkbox span.wpcf7-list-item, .form-container .form-column .wpcf7-radio span.wpcf7-list-item {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  margin-left:0;
}

.form-container .form-column .wpcf7-checkbox span.wpcf7-list-item.last, .form-container .form-column .wpcf7-checkbox span.wpcf7-list-item.last label, .form-container .form-column .wpcf7-radio span.wpcf7-list-item.last, .form-container .form-column .wpcf7-radio span.wpcf7-list-item.last label {
  margin-bottom:0;
}

.form-container .form-column .wpcf7-checkbox span.wpcf7-list-item label, .form-container .form-column .wpcf7-radio span.wpcf7-list-item label {
  display: flex;
  align-items: center;
  width:100%;
}

.form-container .form-column .wpcf7-checkbox input[type="checkbox"], .form-container .form-column .wpcf7-radio input[type="radio"] {
  margin-right: 10px; /* Espace entre la checkbox et le label */
  transform: scale(1.1); /* Ajuster la taille de la checkbox si besoin */
}

.form-container .form-column .wpcf7-checkbox .wpcf7-list-item-label  {
  cursor: pointer;
}

.form-submit {
  text-align: center;
  width: 100%;
  margin-top: 20px;
}

.form-submit input[type="submit"] {
  padding: 12px 30px;
  background-color: #00a9e0;
  color: #fff;
  font-family:'BeVietnamPro-bold', sans-serif;
  text-transform:uppercase;
  border: none;
  border-radius: 0;
  font-size: 16px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  margin-left:48px;
}

.form-submit input[type="submit"]:hover {
  background-color: #038dbf;
}

.form-submit input[type="submit"]:focus {
  outline: none;
}

.form-container .wpcf7-not-valid-tip {
	margin-top:-10px;
}
#soumission .wpcf7-response-output {
	color:white;
}

/* Responsiveness pour petits écrans */
@media (max-width: 768px) {
  .form-container {
    flex-direction: column;
  }
}