body{
    font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Arial,serif;
    font-weight: 400;
    text-align:center;
    margin:0;
    padding:0;
    letter-spacing: .4px;
}
a:link,a:visited{
    color:#000
}
a:hover{
    color:#202020
}
table{
    border-collapse:collapse
}
p{
    margin:0;
    font-size:15px
}
figure{
    margin-inline-start:initial;
    margin-inline-end:initial
}
figcaption{
    text-align:center;
    font-size:.7em;
    font-style:italic;
    color:grey
}
li{
    font-size:14px;
    padding-bottom: 18px;
}
input[type=button]{
    cursor:pointer
}
tr{
    height:50px;
    font-weight:700
}
td{
    width:16.6%
}
h1{
    font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Arial,serif;
}

/*HEADER*/
.nom_site{
    font-size:1.3em;
    font-weight: bold;
    padding-top:.1px;
    padding-bottom:.1px;
    padding-right:5%;
    padding-left:5%;
    background-color: #f7f7f7;
}
.nom_site h1{
    margin-block-end:15px
}
h1 a{
    text-decoration:none
}
.nom_site>a{
    font-size:1.3em;
    font-weight: bold;
    text-decoration:none;
    display:block;
    margin-block-start:0.67em;
    margin-block-end:15px;
    margin-inline-start:0;
    margin-inline-end:0;
}

/*NAVIGATION*/
.navigation{
    background-color: #f7f7f7;
    width:100%;
    height:53px;
    overflow:auto;
    white-space:nowrap;
    position:sticky;
    position:-webkit-sticky;
    top:0;
    box-shadow: inset 0px -1px 0px #eef0f2;
}
.navigation ul{
    display:flex;
    width:55%;
    margin:auto;
    margin-top:revert;
    padding-inline-start:initial
}
.navigation li{
    list-style:none;
    flex:auto;
    padding-right:16px
}
a .active{
    border-bottom:1px solid black;
}
.navigation a{
    text-decoration:none;
    padding:12px 0 13px;
    font-weight:400
}
.navigation a:hover{
    border-bottom:1px solid black;
    color:black;
}
@media (max-width:900px){
    .navigation{
        height:43px
    }
    .navigation ul{
        width:90%
    }
    .navigation a{
        padding:0 0 9px;
        display:inline-block
    }
}
.barre_recherche{
    padding-top:5%;
    padding-right:5%;
    padding-left:5%;
    padding-bottom:5%;
    min-height:250px;
    box-shadow: inset 0px -1px 0px #eef0f2;
    background-color: #f7f7f7;
}
.barre_recherche>h2{
    font-size:39px !important;
    font-weight:400;
}
.mini-menu-scroll{
    overflow: auto;
    white-space: nowrap;
    background-color:white;
    padding:10px 0 10px 0;
    font-size: 14px;
    box-shadow: inset 0px -1px 0px #eef0f2;
}
.mini-menu{
    display: inline-block;
}
.mini-menu > a{
    text-decoration: none;
    color:white;
}
.onglet-tous{
    border-radius: 20px;
    text-align: center;
    padding: 7px 20px 7px 20px;
    border:1px solid #e6e6e2;
}

/*GRID*/
.content_textes_home{
    margin:0 auto;
    max-width: 600px;
    padding-bottom:10px;
}
@media (max-width:680px){
    .content_textes_home{
        width:90%
    }
}
.content_textes_home p{
    margin-bottom:10px;
}
.content_textes_home img{
    border-radius:.875rem
}
.content_textes_home h1{
    text-align:center;
    font-weight:700;
    font-size:36px;
}
.content_textes_home h2{
    text-align:center;
    font-weight:500;
    font-size:36px;
}
.content_textes_home h3{
    text-align:left
}
.cadre_gris{
    background-color:#f7f7f7;
    padding:1.5rem;
    margin-top:40px;
}
.cadre_gris h3{
    margin-block-start:0
}
.content_textes{
    margin:0 auto;
    width:60%;
    text-align:justify!important
}
@media (max-width:680px){
    .content_textes{
        width:90%
    }
}
.content_textes p{
    margin-bottom:10px;
}
.content_textes img{
    border-radius:.875rem
}
.content_textes h1{
    font-family:"Aeonik";
    text-align:center;
    font-weight:100;
    font-size:36px;
}
.content_textes h2{
    text-align:left
}
.content_textes h3{
    text-align:left
}

/*MOYENNE PRIX*/
.moyenne_prix{
    overflow: auto;
    white-space: nowrap;
}
.moyenne_prix_carburant{
    display: inline-block;
    border:1px solid #e5e5e5;
    padding:10px;
    margin:10px;
    width:200px;
}
.moyenne_prix_titre{
    font-size:20px;
}
.moyenne_prix_prix{
    font-size:35px;
    font-weight: bold;
}
.moyenne_prix_comparo{
    font-size:15px;
}
.moyenne_prix_titre_comparo{
    display:block;
    font-size:12px;
}
.moyenne_prix_separateur {
    width: 30px;
    border-bottom: 1px solid #e5e5e5;
    margin: auto;
    display: block;
    margin-bottom: 10px;
    margin-top: 10px;
}

