@font-face {
    font-family: Arial;
    src: url(../fonts/Arial/Arial.ttf);
}
@font-face {
    font-family: ITC;
    src: url(../fonts/ITC/ITCAvantGardeStd-Bk.ttf);
}
@font-face {
    font-family: ITCBold;
    src: url(../fonts/ITC/ITCAvantGardeStd-Bold.ttf);
}
@font-face {
    font-family: ITCBoldCond;
    src: url(../fonts/ITC/ITCAvantGardeStd-BoldCn.ttf);
}

* {
    margin: 0px;
    padding: 0px;
}

html {
    width: 100%;
    height: 100%;
}

body {
    font-family: Arial;
    font-size: 100%;
    width: 100%;
    height: 100%;
}

a {
    text-decoration: none;
}

h1 {
    font-family: ITCBold;
    font-size: 2em;
    text-transform: uppercase;
    display: inline;
    margin-left: 1em;
}

main h2 {
    font-family: ITCBoldCond;
}

body > header {
    background-image: url(../medias/top.mosaic.png);
    padding: 1.5em;
    display: flex;
    align-items: center;
}

body > header figure:last-child img {
    width: 105px;
}

body > footer {
    height: 1.2em;
    background-image: url(../medias/top.mosaic.png);
}

nav {
    background-color: black;
    padding: 0.8em;
}

nav h2 {
    display: none;
}

nav ul {
    list-style: none;
}

nav li {
    display: inline;
    margin: 0.8em;
    font-size: 1.2em;
}

nav a {
    font-family: ITC;
    color: white;
}

nav a:hover {
    cursor: pointer;
    font-family: ITCBold;
}

nav a:visited {
    color: white;
}

nav a.selected {
    font-family: ITCBold;
    color: yellow;
}

p#remarque {
    font-style: italic;
    border: 1px dashed black;
}

p#remarque label {
    text-decoration: underline;
}

/* catalogues */
#catalogue {
    padding: 2em;
    display: flex;
    flex-flow: wrap;
}

#catalogue a {
    color: black;
    margin: 1em;
}

#catalogue a:visited {
    color: black;
}

#catalogue article {
    width: 10em;
    height: 10em;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1em;
    opacity: 70%;
    justify-content: space-between;
}

#catalogue article:hover {
    opacity: 100%;
}

#catalogue article h2 {
    text-align: center;
}

#cata_content header {
    display: flex;
    flex-direction: row;
    align-items: center;
}

#cata_content header figure {
    margin-left: 1em;
    margin-right: 1em;
}

#cata_content header img {
    height: 40px;
}

/* Couleurs des thèmes */
.btn_7bd65f {
    background-color: #7bd65f;
}

.btn_c39ac9 {
    background-color: #c39ac9;
}

.btn_69dc7d {
    background-color: #69dc7d;
}

.btn_b3e38f {
    background-color: #b3e38f;
}

.btn_b99286 {
    background-color: #b99286;
}

.btn_829ba5 {
    background-color: #829ba5;
}

.btn_79b2fa {
    background-color: #79b2fa;
}

.btn_ade8ff {
    background-color: #ade8ff;
}

.btn_ecc3fa {
    background-color: #ecc3fa;
}

.btn_a99069 {
    background-color: #a99069;
}

.btn_aae30f {
    background-color: #aae30f;
}

.btn_ffef00 {
    background-color: #ffef00;
}

.btn_ff9a00 {
    background-color: #ff9a00;
}

.btn_adadad {
    background-color: #adadad;
}

.btn_f15451 {
    background-color: #f15451;
}

.btn_9fe56c {
    background-color: #9fe56c;
}

.btn_d8a6e9 {
    background-color: #d8a6e9;
}

.btn_df4b1c {
    background-color: #df4b1c;
}

.btn_90caff {
    background-color: #90caff;
}

.btn_dbf463 {
    background-color: #dbf463;
}

.btn_c4526c {
    background-color: #c4526c;
}

.btn_5fedd6 {
    background-color: #5fedd6;
}

.btn_aa968e {
    background-color: #aa968e;
}