*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    background-image:url("images-keno/font.jpg");
    background-size:cover;
    background-position:center;
    background-attachment:fixed;
    background-color:#08142b;
    color:#fff;
    font-family:Arial, sans-serif;
}

.page-header img{
    width:100%;
    display:block;
}

/* MENU */

.menu{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:25px;
    padding:18px;
    background:#000;
    border-top:1px solid #d4af37;
    border-bottom:1px solid #d4af37;
}

.menu a{
    color:#d4af37;
    text-decoration:none;
    font-weight:bold;
}

.menu a:hover{
    color:#ffffff;
}

/* TITRE */

.hero-seo{
    max-width:1100px;
    margin:20px auto;
    padding:30px;
    background:rgba(0,15,50,0.90);
    border:2px solid #d4af37;
    border-radius:20px;
    text-align:center;
}

.hero-seo h1{
    color:#ffd700;
    font-size:48px;
    margin-bottom:15px;
}

.hero-seo p{
    color:#ffffff;
    line-height:1.8;
}

/* RESULTAT */

.bloc-resultat{
    max-width:1100px;
    margin:20px auto;
    padding:30px;
    background:rgba(0,15,50,0.90);
    border:2px solid #d4af37;
    border-radius:20px;
    text-align:center;
}

.bloc-resultat h2{
    color:#ffd700;
    margin-bottom:15px;
}

.date-tirage{
    color:#ffffff;
    margin-bottom:20px;
}

.numeros-loto{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:12px;
    max-width:650px;
    margin:20px auto;
}

.numeros-loto span{
    width:45px;
    height:45px;
    border-radius:50%;
    background:#ffd700;
    color:#000;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
    font-size:16px;
}

/* HISTORIQUE */

.historique-loto{
    max-width:1100px;
    margin:20px auto;
    padding:30px;
    background:rgba(0,15,50,0.90);
    border:2px solid #d4af37;
    border-radius:20px;
}

.historique-loto h2{
    color:#ffd700;
    text-align:center;
    margin-bottom:20px;
}

.table-historique{
    width:100%;
    border-collapse:collapse;
}

.table-historique th{
    background:#111;
    color:#ffd700;
    padding:12px;
}

.table-historique td{
    color:#ffffff;
    padding:12px;
    text-align:center;
    border:1px solid rgba(255,215,0,0.20);
}

/* SEO */

.seo-loto{
    max-width:1100px;
    margin:20px auto;
    padding:30px;
    background:rgba(0,15,50,0.90);
    border:2px solid #d4af37;
    border-radius:20px;
}

.seo-loto h2{
    color:#ffd700;
    text-align:center;
    margin-bottom:20px;
}

.seo-loto p{
    color:#ffffff;
    line-height:1.8;
    margin-bottom:15px;
}

/* FOOTER */

.footer-site{
    background:#000;
    border-top:2px solid #ffd700;
    padding:30px 20px;
    text-align:center;
}

.footer-logos{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:15px;
    flex-wrap:wrap;
}

.footer-logos img{
    height:20px;
    width:auto;
}

.footer-warning{
    color:#cccccc;
    font-size:14px;
    line-height:1.6;
    max-width:900px;
    margin:15px auto;
}

.footer-liens{
    margin:20px 0;
}

.footer-liens a{
    color:#ffd700;
    text-decoration:none;
    margin:0 10px;
}

.footer-liens a:hover{
    color:#ffffff;
}

.footer-site p{
    color:#cccccc;
}

/* MOBILE */

@media(max-width:768px){

.hero-seo h1{
    font-size:34px;
}

.numeros-loto span{
    width:50px;
    height:50px;
    font-size:18px;
}

.menu{
    gap:10px;
}

}
.pub-top{
    text-align:center;
    margin:20px auto 0 auto;
}

.pub-placeholder{
    width:460px;
    height:120px;
    margin:auto;
    border:2px dashed #ffd700;
    border-radius:15px;
    background:rgba(0,15,50,0.92);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#ffd700;
    font-size:20px;
    font-weight:bold;
}
.tirage-midi td {
    color: #ffffff;
}

.tirage-soir td {
    color: #4fc3f7;
    font-weight: bold;
}
.numeros-loto{
    display:grid;
    grid-template-columns:repeat(10, 1fr);
    gap:12px;
    justify-items:center;
    max-width:700px;
    margin:20px auto;
}
.date-tirage{
    margin-bottom:10px;
}