@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,300;0,400;0,600;0,700;0,900;1,300;1,400;1,600;1,700;1,900&display=swap");

:root {
  --bs-success: #323232;
  --bs-info: #222222;
  --bs-dark: #161617;
  --bslight: #ffffff;
  --bs-primary: #b8ffcc;
  --bs-secondary: #6a9275;
  --Noto: "NotoSans", sans-serif;
}

/*------------- Styles Généraux -------------*/
body {
  background-color: var(--bs-dark);
  padding-top: 80px;
  overflow-x: hidden;
}

/*------------- Section Header -------------*/

.logo {
  max-width: 134px;
}

.timlogo {
  fill: var(--bs-primary);
  max-width: 100px;
}

.profil {
  width: 35px;
  height: 35px;
  object-fit: cover;
  border-radius: 50px;
}

span .navbar-toggler-icon {
  color: var(--bslight);
  width: 24px;
}

.navbar-toggler {
  padding: 0px 0px 0px 0px;
  border: none;
}

/*------------- Section Main -------------*/

a {
  text-decoration: none;
}

.form-search {
  border-color: var(--bs-primary);
  border-left: none;
  border-radius: 50px;
}

.form-control::placeholder {
  color: var(--bslight);
  font-size: 11px;
}

.input-group-text {
  border-radius: 50px;
  border-right: none;
  border-color: var(--bs-primary);
  color: var(--bs-primary);
}

.swiper-slide {
  width: auto;
}
.swiper-filters {
  width: auto;
}

.swiper-slide-artworks {
  width: 47%;
}

.no-bullets {
  width: 600px;
  padding-left: 0px;
  list-style-type: none;
}

.btn {
  margin-right: 5px;
  margin-top: 1rem;
  border-radius: 50px;
  font-size: 10px;
  font-weight: 800;
}

.card-vedette {
  background-color: var(--bs-info);
  max-width: 200px;
  border-radius: 11px;
  border: none;
}

.card-vedette:hover {
  background-color: var(--bs-success);
}

.card-autre {
  background-color: var(--bs-info);
  border-radius: 11px;
  border: none;
}

.card-autre:hover {
  background-color: var(--bs-success);
}

.card-body {
  padding: 10px;
}

.img-art {
  height: 20vh;
  border-top-left-radius: 11px;
  border-top-right-radius: 11px;
  object-fit: cover;
}

.img-autres {
  height: 20vh;
  border-top-left-radius: 11px;
  border-top-right-radius: 11px;
  object-fit: cover;
  object-position: top;
}

.artist {
  margin-bottom: 11px;
  font-size: 10px;
  font-weight: 200;
}

.artist-photo {
  width: 20px;
  height: 20px;
  object-fit: cover;
  border-radius: 50px;
  margin-right: 10px;
}

.date {
  font-size: 9px;
}

.informe {
  font-size: 9px;
  margin: 0px 0px 0px 0px;
}

.bi-calendar {
  font-size: 9px;
}

.bi-clock-fill {
  font-size: 9px;
}

.bi-chevron-right {
  font-size: 9px;
}

.vedette {
  overflow: hidden;
}

/*------------- Section Main Artwork -------------*/

.body-oeuvre {
  padding-top: 0px;
}

.oeuvre {
  position: relative;
  top: -15px;
  z-index: 1;
  border-radius: 11px;
}

.img-oeuvre {
  background-color: var(--bs-success);
  width: 100%;
  object-fit: cover;
  object-position: top;
  height: 33vh;
}

.bi-heart-fill {
  cursor: pointer;
  padding: 6px 9px 3.5px 9px;
  border-radius: 50%;
  font-size: 16px;
}

.bi-chevron-left {
  font-size: 20px;
}

.titre-oeuvre {
  font-size: 35px;
  margin-bottom: 0px;
}

.date-oeuvre {
  font-size: 12px;
}

.place {
  font-size: 12px;
}

.img-artist-card {
  width: 100%;
  border-top-left-radius: 11px;
  border-top-right-radius: 11px;
  height: 25vh;
  object-fit: cover;
  object-position: 0px 45%;
}

.card-artist {
  border-radius: 11px;
}

.text-taille {
  font-size: 12px;
}

.a-propos {
  font-size: 12px;
}

.accordion-item {
  border: none;
}

.titre-section {
  border-radius: 8px;
}

.btn-close {
  color: var(--bslight);
}

/*------------- Section Footer -------------*/

footer {
  padding: 1rem;
  background-color: var(--bs-info);
}

.projet {
  color: var(--bslight);
  font-weight: 100;
  font-size: 15px;
}