/*!
Theme Name: STARTEO Starter Theme
Author: Starteo
Author URI: https://www.starteo.pro
Description: 
Version: 1.0
Requires at least: 5.0
Tested up to: 5.7
Requires PHP: 7.2
Text Domain: gbdi-starter
*/

/* Don't overwrite this file. Compile "/assets/main.(less|scss)" to "/assets/css/main.css" */

/* From http://codex.wordpress.org/CSS */

/* GENERAL */
/*
@font-face {
	font-family: "Ganton";
	src: url(assets/_fonts/Ganton.otf) format("opentype");
}
*/

.body {
  font-family: "museo-sans", sans-serif;
  font-weight: 300;
  font-style: normal;
  color: #000000;
  font-size: 16px;
  line-height: 22px;
}

a {
  color: #000000;
}

.back-to-top {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 10px; /* Place the button at the bottom of the page */
  right: 10px; /* Place the button 30px from the right */
  z-index: 999; /* Make sure it does not overlap */
  outline: none; /* Remove outline */
  cursor: pointer; /* Add a mouse pointer on hover */
  font-size: 20px; /* Increase font size */
  color: #ffffff;
  background: #006ea2;
  /* border: solid 1px #F4C000; */
  border-radius: 5px;
  padding: 14px 16px;
  transition: background-color 0.3s, opacity 0.5s, visibility 0.5s;
  opacity: 0;
  visibility: hidden;
}

.back-to-top.show {
  opacity: 1;
  visibility: visible;
}

.back-to-top:hover {
  background-color: #e2eef5;
}

.alban-bg-blue-light {
  background-color: #e2eef5;
}

.alban-bg-blue {
  background-color: #006ea2;
}

.alban-blue-light {
  color: #e2eef5;
}

.alban-blue {
  color: #006ea2;
}

.alban-white {
  color: #ffffff;
}
/* GENERAL */

/* HEADER */
.gbdi-header {
  background-color: #efefef;
}

.gbdi-header-home-link img {
  max-height: 140px;
}
/* HEADER */

/* FOOTER */
.alban-footer {
  padding-block: 101px;
}

.alban-footer-social-icons {
  gap: 15px;
}

.alban-footer-social-icons .facebook-icon,
.alban-footer-social-icons .insta-icon,
.alban-footer-social-icons .linkedin-icon {
  cursor: pointer;
  transition: content 0.3s ease-in-out;
}

.alban-footer-social-icons .facebook-icon:hover {
  content: url("assets/images/alban-pano-facebook-hover.svg");
}

.alban-footer-social-icons .insta-icon:hover {
  content: url("assets/images/alban-pano-insta-hover.svg");
}

.alban-footer-social-icons .linkedin-icon:hover {
  content: url("assets/images/alban-pano-linkedin-hover.svg");
}

.alban-footer-address {
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 24px;
  line-height: 30px;
}

.alban-footer-btn {
  text-transform: uppercase;
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 24px;
  line-height: 30px;
  border: 2px solid #000000;
  border-radius: 60px;
  padding: 8px 33px;
  transition: background-colo 0.3se ease-in-out;
}

.alban-footer-btn:hover {
  background-color: #000000;
  color: #e2eef5;
}

/* FOOTER */

/* HOME */
.alban-banner {
  background-image: url("assets/images/alban-banner-bg.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 58px;
}

.alban-banner-button {
  height: 45px;
  width: 228px;
  background-color: #ffffff;
  color: #006ea2;
  border-radius: 60px;
  text-transform: uppercase;
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 24px;
  line-height: 30px;
  padding: 8px 30px;
  transition: background-color 0.3s ease-in-out;
}

.alban-banner-button a {
  color: #006ea2;
  transition: color 0.3s ease-in-out;
}

.alban-banner-button:hover {
  background-color: #006ea2;
  color: #e2eef5;
}

.alban-banner-button a:hover {
  color: #e2eef5;
}

.alban-banner-video {
  padding-top: 52px;
  position: relative;
}

#alban-banner-video-toggle-sound {
    position: absolute; 
    bottom: 20px;       
    right: 20px;        
    z-index: 10;        
    background: transparent; 
    border: none;           
    cursor: pointer;        
    padding: 0;
    color: white; 
    font-size: 2.5rem;
    text-shadow: 0 0 5px rgba(0,0,0,0.5); 
    transition: transform 0.2s ease-in-out; 
}

#alban-banner-video-toggle-sound:hover {
    transform: scale(1.1);
}

.alban-banner-video video {
  width: 100%;
  height: auto;
}

.alban-banner-video-deco {
  height: 26px;
  width: 100%;
  background-color: #006ea2;
  position: relative;
  top: -7px;
  margin-bottom: 145px;
}

