/*  GENERAL  */
:root{
  /* https://codepen.io/emdeoh/pen/zYOQOPB */
/* --bs-blue: #0d6efd; */
/* --bs-indigo: #6610f2; */
/* --bs-purple: #6f42c1; */
/* --bs-pink: #d63384; */
/* --bs-red: #dc3545; */
/* --bs-orange: #fd7e14; */
/* --bs-yellow: #ffc107; */
/* --bs-green: #198754; */
/* --bs-teal: #20c997; */
/* --bs-cyan: #0dcaf0; */
/* --bs-black: #000; */
/* --bs-white: #fff; */
/* --bs-gray: #6c757d; */
/* --bs-gray-dark: #343a40; */
/* --bs-gray-100: #f8f9fa; */
/* --bs-gray-200: #e9ecef; */
/* --bs-gray-300: #dee2e6; */
/* --bs-gray-400: #ced4da; */
/* --bs-gray-500: #adb5bd; */
/* --bs-gray-600: #6c757d; */
/* --bs-gray-700: #495057; */
/* --bs-gray-800: #343a40; */
/* --bs-gray-900: #212529; */
--bs-primary: #03a1ab;
--bs-secondary: #552e59;
/* --bs-success: #198754; */
/* --bs-info: #0dcaf0; */
/* --bs-warning: #ffc107; */
/* --bs-danger: #dc3545; */
/* --bs-light: #f8f9fa; */
/* --bs-dark: #212529; */
--bs-primary-rgb: 3, 161, 171;
--bs-secondary-rgb: 85, 46, 89;
/* --bs-success-rgb: 25, 135, 84; */
/* --bs-info-rgb: 13, 202, 240; */
/* --bs-warning-rgb: 255, 193, 7; */
/* --bs-danger-rgb: 220, 53, 69; */
/* --bs-light-rgb: 248, 249, 250; */
/* --bs-dark-rgb: 33, 37, 41; */
--bs-primary-text-emphasis: #026167;
--bs-secondary-text-emphasis: #331c35;
/* --bs-success-text-emphasis: #0a3622; */
/* --bs-info-text-emphasis: #055160; */
/* --bs-warning-text-emphasis: #664d03; */
/* --bs-danger-text-emphasis: #58151c; */
/* --bs-light-text-emphasis: #495057; */
/* --bs-dark-text-emphasis: #495057; */
--bs-primary-bg-subtle: #cdecee;
--bs-secondary-bg-subtle: #ddd5de;
/* --bs-success-bg-subtle: #d1e7dd; */
/* --bs-info-bg-subtle: #cff4fc; */
/* --bs-warning-bg-subtle: #fff3cd; */
/* --bs-danger-bg-subtle: #f8d7da; */
/* --bs-light-bg-subtle: #fcfcfd; */
/* --bs-dark-bg-subtle: #ced4da; */
--bs-primary-border-subtle: #028189;
--bs-secondary-border-subtle: #442547;
/* --bs-success-border-subtle: #a3cfbb; */
/* --bs-info-border-subtle: #9eeaf9; */
/* --bs-warning-border-subtle: #ffe69c; */
/* --bs-danger-border-subtle: #f1aeb5; */
/* --bs-light-border-subtle: #e9ecef; */
/* --bs-dark-border-subtle: #adb5bd; */
/* --bs-white-rgb: 255, 255, 255; */
/* --bs-black-rgb: 0, 0, 0; */
/* --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)); */
--bs-body-font-family:  "Source Sans 3", serif;
--secondary-font: "mogra", serif;
/* --bs-body-font-size: 1rem; */
--bs-body-font-weight: 300;
/* --bs-body-line-height: 1.5; */
--bs-body-color: #4e4e4e;
--bs-body-color-rgb: 78, 78, 78;
--bs-body-bg: #f5f5f5;
--bs-body-bg-rgb: 245, 245, 245;
--bs-emphasis-color: #240915;
--bs-emphasis-color-rgb: 36, 9, 21;
/* --bs-secondary-color: rgba(33, 37, 41, 0.75); */
/* --bs-secondary-color-rgb: 33, 37, 41; */
/* --bs-secondary-bg: #e9ecef; */
/* --bs-secondary-bg-rgb: 233, 236, 239; */
/* --bs-tertiary-color: rgba(33, 37, 41, 0.5); */
/* --bs-tertiary-color-rgb: 33, 37, 41; */
/* --bs-tertiary-bg: #f8f9fa; */
/* --bs-tertiary-bg-rgb: 248, 249, 250; */
/* --bs-heading-color: inherit; */
/* --bs-link-color: #0d6efd; */
/* --bs-link-color-rgb: 13, 110, 253; */
/* --bs-link-decoration: underline; */
/* --bs-link-hover-color: #0a58ca; */
/* --bs-link-hover-color-rgb: 10, 88, 202; */
/* --bs-code-color: #d63384; */
/* --bs-highlight-color: #212529; */
/* --bs-highlight-bg: #fff3cd; */
/* --bs-border-width: 1px; */
/* --bs-border-style: solid; */
/* --bs-border-color: #dee2e6; */
/* --bs-border-color-translucent: rgba(0, 0, 0, 0.175); */
/* --bs-border-radius: 0.375rem; */
/* --bs-border-radius-sm: 0.25rem; */
/* --bs-border-radius-lg: 0.5rem; */
/* --bs-border-radius-xl: 1rem; */
/* --bs-border-radius-xxl: 2rem; */
/* --bs-border-radius-2xl: var(--bs-border-radius-xxl); */
/* --bs-border-radius-pill: 50rem; */
/* --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); */
/* --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); */
/* --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175); */
/* --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075); */
/* --bs-focus-ring-width: 0.25rem; */
/* --bs-focus-ring-opacity: 0.25; */
/* --bs-focus-ring-color: rgba(13, 110, 253, 0.25); */
/* --bs-form-valid-color: #198754; */
/* --bs-form-valid-border-color: #198754; */
/* --bs-form-invalid-color: #dc3545; */
/* --bs-form-invalid-border-color: #dc3545; */
}
.secondary-font{font-family: var(--secondary-font);}
.btn-secondary {
  --bs-btn-color: var(--bs-white);
  --bs-btn-bg: var(--bs-secondary);
  --bs-btn-border-color: var(--bs-secondary-border-subtle);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary-border-subtle);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary-border-subtle);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.5);
}
.btn-primary {
  --bs-btn-color: var(--bs-white);
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary-border-subtle);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-secondary);
  --bs-btn-hover-border-color: var(--bs-secondary);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-secondary);
  --bs-btn-active-border-color:var(--bs-secondary-border-subtle);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.5);
  --bs-btn-disabled-color: var(--bs-white);
  --bs-btn-disabled-bg: var(--bs-primary-bg-subtle);
  --bs-btn-disabled-border-color: var(--bs-primary-border-subtle);
}

