@charset "utf-8";
/* © 2010-2020 B. J. J. Bruet All Rights Reserved - Tous Droits Réservés */

@font-face
{
    font-family: ZallmanCaps;
    src:         url('/polices/ZallmanCaps.ttf');
}

/**********************************************************************************/
:root { --taillePolice: 0.9em; }

* *:focus { border: thin solid darkolivegreen; }

body
{
    font-family: Verdana, 'sans serif';
    font-size:   var(--taillePolice);
}

/* Décommenter la ligne suit pour voir des éléments habituellement cachés... */
/* head, title, link[href][rel], meta, style, script { display: block; } */

/***********************************************************************************/

.afficheur
{
    align-items:      center;
    background-color: white;
    border:           1px solid black;
    box-sizing:       content-box;
    display:          flex;
    flex-direction:   row;
    height:           100%;
    justify-content:  center;
    margin:           0;
    padding:          1px;
}

.ancre
{
    --ancreLinkColor:       green;
    --ancreLinkDecoration:  none;
    --ancreHoverDecoration: underline;
    --ancreVisitedColor:    darkolivegreen;
}

/*
	D'après la page excellemment (?) traduite https://developer.mozilla.org/fr/docs/Learn/CSS/Styling_text/Mise_en_forme_des_liens ,
	ordre A RESPECTER : LVFHA => La Vie Fuit la HAine (LoVe Fears HAte) : L(ink) V(isited) F(ocus) H(over) A(ctive)
*/

.ancre *:link    { color:  var(--ancreLinkColor); text-decoration: var(--ancreLinkDecoration); }
.ancre *:visited { color:  var(--ancreVisitedColor); } /* pas de 'text-decoration' possible en raison de restriction sur 'visited', dixit Firefox... */

.ancre *[href]    { color: var(--ancreLinkColor); text-decoration: var(--ancreLinkDecoration); }
.ancre *[onclick] { color: var(--ancreLinkColor); text-decoration: var(--ancreLinkDecoration); }

.ancre *[href]:hover    { text-decoration: var(--ancreHoverDecoration); cursor: pointer; }
.ancre *[onclick]:hover { text-decoration: var(--ancreHoverDecoration); cursor: pointer; }

.bordures, .bordureBasse, .bordureDroite, .bordureGauche, .bordureHaute
{
    --borderWidth:     1px;

    --borderRadius:    1em;
    --borderWidthType: var(--borderWidth) solid;

    --shadowColor:     #444;
    --shadowThickness: 0.11em;
}

.bordures { border: var(--borderWidthType); }

.bordureArrondie { border-radius: var(--borderRadius); }

.bordureHaute  { border-top:    var(--borderWidthType); }
.bordureDroite { border-right:  var(--borderWidthType); }
.bordureBasse  { border-bottom: var(--borderWidthType); }
.bordureGauche { border-left:   var(--borderWidthType); }

.bordureGrise { border-color: gray; }

.bouton
{
    box-sizing:  content-box;
    cursor:      pointer;
    font-weight: bold;
    height:      100%;
    margin:      0;
    text-align:  center;
    width:       auto;  /* pour Edge seulement... */
}

.flexBaseline, .flexRowBaseline
{
    align-items:     baseline;
    justify-content: center;
}

.flexCenter, .flexRowCenter, .flexColumnCenter
{
    align-items:     center;
    justify-content: center;
}

.flexColumn, .flexColumnCenter
{
    display:        flex;
    flex-direction: column;
}

.flexRow, .flexRowBaseline, .flexRowCenter
{
    display:        flex;
    flex-direction: row;
}

.flexStretch
{
    align-items:     center;
    justify-content: stretch;
}

.hauteurMax { height: 100%; }

.image
{
    height:     98%;
    margin:     1%;
    object-fit: contain;
    width:      98%;
}

.largeurMax, .piedPage { width: 100%; }

.piedPage
{
    font-family: Verdana;
    font-size:   9pt;
    font-style:  italic;
    text-align:  center;
}

.sousTitre, .titre
{
    --taillePoliceTitre: 2em;

    font-family:    ZallmanCaps;
    text-transform: capitalize;
}

.sousTitre { font-size: calc(var(--taillePoliceTitre)*0.8); }

.titre
{
    font-size:     var(--taillePoliceTitre);
    text-align:    center;
    text-overflow: ellipsis;
}