body {
  background-color: #000;
  color: #E0E0E0;
}

a, a:visited {
  color: #D7A86E;
  text-decoration: none;
}

a:focus,
a:hover,
a:active {
  color: #E6B86E;
  text-decoration: underline;
  background:none;
}

h1,.h1,
h2,.h2,
.header .spip_logo_site  {
  color: #B98A5D;
}

.sous-titre {margin-bottom:0.5em;}
.ttiki {font-size:0.9em;}
.spantd {
	display:inline-block;
	min-width:90px;
}

.hizkuntzak {
  position: absolute;
  top: 10px;
  right: 20px;
}


.page {
	width:1440px;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.header_banner {
  position: sticky;
  top: 0;
  width: 100%;
  z-index: 5;
  background-color: rgba(0, 0, 0, 0.8);
}

.page-row {
  display: flex;
  flex: 1;
  flex-wrap: wrap;  /* Permet à la mise en page de s'adapter si besoin */
  min-height: calc(100vh - 150px); /* Calcul dynamique de la hauteur */
  padding: 20px;
  gap: 20px;
  overflow: hidden;
}
.page-row2 {
  display: flex;
  flex: 1;
  flex-wrap: wrap;  /* Permet à la mise en page de s'adapter si besoin */
  padding: 20px;
  gap: 20px;
  overflow: hidden;
  justify-content: space-between;
}

/* Image gauche */
.img-left {
	max-width: 70%;
	max-height: calc(100vh - 200px);
	max-width: calc(100vh - 200px);
}
.img-left2 {
	max-width: 60%;
}
.img-left2 img {
	object-fit: contain;
	border: solid #B98A5D 1px;
    padding: 5px;
    background: #D7A86E;
}

.precedent, .suivant {
	min-width:40%
}

.img-left img {
  border-radius: 500px;
  background-clip: padding-box;
}

/* Notice à droite de l'image */
.notice-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align:left;
}

.row-rub{
	padding:2em 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
}

.borobil {
  width: 200px; /* Chaque div prendra 25% de la largeur du conteneur, moins l'espacement */
  aspect-ratio: 1 / 1;  /* Cela garantit que la largeur et la hauteur sont égales, donc le div est un cercle */
  background-color: #E6B86E;
  border-radius: 50%; /* Rendre la div ronde */
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  
}

.ablock {
     color: black;
    font-size: 1.2em;
    text-decoration: none;
    text-align: center;
    display: block;
    padding: 1em;
    line-height: 1.1em;
}
.ablock a {color: black;}




@media screen and (max-width: 1200px) {
	.page {
		width: 1200px;
	}

	.img-left, .img-left2 {
		width:100%;
		min-width:100%;
		max-width:100%;
		text-align:center;
		}
	.notice-right{
		flex:none;
		display: block;
		margin: auto;
	}
	
}

@media screen and (max-width: 769px) {
	.page {
		width: 100%;
	}
	.page_row{min-height:0;}

	.borobil {
		width: 150px;
	}
}