/*
* Archiviste Hermetique css v3 
* Archiviste Hermetique Albedo css v1.0 on 08/03/2026
*/

html, body {
height:100%;
width:100%;
}

html, body, img, p, ul, li, a, i, a:focus, object, h1, h2, h3, h4, h5, h6, form, input, select, option, textarea, footer, nav, header, span, button {outline:none;margin:0px;padding:0px;border:0px;text-decoration:none;}

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 14px;
color: #996;
text-align: center;
background: #000;
background:url("data:image/svg+xml;charset=utf8,%3Csvg%20viewBox%3D%220%200%20512%20512%22%20width%3D%22512%22%20height%3D%22512%22%20xmlns%3D%22http://www.w3.org/2000/svg%22%3E%3Cfilter%20id%3D%22noise%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.875%22%20result%3D%22noise%22/%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220.6%200%200%200%200%200%200.45%200%200%200%200%200%200.1%200%200%200%200%200%200.30%200%22/%3E%3C/filter%3E%3Crect%20filter%3D%22url(%23noise)%22%20width%3D%22512%22%20height%3D%22512%22%20fill%3D%22transparent%22/%3E%3C/svg%3E");
center / 522px repeat, linear-gradient(45deg, rgba(0, 0, 0, 0.988), rgba(20, 60, 30, 0.988)) center / contain repeat #000;  box-sizing: border-box; 
padding-top:15px;
}

header{
width:100%;
max-width:1000px;
height:200px;
margin:0 auto;
display: flex;
flex-wrap: wrap;
}

header h1,
header .search {
width: 50%;
}

h1{
height:90px;
margin:0px;
font-size:0;
color:transparent;
text-indent:100%;   
background: url("../../data/img/rubedo.png") no-repeat center center;
background-size:100% auto;
overflow:hidden;
display:block;
}

h2{
font-size:20px;
font-weight:bold;
padding-bottom:10px;
}

h3{
font-size:18px;
font-weight:bold;
padding-bottom:10px;
}

a{
color:#666;
}

a:hover{
color:#777;
}

ul{
list-style-type: none;
}

p{
font-size: 14px;
line-height: 18px;
padding-bottom:25px;
}

.cl,.sp{
clear:both;
height:0px;width:100%;
font-size:0px;
line-height:0px;
}

.sp{
height:15px;
}

.page{
box-shadow:0px 7px 20px #996;
margin:0 auto;
background:#550000;
border-radius:5px;
border:1px solid #996;
width:100%;width:calc(100% - 2px);
max-width:1000px;  box-sizing: border-box; 
}

.simple{
width:calc(100% - 40px);
margin:0 auto;
text-align:left;
margin-bottom:20px;  box-sizing: border-box; 
}

.content ul, .simple ul{
font-size: 14px;
line-height: 18px;
list-style-type: none;
padding-bottom:15px;
}

.content{
width:calc(100% - 40px);
margin:0 auto;
display: flex;
flex-direction: row-reverse;
gap: 0px;
margin-bottom:20px;  box-sizing: border-box; 
}

.content > div {
width: 50%;
text-align:left;
}

.simple img, .content > div img{
width:18px;
margin:0px; 
}

.content > div:nth-child(2) img{
width:calc(100% - 40px);
margin:0 auto;
}

.search { height:80px;  
display: flex;
align-items: center;
justify-content: space-between; justify-content:flex-end;
text-align: center; padding-bottom:10px;
}

.search__input {
height:40px;
margin-top:15px;
font-family: inherit;
font-size: 14px;
background-color: #f4f2f2;
border: none;
color: #646464;
padding-left: 10px;
border-top-left-radius: 30px;
border-bottom-left-radius: 30px;
width:240px;
transition: all ease-in-out .5s;
}

.search__input:hover, .search__input:focus {
box-shadow: 0 0 1em #00000013;
}

.search__input:focus {
outline: none;
background-color: #f0eeee;
}

.search__input:focus + .search__button {
background-color: #f0eeee;
}

.search__button {
border: none;
height: 40px;
width: 30px;
background-color: #f4f2f2;
padding-right: 10px;
margin:1px;
border-top-right-radius: 30px;
border-bottom-right-radius: 30px;
margin-left:-6px;
margin-right:20px;
}

.search__button:hover {
cursor: pointer;
}

.search__icon {
height: 14px;
width: 14px;
}

.menu {
border:1px solid #996;
border-left:0px;
border-right:0px;
margin:0 auto;
background: #550000;
line-height: 24px;
font-size: 12px; 
height:32px;
text-align: center;
overflow: hidden;
padding: 0;            
width:calc(100% - 40px);
}

.menu ul {
list-style: none; 
padding: 0; font-size: 12px;
margin: 0;  
display: flex;           
justify-content: center;
flex-wrap: wrap;
gap: 6px;
}

.menu li {
display: inline-block;
}

.menu a {
display:inline-block;
text-decoration:none;
border:none;
padding: 10px;
padding-top: 4px;
padding-bottom: 4px;
text-transform:uppercase; 
font-weight:bold;
color:#ccc;
}

.menu a:hover{
background: #996;
color: #fff;
text-decoration: none;
}

#alpha_nav {
background: #996;
line-height: 24px;
font-size: 12px;
height: auto;
text-align: center;     
overflow: hidden;
padding: 0;          
margin: 0;
margin-bottom: 20px;              
}

#alpha_nav ul {
list-style: none;        
padding: 0;
margin: 0;
display: flex;          
justify-content: center; 
flex-wrap: wrap;         
gap: 6px;                
}

#alpha_nav li {
display: inline-block;
}

#alpha_nav a {
display: inline-block;
text-decoration: none;
border: none;
padding: 6px;
text-transform: uppercase;
font-weight: bold;
color: #333;
}

#alpha_nav a:hover, #alpha_nav .curl {
background: #000;
color: #fff;
text-decoration: none;
}

#alpha_nav a:active {
color: #fff;
text-decoration: none;
}

footer {
width:calc(100% - 40px);
margin:0 auto;
height:60px;
padding-top:10px;
border-top:1px dotted #996;
text-align:center;
color:#996;
font-size:12px;
line-height:14px;
}

@media (max-width: 750px) { 
   
.content {
gap: 10px;
flex-direction: column;
}

.content > div {
width: 100%;
text-align:left;
}

header{
width:100%;
max-width:100%;
height:250px;
margin:0 auto;
display: flex;
flex-wrap: wrap;
flex-direction: column;
}

header h1, header .search {
width: 100%;
}

.content > div:nth-child(2) img{
width:100%;
margin:0 auto;
} 
}