/* ===== GLOBAL ===== */

body{
font-family:Arial;
background: url("/assets/fond.png") no-repeat 65% center fixed;
background-size: cover;
color:#eee;
margin:0;
padding:0;
}

/* VOILE */

body::before{
content:"";
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.45);
z-index:-1;
}

/* LAYOUT */

.layout{
display:grid;
grid-template-columns:180px 1fr 300px;
gap:20px;
max-width:1400px;
margin:auto;
padding:20px;
}

.content{
max-width:900px;
margin:auto;
}

/* BOX */

.box{
background: rgba(31,31,31,0.85);
padding:40px;
border-radius:12px;
backdrop-filter: blur(4px);
}

/* TITRES */

h1{margin-top:0;}
h2{margin-top:40px;color:#ffd700;}

/* LISTES */

ul{columns:2;}
li{margin:6px 0;}

/* LIENS */

a{color:gold;text-decoration:none;}
a:hover{text-decoration:underline;}

/* MENUS */

.act-menu,
.guide-menu,
.cat-menu{
display:flex;
gap:15px;
margin:15px 0;
flex-wrap:wrap;
}

.act-menu a,
.guide-menu a,
.cat-menu a{
background:#222;
padding:6px 12px;
border-radius:6px;
}

.act-menu a:hover,
.guide-menu a:hover,
.cat-menu a:hover{
background:#333;
}

/* FOOTER */

.footer{
margin-top:40px;
padding:25px;
text-align:center;
background:rgba(0,0,0,0.6);
border-radius:10px;
font-size:14px;
}

/* ADS */

.ads-left,.ads-right{
display:flex;
justify-content:center;
}

/* MOBILE */

@media(max-width:1100px){
.layout{grid-template-columns:1fr;}
.ads-left,.ads-right{display:none;}
ul{columns:1;}
}

@media(max-width:768px){

body{
background: url("/assets/fond.png") no-repeat 70% center;
background-size: cover;
background-attachment: scroll;
}

body::before{
background:rgba(0,0,0,0.6);
}

.box{padding:25px;}

}