.alban-sec1 {
  margin-top: 50px;
  margin-bottom: 200px;
}

.alban-sec2-button {
  height: 45px;
  width: 228px;
  background-color: #006ea2;
  color: #ffffff;
  border-radius: 60px;
  text-transform: uppercase;
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 24px;
  line-height: 30px;
  padding: 8px 30px;
  transition: background-color 0.3s ease-in-out;
  margin-bottom: 100px;
}

.alban-sec2-button a {
  color: #ffffff;
  transition: color 0.3s ease-in-out;
}

.alban-sec2-button:hover {
  background-color: #e2eef5;
  color: #006ea2;
}

.alban-sec2-button a:hover {
  color: #006ea2;
}

.alban-sec1-img-fleuve {
  height: 860px;
  width: auto;
  object-fit: contain;
}

.alban-sec1-content {
  font-size: 16px;
  line-height: 22px;
}

.alban-sec1-content strong {
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.alban-sec1-conclusion {
  font-size: 16px;
  line-height: 19px;
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.alban-sec2-intro {
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
  margin-bottom: 43px;
}

.alban-sec2-content {
  font-size: 16px;
  line-height: 22px;
  padding-right: 40px;
}

.alban-sec2-content strong {
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.alban-sec3 {
  padding-block: 185px;
}

.alban-sec3-title {
  text-transform: uppercase;
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 40px;
  line-height: 30px;
}

.alban-sec3-intro {
  font-size: 30px;
  line-height: 30px;
  margin-bottom: 115px;
}

.alban-form-title {
  text-transform: uppercase;
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 30px;
  line-height: 30px;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="email"],
.wpcf7 textarea,
.alban-form-label-style {
  color: #000000;
  text-transform: uppercase;
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 20px;
  line-height: 30px;
  padding: 20px 36px;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="email"],
.alban-form-label-style {
  width: 100%;
}

.wpcf7-form-control-wrap[data-name="idees"] textarea {
  width: 100%;
  height: 188px;
}

.wpcf7-form-control-wrap[data-name="problemes"] textarea,
.wpcf7-form-control-wrap[data-name="benefices"] textarea {
  width: 100%;
  height: 140px;
}

.wpcf7-list-item-label {
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
  color: #000000;
  font-size: 20px;
  line-height: 30px;
}

::placeholder {
  color: #000000;
}

.wpcf7-form input,
.wpcf7-form select {
  border: 2px solid #000000;
  border-radius: 70px;
}

.wpcf7-form textarea {
  border: 2px solid #000000;
  border-radius: 40px;
}

.wpcf7-form-control-wrap {
  position: relative;
  display: block;
}

.wpcf7-form-control-wrap:has(input.wpcf7-validates-as-required)::after,
.wpcf7-form-control-wrap[data-name="idees"]::after {
  content: " *";
  color: #006ea2 !important;
  font-weight: 900;
  font-style: normal;
  font-size: 20px;
  position: absolute;
  pointer-events: none;
  z-index: 10;
}

.wpcf7-form-control-wrap[data-name="nom"]::after {
  left: 166px;
  top: 50%;
  transform: translateY(-50%);
}

.wpcf7-form-control-wrap[data-name="prenom"]::after {
  left: 207px;
  top: 50%;
  transform: translateY(-50%);
}

.wpcf7-form-control-wrap[data-name="idees"]::after {
  left: 357px;
  top: 21px;
  transform: none;
}

.wpcf7 input[type="radio"] {
  width: 30px;
  height: 30px;
  vertical-align: middle;
  margin-right: 15px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 1px solid #000000;
  border-radius: 50%;
  position: relative;
  vertical-align: middle;
  margin-right: 15px;
  outline: none;
}

.wpcf7 input[type="radio"]:checked {
  border-color: #000000;
}

.wpcf7 input[type="radio"]:checked::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: #006ea2;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.wpcf7-form-control-wrap[data-name="liste-publique"] .wpcf7-radio {
  margin-left: 119px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 20px;
}

.wpcf7-form-control-wrap[data-name="liste-publique"] .wpcf7-list-item.last {
  grid-column: 1 / span 2;
}

.wpcf7-form-control-wrap[data-name="categories"] .wpcf7-radio {
  margin-left: 119px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px 20px;
}

.wpcf7-form input.wpcf7-submit {
  text-transform: uppercase;
  font-family: "museo-sans", sans-serif;
  font-weight: 900;
  font-style: normal;
  color: #000000;
  font-size: 20px;
  line-height: 30px;
  border: 2px solid #000000;
  border-radius: 70px;
  padding: 20px 90px;
  background-color: #ffffff;
  margin-top: 50px;
}

.wpcf7-form input.wpcf7-submit:hover {
  background-color: #000000;
  color: #ffffff;
}

/* HOME */