:root{--titre:#20b9ce;--num:#a879d4;--extra:#67cf82;--presta:#ff9edc;--rp:#6388e1;--white:#fff;--black:#000;--gray-50:#f1f1f1;--gray-200:#e0e0e0;--gray-500:#5d5d5d;--cyan-500:#015970;--cyan-800:#536279;--cyan-900:#015165;--cyan-950:#015970;--even-color:#0f0;--font:Verdana,Helvetica,serif}@media screen and (min-width:800px){.container{width:760px}}@media screen and (min-width:1024px){.container{width:996px}}@media screen and (min-width:1280px){.container{width:1174px}}body,html{background-color:var(--gray-200);color:var(--gray-500);font-family:var(--font);font-size:12px;line-height:20px;margin:0}.container{margin:0 auto;padding:0 20px}ul{padding-left:0}a{color:inherit;text-decoration:none;&.foreign{background-color:var(--cyan-950);color:var(--white);display:block;padding:5px;text-align:right;width:auto}}h2{color:var(--cyan-900);font-size:25px;margin:30px 0 20px}h3{color:var(--cyan-950);font-size:18px;margin-bottom:10px}strong{&.num{color:var(--num)}&.extra{color:var(--extra)}&.presta{color:var(--presta)}&.rp{color:var(--rp)}}#top{background-color:var(--gray-50);box-shadow:0 5px 5px rgba(0,0,0,.2);margin-bottom:20px;padding-top:20px}#menu{grid-gap:10px;display:grid;grid-template-columns:repeat(4,1fr);& li{background-color:var(--gray-50);color:var(--cyan-800);font-weight:700;grid-row:2;height:45px;line-height:50px;list-style-type:none;text-align:center}& li:first-child{background-color:var(--cyan-800);color:var(--white);font-size:18px;grid-column-end:5;grid-column-start:1;grid-row:1;margin-bottom:5px;width:100%}}#filters{background-color:var(--gray-50);color:var(--black);padding:20px;& button.blue.icon{background-color:var(--cyan-500);color:var(--white)}}table{background-color:var(--white);border:0;color:var(--black);margin-bottom:40px;vertical-align:middle;& thead th{color:var(--white);font-weight:700;padding:5px;text-align:left}&#directory{& thead{& th:first-child{background-color:var(--titre);width:35%}& th:nth-child(2){background-color:var(--num)}& th:nth-child(3){background-color:var(--extra)}& th:nth-child(4){background-color:var(--presta)}& th:nth-child(5){background-color:var(--rp)}}}&#directory-show{& th:nth-child(2n){filter:brightness(110%)}&.numerique{& thead{& th{background-color:var(--num)}}}&.presse{& thead{& th{background-color:var(--extra)}}}&.prestataires{& thead{& th{background-color:var(--presta)}}}&.agence{& thead{& th{background-color:var(--rp)}}}}& tbody{& th{text-align:left}& td{border:1px solid var(--gray-200);text-align:center}}}