main>header
{
 margin:0;
 padding:1em;
 z-index:20;
 position:sticky;
 top:0;
 background-color:var(--main-background-color);
 text-overflow:ellipsis;
 overflow:hidden
}

main>header>:is(h1, h2)
{
 margin:0.5em;
 padding:0;
 line-height:1;
 text-align:center
}

main>header>h1
{
 font-size:1.8em;
 color:var(--section-header-color)
}

main>header>h2
{
 font-size:0.8em;
 color:var(--main-color)
}

main>header>:is(a, a:visited, a:link)
{
 color:var(--grey3-on);
 text-decoration:none;
 white-space:nowrap
}

main>header>a:hover
{
 /* TODO : !important is bad */
 text-decoration:underline !important;
 color:var(--link-hover)
}

main>header>a>svg
{
 vertical-align:middle
}

article
{
 margin:auto;
 padding:0 1em
}

.poster
{
 width:280px;
 min-width:280px;
 max-width:280px;
 margin:0 auto 1em auto
}

.cover
{
 width:100%;
 height:420px;
 margin:0.5em auto;
 border-radius:var(--UI-big-border-radius);
 position:relative
}

article:hover .cover
{
 transform:scale(1)
}

.cover>footer
{
 position:absolute;
 bottom:8px;
 left:8px;
 right:8px;
 background-color:hsl(var(--grey8-hsl) / 0.5);
 padding:0.5em;
 border-radius:var(--UI-big-border-radius);
 display:flex;
 flex-direction:row
}
.cover>footer>*
{
 margin:0;
 padding:0;
 flex:1;
 color:var(--grey8-on);
 font-size:0.8rem;
 line-height:1
}

.cover>footer>:first-child
{
 text-align:left
}

.cover>footer>:first-child>:is(a, a:visited, a:link)
{
 color:var(--grey8-on);
 text-decoration:none
}

.cover>footer>:first-child>a:hover
{
 /* TODO : !important is bad */
 text-decoration:underline !important
}

.cover>footer>:last-child
{
 text-align:right
}

.supports
{
 display:flex;
 flex-direction:row
}

.supports>span
{
 flex:1;
 text-align:center
}

.infos
{
 display:grid;
 grid-template-columns:1fr 1fr;
 grid-template-rows:min-content 1fr;
 gap:0.5em 0.5em;
 grid-auto-flow:row;
 grid-template-areas:"list_KINDS list_COUNTRIES"
                     "synopsis synopsis"
}

.synopsis
{
 grid-area:synopsis;
 text-align:justify;
 line-height:1;
 font-size:1em
}

.list_KINDS
{
 grid-area:list_KINDS
}

.list_COUNTRIES
{
 grid-area:list_COUNTRIES
}

aside>nav>ul
{
 margin:0;
 padding:0;
 font-size:0.9em;
 line-height:1;
 list-style-type:none;
 text-align:center
}

aside>nav>ul>li
{
 margin:0 0.25em 0.5em 0;
 padding:0;
 display:inline-block
}

aside li>:is(a, a:visited, a:link)
{
 color:var(--grey7);
 text-decoration:none;
 margin-right:1em
}

aside li>a:hover
{
 /* TODO : !important is bad */
 text-decoration:underline !important;
 color:var(--blue4)
}

.actor_picture
{
 width:40px;
 height:40px;
 margin:0
}

.linked_movies nav>ul>li>a
{
 display:block;
 width:70px;
 height:100px;
 border-radius:var(--UI-big-border-radius);
 background-position:center;
 background-size:cover
}

@media (min-width:800px)
{

article
{
 max-width:800px;
 display:grid;
 grid-template-columns:min-content 1fr;
 grid-template-rows:min-content min-content 1fr;
 gap:0.5em;
 grid-auto-flow:row;
 grid-template-areas:"poster infos"
                     "poster actors"
                     "poster movies";
}

.poster
{
 grid-area:poster
}

.infos
{
 grid-area:infos;
 padding-top:1em
}

.list_ACTORS
{
 grid-area:actors
}

.linked_movies
{
 grid-area:movies
}

}

@media (min-width:40rem)
{

article
{
}

}