html { width: 100%; height: 100%; }
body { margin: 0px; width: 100%; height: 100%; background-color: #ffffff; color: #400080; font-weight: 500; 
	font-family: Calibri, Arial, sans-serif;  font-size: 13pt; text-align: justify; }
h1, h2 { font-family: Calibri, Arial, sans-serif;  font-weight: 800; padding: 0.7em; color: #400080;
		padding-left: 60pt; margin: 0px; letter-spacing:2px; }
h1		{  background-color: #5c0099; font-size: 2.2em; color: #ffffff; }
h2		{  background-color: transparent; font-size: 1.8em; font-style:italic; padding-left: 50px; }
img	{ display: block; margin-left: auto; margin-right: auto; }
p	{ padding: 0.5em 50px; margin: 0.2em 0em; }
p.nom { background-color: transparent; }
p.copy { font-size: 0.5em; text-align: right; }


/* Contenidor per a la pàgina amb dues columnes i quatre fileres
	La filera de la dreta té 150px i l'altra ocupa tot l'espai disponible
	Les dues primeres columnes ocupen l'espai necessari per al contingut,
	la quarta és de 150px i la tercera ocupa tot l'espai restant */
.wrapper { display: grid; grid-template-columns: 1fr 130px; grid-gap: 0px;
	grid-auto-rows: auto auto 1fr 120px; height: 100%; }
/* El títol ocupa tota la primera filera */
.tit { grid-column: 1 / 3; grid-row: 1; background-color: transparent; }
/ La barra de copyright ocupa la segona filera de la columna de l'esquerra */
.bar { grid-column: 1; grid-row: 2; background-color: transparent; }
/* La casella del contingut ocupa les dues fileres inferiors de la columna de l'esquerra */
.esq { grid-column: 1; grid-row: 3 / 5; background-color: transparent; }
/* Aquesta part omple les dues fileres centrals de la columna de la dreta */
.dreta { grid-column: 2; grid-row: 2 / 5; background-color: transparent; }
/* El codi QR està a la darrera casella */
.qr { grid-column: 2; grid-row: 4; background-color: transparent; text-align: center; vertical-align: bottom; }