[PHPBB2] Mettre un titre sur une image

Bonjour,

Mon problème est tout con, je le sais mais je ne sais pas pourquoi cette fois, je n'arrive pas à faire en sorte que mon titre passe au-dessus d'une image.
La difficulté c'est que je code une fiche dans une autre fiche et du coup, il y a peut-être des spécificités que je ne parviens pas à maîtriser, je ne sais pas...

Soit le texte reste sous l'image, soit lorsque je fais des margin négatifs c'est l'ensemble de la fiche de base qui bouge dans la zone dédiée aux messages... Bref je n'y comprends rien du coup. Il doit y avoir un truc de base qui m'échappe je pense...

Comment je peux régler mon souci du coup ?

Voici le code html :

Code:

<link href="https://fonts.googleapis.com/css?family=Wire+One" rel="stylesheet"/><div class="compte"><h1>Compte de PSEUDO</h1><div class="compte-contenu1"><h3>Mes compétences</h3><div class="compte-text"><div class="competence">COMPETENCE 1</div><div class="competence">COMPETENCE 2</div><div class="competence">COMPETENCE 3</div><div class="competence">COMPETENCE 4</div></div></div><div class="compte-contenu"><h3>Mes lieux</h3><div class="compte-text"><div class="fichelieu"><div class="lieutitle"><img src="https://zupimages.net/up/20/23/9g1x.png" width= "400px;" /><span>Nom du lieu</span></div></div></div><div class="compte-contenu"><h3>Mes équipements</h3><div class="compte-text"></div></div><div class="compte-contenu"><h3>Mes objets/animaux</h3><div class="compte-text">blablablablablablablablabla</div></div></div></div>

et le CSS associé :

Code:

/**************************************************************
            COMPTE EN BANQUE
***************************************************************/
.compte
{
 width:600px;
 height: auto;
 background-color:#374357;
 background-image:url('https://www.transparenttextures.com/patterns/low-contrast-linen.png');
 margin:0 auto;
 overflow:hidden;
 font-family:'Calibri';
 }
.compte a
{
  color: #e8daaf;
}
.compte h1
{
  text-align: center;
  color:#aecde3;
  text-shadow:0px 0px 1px #aecde3;
  font-size:50px;
  font-weight:normal;
  font-family:Wire One;
  letter-spacing:10px;
}
.compte-contenu1
{
  height: auto;
  background-color:#4d5b71;
  background-image:url('https://www.transparenttextures.com/patterns/transparent-square-tiles.png');
  background-repeat: repeat;
  margin-top: 40px;
  margin-right: 40px;
  margin-left: 40px;
  margin-bottom: 30px;
  border:1px solid #aecde3;
  box-shadow:0px 0px 1px #aecde3;
  line-height:initial;
  opacity:0.6;
  transition:all 600ms;
}
.compte-contenu
{
  margin-top: 30px;
  height: auto;
  background-color:#4d5b71;
  background-image:url('https://www.transparenttextures.com/patterns/transparent-square-tiles.png');
  background-repeat: repeat;
  margin:30px 40px;
  border:1px solid #aecde3;
  box-shadow:0px 0px 1px #aecde3;
  line-height:initial;
  opacity:0.6;
  transition:all 600ms;
}
.compte-contenu1, compte-contenu:hover
{
  opacity:0.9;
}
.compte h3
{
  margin:0;
  padding:5px 10px;
  background-color:#2b2837;
  color:#aecde3;
  text-align: center;
  font-size:15px;
  font-weight:normal;
  font-family:Economica;
  letter-spacing:1px;
}
.compte-text
{
  background-image:url('https://www.transparenttextures.com/patterns/low-contrast-linen.png');
  height: auto;
  margin:20px;
  padding-right:5px;
  text-align:justify;
  font-size:13px;
  color:#d2d8e2;
  line-height:20px;
}
.competence
{
  display: block;
  text-align: center;
  background: #eee;
  padding: 2% 0;
  margin: 0 2% 2% 2%;
  font-family: 'Abel', sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 12px;
  transition: .5s all;
  color: black;
}
.competence:hover
{
  background-color: #536986;
  color: #ffffff;
}
.fichelieu
{
  position: relative;
  width: 475px;
  height: 400px;
  overflow: hidden;
  border: 1px solid #ffffff;
}
.lieutitle img
{
  padding: 10px 40px;
  z-index: 1;
}
.lieutitle span {
  text-align: center;
  color:#ffffff;
  text-shadow:0px 0px 1px #aecde3;
  font-family: 'Playfair Display', sans serif;
  font-size: 20px;
  font-weight: normal;
  letter-spacing:1px;
  z-index: 2;
  position: absolute;
  top: 0;
}