Center text in custom card

Configuration Frontend
1

Hi

I have this card

- type: custom:mushroom-title-card
          view_layout:
            grid:area: right
          title: >-
            Köket  
            {{states("sensor.termometer_tvattstugan_temperatur","0","°C") }} 
          card_mod:
            style: |
              ha-card {
                background-color: rgba(41,37,29,0.4) !important;
                border-style: none; 
              }

I don't know how to format the text, been googling awhile, which is how I managed to put together this much code. Sorry for bothering you with something that I assume is quite easy, but if it is then it's not too much to ask I hope.

I would like the text, including the temperature to be centered and slightly bigger, perhaps bold.
And, if possible, the temperature could be presented with a decimal comma, ie 20,8 °C, as per my locale, or not showing any decimals at all.

Update:
Posted the full card, which I should have done in the first place.

2

There is not much info about what card it is, so it will be a wild guess to help you.

If it is a mark down card, then HTML tage can be used, like <center> and </center>.
The HTML table tags can also be helpful in a mark down card.

3

My apologies, forgot the rest of the card. It is a Mushroom title card card, it gave me larger letters. Perhaps a markdown card is a better option?

Full card

- type: custom:mushroom-title-card
          view_layout:
            grid:area: right
          title: >-
            Köket  
            {{states("sensor.termometer_tvattstugan_temperatur","0","°C") }} 
          card_mod:
            style: |
              ha-card {
                background-color: rgba(41,37,29,0.4) !important;
                border-style: none; 
              }
4

Hi,
try this code :

type: custom:mushroom-title-card
title: "Köket   {{states(\"sensor.termometer_tvattstugan_temperatur\",\"0\",\"°C\") }} "
view_layout:
  grid:area: right
card_mod:
  style: |
    ha-card {
      background-color: rgba(41,37,29,0.4) !important;
      border: none;        
    }
    h1.title {
      text-align: center;
    }
5

Thank you! This works for centering the text.

What language os this? If I know what to look for maybe I can find code to make the text bigger and set the locale for formatting.

6

CSS

for text size using font-size:

type: custom:mushroom-title-card
title: "Köket   {{states('sensor.lywsd03mmc_0945_temperature', with_unit=true) }}"
view_layout:
  grid:area: right
card_mod:
  style: |
    ha-card {
      background-color: rgba(41,37,29,0.4) !important;
      border: none;        
    }
    h1.title {
      text-align: center;
      font-size: 50px;
    }

image