html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
pre,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
li,
fieldset,
form,
label,
legend,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video
{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}
main,
article,
aside,
details,
figcaption,
figure,
footer,
header {
  text-align: center;
}
header h1 {
  color: black;
  font-size: 15px;
}
hgroup,
menu,
nav,
section {display:block}
body {line-height:1}
ol,
ul{list-style:none}
blockquote,
q{quotes:none}
blockquote:before,
blockquote:after,
q:before,
q:after{content:'';content:none}
table{border-collapse:collapse;border-spacing:0}*,
*:before,
*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.group:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.content{max-width:1680px}
@media screen and (min-width: 0)
{.content{margin:0 3.38638%}}
@media screen and (min-width: 20em)
{.content{margin:0 4.36194%}}
@media screen and (min-width: 55em)
{.content{margin:0 7.88863%}}
@media screen and (min-width: 78em)
{.content{margin:0 5.49273%}}
@media screen and (min-width: 103em)
{.content{margin:0 5.49273%}}
@media screen and (min-width: 1887.33212px)
{.content{margin:0 auto}}
.content:after{content:"";display:table;clear:both}
*{box-sizing:border-box}
html{font-size:100%}
@media screen and (min-width: 55em)
{html{font-size:112.5%}}
@media screen and (min-width: 103em)
{html{font-size:131.25%}}
body{font-family:"PT Serif",serif;line-height:1.4;color:#333}
img{display:block;width:100%}
em{font-style:italic}
strong{font-weight:bold}
a{text-decoration:none}


@media screen and (min-width: 20em)
{article{width:65.05576%;margin:0 auto}}

@media screen and (min-width: 55em)
{article{width:74.10468%}}

@media screen and (min-width: 78em)
{article{width:65.88022%}}

@media screen and (min-width: 103em)
{article{width:48.82033%}}
article>p{margin-bottom:1em}
article a{color:#A4AA00}
article a:hover,
article a:focus{border-bottom:1px solid #A4AA00}
.jeu{margin:15% auto}

@media screen and (min-width: 55em)
{.jeu{margin:8% 0}}

@media screen and (min-width: 78em)
{.jeu{margin:5% 0}}

.jeu h2{color:black;font-size:1rem;font-weight:bold;text-transform:uppercase;letter-spacing:.1em;line-height:1.1;border-bottom:1px solid #b9614d;margin:0 auto 2em auto}

@media screen and (min-width: 55em)
{.jeu h2{width:96.54255%}}

@media screen and (min-width: 78em)
{.jeu h2{width:64.3617%}}
.jeu h2:after{color:#b9614d;font-size:.625rem;letter-spacing:.25em;display:block;width:6em;margin:.5em auto -.5em auto;background:white}
.cartes{text-align:center}

@media screen and (min-width: 55em)
{.cartes{width:139.77695%;margin-left:-19.88848%}}

@media screen and (min-width: 78em)
{.cartes{width:155.3719%;margin-left:-27.68595%}}

@media screen and (min-width: 103em)
{.cartes{width:209.66543%;margin-left:-54.83271%}}
.candidat{text-align:left;display:inline-block;vertical-align:text-top;width:100%;margin-bottom:7.42857%}

@media screen and (min-width: 20em)
{.candidat{margin-bottom:4.83271%}}

@media screen and (min-width: 55em)
{.candidat{width:50%;padding:0 1.79063%;margin-bottom:4.83271%}}

@media screen and (min-width: 78em)
{.candidat{width:33.33333%;padding:0 1.17967%;margin-bottom:2.35935%}}

@media screen and (min-width: 103em)
{.candidat{width:25%}}

.carte{font-family:"PT Serif",serif;font-size:3.8vw;position:relative;perspective:50em;transition:all 0.35s ease-out}

@media screen and (min-width: 20em)
{.carte{font-size:2.4vw}}

@media screen and (min-width: 55em)
{.carte{font-size:1.65vw}}

@media screen and (min-width: 78em)
{.carte{font-size:1.15vw}}

@media screen and (min-width: 103em)
{.carte{font-size:.85vw}}

@media screen and (min-width: 1887.33212px)
{.carte{font-size:.75rem}}

.no-js
.carte,
.carte.flip,

.carte#dahmani:target,

.carte#bakraoui:target,

.carte#laachraoui:target,

.carte#manuel-valls:target
{outline:none;transform:rotate(-2deg)}

.no-js
.carte
.carte-avant,

.carte.flip
.carte-avant,
.carte#dahmani:target
.carte-avant,
.carte#bakraoui:target
.carte-avant,
.carte#laachraoui:target
.carte-avant,
.carte#bakkali:target
.carte-avant,
.carte-avant{transform:rotateY(-180deg)}

.no-js .carte .carte-arriere,
.carte.flip
.carte-arriere,
.carte#dahmani:target
.carte-arriere,
.carte#bakraoui:target
.carte-arriere,
.carte#laachraoui:target
.carte-arriere,
.carte#manuel-valls:target

.carte-arriere{transform:rotateY(0deg)}
@media screen and (min-width: 55em){
.etendu
.carte{float:left}}
.carte
.flip-toggle{display:block;position:absolute;z-index:2;top:2.25%;right:3%;width:12%;height:9%;text-indent:200%;white-space:nowrap;overflow:hidden;border:none;border-radius:50%;outline:none;background:rgba(0,0,0,0.5) url("../img/flip.svg") top left/100% no-repeat;transition:.25s}
.carte
.flip-toggle:hover{cursor:pointer;background-color:#000}
.nom{z-index:2;color:white;line-height:1.3}
.carte-avant
.nom{position:absolute;left:0;bottom:0;width:100%;padding:27% 7% 10% 7%;background:7% 0 / 30% no-repeat}
.carte-arriere
.nom{margin:5% 18% 5% 4%}
.nom h4{font-size:1.3125em;font-weight:bold}
.carte-avant
.nom
.nom h5{font-size:.8125em}

.carte-avant{background:#476579;transform:rotateY(0deg);transform-style:preserve-3d;transition:all 0.35s ease-out;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-shadow:0 0 0.5em rgba(0,0,0,0.35)}
.carte-avant
.portrait:after{z-index:1;content:"";display:block;position:absolute;top:0;left:0;width:0%;height:100%;background:linear-gradient(to top, #000, #000 10%, transparent 50%);box-shadow:inset 0 0 0 .4em #cc3535}

.carte-arriere{color:black;z-index:0;position:absolute;top:0;left:0;width:100%;height:100%;background:url() top left/50% repeat,white url() top left/100% no-repeat;transform:rotateY(180deg);transform-style:preserve-3d;transition:all 0.35s ease-out;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-shadow:0.75em 0.75em 2em rgba(0,0,0,0.45)}
.carte-arriere
.detail{background:white;overflow:hidden;margin:3%}
.carte-arriere
.detail h6{color:white;font-weight:bold;letter-spacing:.025em;padding:2% 3%;background:#cc3535 url() top left/50% repeat}
.carte-arriere
.detail h6:after{display:block;float:right;transform:rotate(22deg)}
.carte-arriere
.detail p{font-family:"PT Serif",serif;padding:2% 3% 4% 3%}