/* NAVBAR */

.navbar-b {
  transition: all .5s ease-in-out;
  background-color: transparent;
}
.navbar-b.navbar-trans .navbar-brand {
  background: url( "../img/logo-w.svg") no-repeat;
	width: 50%;
	height: 1.6rem;	
}
.navbar-toggler:focus {
  box-shadow: none;
}
.navbar-b.navbar-trans .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.navbar-nav .nav-link {
  color: rgba(var(--bs-white-rgb), .65);
}
.navbar-nav .nav-link.active, .navbar-nav .nav-link:hover {
  color: var(--bs-white);
}

.navbar-b.navbar-reduce {
  box-shadow: 0px 6px 9px 0px rgba(0, 0, 0, 0.06);
}
.navbar-b.navbar-reduce .nav-link{
  color: rgba(var(--bs-body-rgb), .65);
}
.navbar-b.navbar-reduce .nav-link.active, .navbar-b.navbar-reduce .nav-link:hover {
  color: var(--bs-body);
}
.navbar-b.navbar-trans .nav-link:before,
.navbar-b.navbar-reduce .nav-link:before {
  content: '';
  position: absolute;
  margin-left: 0px;
  width: 0%;
  bottom: 0;
  left: 0;
  height: 2px;
  transition: all 500ms ease;
  border-radius: 10px;
}
.navbar-b.navbar-trans .nav-link:before {
  background-color: #fff;
}
.navbar-b.navbar-trans .nav-link:hover:before,
.navbar-b.navbar-reduce .nav-link:hover:before {
  width: 35px;
}
.navbar-b.navbar-trans .nav-link.active:before,
.navbar-b.navbar-reduce .nav-link.active:before{
  width: 35px;
} 

@media (min-width: 768px) {
  .navbar-b.navbar-trans .nav-link:before, .navbar-b.navbar-reduce .nav-link:before {
      margin-left: 10px;
  }
}

.navbar-b.navbar-reduce {
  transition: all .5s ease-in-out;
  background-color: #fff;
}


.navbar-b.navbar-reduce .nav-link:before {
  background-color: var(--bs-primary);
}

.navbar-b.navbar-reduce .nav-link:hover {
  color: var(--bs-primary);
}

