@charset "UTF-8";
@font-face {
  font-family: "Solway";
  src: url("/bibliotheques/css/fonts/Solway-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Solway";
  src: url("/bibliotheques/css/fonts/Solway-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "Solway";
  src: url("/bibliotheques/css/fonts/Solway-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: "Solway";
  src: url("/bibliotheques/css/fonts/Solway-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Solway";
  src: url("/bibliotheques/css/fonts/Solway-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
.tab-container {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.tab-buttons {
  display: flex;
  justify-content: flex-end;
  background-color: #333;
  position: fixed; /* Fixe la barre des onglets */
  top: 0; /* La garde en haut de la page */
  width: 100%; /* Assure qu'elle prend la largeur complète */
  z-index: 1; /* Garantit que la barre est au-dessus des autres éléments */
  background-color: #333; /* Arrière-plan pour la barre d'onglets */
  display: flex;
  justify-content: flex-end;
  padding: 10px 0; /* Ajoute de l'espacement pour la rendre plus lisible */
}

.tab-button {
  padding: 10px 20px;
  cursor: pointer;
  background-color: #444;
  color: white;
  border: none;
  outline: none;
  border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  -ms-border-radius: 5px 5px 0 0;
  -o-border-radius: 5px 5px 0 0;
  /**/
  /***/
  /****/
}

@media screen and (orientation: portrait) and (max-width: 380px) {
  .tab-button {
    padding: 5px 5px;
    font-size: 12px;
    border: solid rgb(255, 193, 7) 1px;
  }
}
.couper {
  display: none;
}

.tab-button::active {
  background-color: red;
}

.tab-button:hover {
  background-color: #ffc107;
}

.tab-content {
  display: none;
  padding: 0px;
  background-color: transparent;
}

.tab-content.tab-active {
  display: block;
  border-bottom: 3px solid #ffc107; /* Accentuation de l'onglet actif */
}

.but-active {
  background-color: #ffc107;
}

a {
  text-decoration: none;
  color: white;
}

body,
html {
  height: 100%;
  margin: 0;
  font: 400 15px/1.8 "Lato", sans-serif;
  color: white;
}

h1 {
  display: inline-block;
  font-size: 25px;
  font-family: "Solway-Regular";
  text-align: center;
}

h2 {
  display: inline-block;
  font-family: "Solway-Regular";
  font-size: 20px;
  text-align: center;
  color: white;
}

h3 {
  font-family: "Solway-Regular";
  font-size: 20px;
  padding-left: 50px;
  padding-right: 50px;
  letter-spacing: 2px;
  text-align: center;
}

@media screen and (orientation: portrait) and (max-width: 360px) {
  h3 {
    padding-top: 10px;
    padding-left: 0px;
    padding-right: 0px;
    font-size: 18px;
  }
}
h4 {
  display: inline-block;
  color: white;
  padding-left: 75px;
  padding-right: 75px;
}

@media screen and (max-width: 380px) {
  h4 {
    padding-left: 5px;
    padding-right: 5px;
  }
}
.bgimg-1,
.bgimg-2,
.bgimg-3,
.bgimg-4,
.bgimg-5,
.bgimg-6,
.bgimg-7,
.bgimg-8,
.bgimg-9,
.bgimg-10,
.bgimg-11,
.bgimg-12,
.bgimg-13,
.bgimg-14,
.bgimg-15,
.bgimg-16,
.bgimg-17,
.bgimg-18,
.bgimg-19,
.bgimg-20,
.bgimg-21,
.bgimg-22,
.bgimg-23,
.bgimg-24,
.bgimg-25,
.bgimg-26,
.bgimg-27,
.bgimg-28,
.bgimg-29,
.bgimg-30,
.bgimg-31,
.bgimg-32,
.bgimg-33,
.bgimg-34,
.bgimg-35,
.bgimg-36,
.bgimg-37,
.bgimg-38,
.bgimg-39,
.bgimg-40,
.bgimg-41,
.bgimg-52,
.bgimg-43,
.bgimg-44,
.bgimg-45,
.bgimg-46,
.bgimg-47,
.bgimg-48,
.bgimg-49 {
  position: relative;
  opacity: 0.95;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.caption {
  display: flex;
  flex-direction: row;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  text-align: center;
  color: #000;
}

.caption span.border {
  background-color: rgba(17, 17, 17, 0.4784313725);
  color: #fff;
  padding: 18px;
  font-size: 25px;
  letter-spacing: 10px;
}

.nodeco .nodeco a:hover .nodeco a:focus {
  text-decoration: none !important;
  color: inherit !important;
  background: none !important;
  border: none !important;
}

.nodeco:hover {
  text-decoration: none !important;
  color: inherit !important;
  background: none !important;
  border: none !important;
}

.border {
  background-color: rgba(17, 17, 17, 0.4784313725);
  color: #fff;
  padding: 18px;
  letter-spacing: 10px;
  margin-left: 62px;
  margin-right: 62px;
}

@media screen and (orientation: portrait) and (max-width: 360px) {
  .border {
    margin-left: 62px;
    margin-right: 62px;
    letter-spacing: 0px;
  }
}
@media screen and (orientation: portrait) and (max-width: 810px) {
  .border {
    margin-left: 62px;
    margin-right: 62px;
    letter-spacing: 0px;
  }
}
@media screen and (orientation: landscape) and (max-width: 1050px) {
  .border {
    margin-left: 62px;
    margin-right: 62px;
    letter-spacing: 0px;
  }
}
@media screen and (orientation: landscape) and (max-width: 750px) {
  .border {
    margin-left: 62px;
    margin-right: 62px;
    letter-spacing: 0px;
  }
}
.noborder {
  display: block;
  background-color: transparent;
  padding: 0px;
  letter-spacing: 1px;
}

p {
  padding-left: 75px;
  padding-right: 75px;
}

@media only screen and (max-width: 1280px) {
  p {
    padding-left: 5px;
    padding-right: 5px;
  }
}
@media only screen and (max-width: 600px) {
  p {
    padding-left: 1px;
    padding-right: 1px;
  }
}
ul {
  padding-left: 125px;
  padding-right: 125px;
}

@media only screen and (max-width: 1280px) {
  ul {
    padding-left: 5px;
    padding-right: 5px;
  }
}
.texteNoir {
  color: #ddd;
  background-color: #282e34;
  text-align: center;
  padding-left: 20vw;
  padding-right: 20vw;
  padding-top: 5vh;
  padding-bottom: 5vh;
  text-align: justify;
}

.texteBlanc {
  background-color: white;
  padding-left: 20vw;
  padding-right: 20vw;
  padding-top: 5vh;
  padding-bottom: 5vh;
  text-align: center;
  text-align: justify;
  color: #777;
}

/* Turn off parallax scrolling for tablets and phones 
  @media only screen and (max-device-width: 360px) {
      .bgimg-1, .bgimg-2, .bgimg-3, .bgimg-4, .bgimg-5, .bgimg-6, .bgimg-7, .bgimg-8, .bgimg-9 {
        background-attachment: scroll;
      }
    }
    */
.p-virtuelle {
  color: #ddd;
  background-color: #282e34;
  text-align: center;
  padding: 5vh 20vw;
  text-align: justify;
}

@media screen and (orientation: portrait) and (max-width: 360px) {
  .p-virtuelle {
    padding: 5vh 10vw;
  }
}