Anki CSS

Here my CSS. Card layouts first.
Notes: My cards have three fields, "Kanji" (Expression, I just named it kanji and never changed that), "Reading" and "Meaning". If your cards have less fields, you'll have to adjust the positioning of the fields by changing the value in margin. Always preview using browse, not the preview field (that's bugged, at least for me).
The url(_truecross2.png) is replaced with the name of your background picture. You put that into your media folder (Appdata\Roaming\Anki2\your profile\collection.media). You need a _ in front of the name of the file so that it doesn't get deleted.
The fonts are all default fonts in Windows, they should work fine. You can change the font by entering the name of the font behind "font-family".

///FRONT OF CARD:///

<div class=box>
<div class=kanji>{{Kanji}}</div>

///BACK OF CARD:///

<div class=box>
<div class=kanji-back>{{Kanji}}</div>


<div class=reading>{{Reading}}</div>
<div class=meaning>{{Meaning}}</div>

///CSS / STYLING:///

.card {
background: url(_truecross2.png);
}

.box{
  background-color: white;
  position: absolute;
  height: 50%;
  width: 60%;
  left: 20%;
  top: 20%;
border-radius: 25px;
box-shadow: 5px 5px 10px grey ;
}

.kanji {
font-family: UD Digi Kyokasho N-R;
font-size: 60px;
text-align: center;
color: black;
margin-top: 18%;
}

.kanji-back {
font-family: Ud Digi  Kyokasho N-R;
font-size: 60px;
text-align: center;
color: black;
margin-top: 12.5%;
}

.reading {
font-family: UD Digi Kyokasho N-R;
font-size: 50px;
text-align: center;
color: black;
margin-top: 10px;
}

.meaning  {
font-family: Calibri;
font-size: 50px;
text-align: center;
color: black;
margin-top: 10px;
}