.navbar-b.navbar-reduce .show > .nav-link,
.navbar-b.navbar-reduce .active > .nav-link,
.navbar-b.navbar-reduce .nav-link.show,
.navbar-b.navbar-reduce .nav-link.active {
  color: #03a1ab;
}

.navbar-b.navbar-reduce .navbar-brand {
  color: #03a1ab;
}

.navbar-b.navbar-reduce .navbar-brand {
  background: url( "../img/logo.svg") no-repeat;
		width: 50%;
	height: 1.6rem;
}

section {
  scroll-margin-top: 100px; /* hauteur de la navbar */
}

/*  PORTFOLIO  */
body {
  overflow-x: hidden;
}
.card[data-lightbox]:hover {cursor: pointer;border-color: var(--bs-primary)}
.lightbox-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  display: none;
  z-index: 9998;
}
.no-scroll {
  overflow: hidden;
  height: 100vh;
}
.lightbox {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: none;
  z-index: 9999;
}
@media (max-width: 1024px) {
  .lightbox {
      top: 0;
  left: 0;
  transform: inherit;
  padding-top: 2rem;
  padding-bottom: 1rem;
  height: 100%;
  overflow-y: auto;
    overscroll-behavior-x: contain;
  touch-action: pan-y;
        overflow-x: hidden;
  }
}
.lb-image {
  max-height: 95vh;
    object-fit: contain;
}
.lb-caption {
  max-height: 95vh;
  /* overflow-y: auto; */
}
.lb-close {
  position: absolute;
  top: -70px;
  right: -50px;
  font-size: 50px;
  color: white;
  cursor: pointer;
}
@media (max-width: 1024px) {
  .lb-close {
    right: 1rem;
    top: -1rem;
  }
  .lb-caption {
  max-height: inherit;
}
}

.lb-process ul {    margin: 0;
    padding-left: 1.15rem;}
.lb-process ul li { padding-bottom: .5rem }
code {
    color: var(--bs-primary);
}
.lb-nav {
  display: flex;
  justify-content: space-between;
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
}

.lb-prev, .lb-next {
  background: transparent;
  border: none;
  font-size: 30px;
  cursor: pointer;
  padding: 10px;
  color: white;
}
.lb-prev{ transform: translateX(-40px);}
.lb-next{ transform: translateX(40px);}
@media (max-width: 1024px) {
  .lb-nav {
        /* justify-content: center;
        position: absolute;
        top: 100%;
        transform: translateY(50%); */
        display: none;
}
}

/*  CONTACT  */
.form-control:focus {
  border-color: var(--bs-primary);
  box-shadow: none;
}

/* .lightbox-inner {
  display: flex;
  flex-direction: column;
  max-width: 90vw;
  max-height: 90vh;
  overflow: hidden;
  border-radius: 10px;
} 
@media (min-width: 992px) {
  .lightbox-inner {
    flex-direction: row;
  }
}
*/
/*  BUTTON  */
.button:focus {
  outline: 0;
}

.btn-close:focus {
  outline: 0;
  box-shadow: none;

}

/*avant apres*/
.before-after:before {
  content: '';
  display: block;
 padding-bottom: 275px;
}
.before-after .slide {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
 height: 275px;
  background-repeat: no-repeat;
}
.before-after .slide.before {
  right: 50%;
}
.before-after .handle {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 24px;
  left: 50%;
  margin-left: -12px;
  cursor: ew-resize;
  overflow: hidden;
}
.before-after .handle:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  width: 2px;
  height: 350px;
  left: 10px;
  background: var(--bs-primary);
  box-shadow: rgba(0, 0, 0, 0.6) 0 0 10px;
}
.before-after .handle:after {
  position: absolute;
  content: '';
  display: block;
  top: 50%;
  left: 50%;
  width: 24px;
  height: 24px;
  margin-left: -12px;
  margin-top: -12px;
  background: var(--bs-primary) url(../img/move.svg) no-repeat;
  border-radius: 2px;
  box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
}

.console-underscore {display:inline-block;position: relative!important;top: -0.14em;animation: blink 1s infinite step-end alternate;}
  @keyframes blink { 50% { opacity: 0; }}

  .btn.disabled, .btn:disabled, fieldset:disabled .btn {
    color: var(--bs-btn-disabled-color);
    pointer-events: none;
    background-color: var(--bs-btn-disabled-bg);
    border-color: var(--bs-btn-disabled-border-color);
    opacity: var(--bs-btn-disabled-opacity);
}
/* .portfolio-grid .all img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 4 / 3; 
  object-fit: cover;
} */