/*TOP PRIX*/
.home_top_prix{
    border-radius: 10px;
    border:1px solid #e5e5e5;
    box-shadow: 0em 0em 0.5em #e5e5e5;
    padding: 0 32px;
    margin-top:40px;
}
.table_top_prix tr{
    font-weight:400;
}
.table_top_prix td{
    width:100%;
}
.right_top_prix{
    text-align: right;
}
.lire_top_prix{
    text-align: left;
    margin-top: 20px;
    margin-bottom: 20px !important;
    font-size: 12px;
}

/*BOUTONS*/
.raccourcis{
    background-color: #f7f7f7;
    border-radius: 10px;
    display: inline-block;
    padding: 10px;
    margin-bottom: 15px;
    width: 300px;
    text-align: left;
    margin-right:10px;
}
#autre_recherche{
    margin-top:20px;
    margin-bottom:20px
}
.bouton{
    text-align:center;
    margin-top:30px;
    margin-bottom:40px
}
.bouton a{
    background-color: #202020;
    border-radius:100px;
    color:white;
    min-width:10rem;
    padding:.6rem 1.5rem;
    display:inline-block;
    cursor:pointer;
    transition:background .6s;
    -webkit-transition:background .6s;
    text-decoration:none
}
.bouton a:hover{
    background-color: black;
}

/*PAGE STATIONS*/
.resultats_recherche{
    margin-top:2%;
    margin:0 auto;
}
@media (max-width:600px){
    .resultats_recherche{
        width:90%
    }
}
.justifbet{
    justify-content:space-between;
    align-items:center;
    padding:15px;
    margin-top:25px;
    background-color: #f3f3f8;
    border-radius: .875rem .875rem 0 0;
}
.flex{
    display:flex;
}
.nombre_station{
    background-color:#f3f3f8;
    color:grey;
    border-radius:.875rem;
    padding:2px 10px 2px 10px;
    width:fit-content;
    text-align:center;
    font-size:15px;
    display:block;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:20px
}
.marque{
    width:40px;
    height:40px;
    margin-right:15px;
    margin-top:auto;
    margin-bottom:auto;
    border-radius:10px
}
.justifleft>p{
    font-size:12px!important;
    text-align:justify!important
}
.flex>h3{
    margin-block:auto!important
}
.prix_title{
    font-weight:400!important
}
.gazole{
    background-color:#ffd145;
    color:#000;
    border-radius:0 0 0 .875rem
}
.sp98{
    background-color:#054722;
    color:#fff
}
.e10{
    background-color:#00b944;
    color:#000
}
.sp95{
    background-color:#066530;
    color:#fff
}
.e85{
    background-color:#00c3d9;
    color:#000;
    border-radius:0 0 .875rem 0
}
.gplc{
    background-color:#006e96;
    color:#fff
}

/*AUTRE*/
.erreur{
    background-color:red;
    border-radius:10px;
    color:#fff;
    padding:20px
}

/*FOOTER*/
.row{
    display:flex;
    flex-wrap:wrap;
    margin:0 auto;
    width:85%
}
@media (max-width:680px){
    .row{
        width:90%
    }
}
footer{
    background-color:#202020;
    color:#fff;
    margin-top:3rem;
    padding-top:3rem;
    padding-bottom:3rem;
    text-align:left
}
footer p{
    margin-bottom:10px;
    font-size: 15px;
}
footer img{
    margin-right:.5rem;
    width:40px;
    height:40px;
    border-radius:10px
}
footer ul{
    padding-left:0
}
footer li{
    padding-bottom:15px;
    list-style:none
}
footer a{
    color:#909090!important;
    text-decoration:none
}
.footer_container_logo{
    display:inline-flex;
    vertical-align:middle;
    align-items:center;
    font-size:18px;
    margin-bottom:15px
}
.footer_container_logo a{
    color:#fff!important;
    text-decoration:none!important
}
.footer_titre{
    font-weight:700;
    font-size:16px
}
.footer_container p{
    line-height:1.5em
}
.footer_container{
    flex:0 0 auto;
    width:18%;
    margin-right:auto;
    vertical-align:top
}
.footer_logo{
    flex:0 0 auto;
    width:23%;
    margin-right:10%;
    margin-left:5%
}
@media (max-width:680px){
    .footer_container{
        width:50%!important;
        margin-left:0;
        margin-right:0
    }
    .footer_logo{
        width:100%!important;
        margin-bottom:20px;
        margin-left:0
    }
}
