Why are svg rendered tilted (Processing)?

My aim is to remake the classic Freecell card game for Windows Xp on Windows 10 with Processing 3.<br>
To do so I downloaded from here a set of svg files that most resembled the old cards' look.<br>
In my code I have a class called Deck that contains an ArrayList of cards and, when constructed, it initializes the cards giving them the path for the svg file they need and after also x and y coordinates.<br>

class Deck
{
String[] seeds = {"HEART", "DIAMOND", "CLUB", "SPADE"};
String[] values = {"1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13"};
ArrayList<Card> cards = new ArrayList<Card>();
Deck()
{
//Create the cards and store them into the array.
for(int seed = 0; seed < seeds.length; seed++)
{
for(int value = 0; value < values.length; value++)
{
String cardName = seeds[seed] + "-" + values[value] + ".svg";
cards.add(new Card(cardName));
}
}
//Shuffle the deck.
//this.shuffle();
//Give the cards x and y coordinates.
for(int c = 0; c < cards.size(); c++)
{
int x = cardSpace + (cardWidth+cardSpace)*(c%8);
int y = 32 + cardHeight + edge*2 + cardSpace + 25*(c/8);
cards.get(c).setxy(x, y);
}
}
void shuffle()
{
for(int c = cards.size()-1; c > 0; c--)
{
int k = (int)Math.floor(Math.random() * (c + 1));
Card card = cards.get(c);
cards.set(c, cards.get(k));
cards.set(k, card);
}
}
void render()
{
for(Card card : cards)
{
card.render();
}
}
}

Card class:

class Card
{
PShape svg;
int x;
int y;
Card(String svgName)
{
this.svg = loadShape(svgName);
}
void setxy(int x, int y)
{
this.x = x;
this.y = y;
}
boolean isMouseOver()
{
return mouseX > x && mouseX < (x+cardWidth) && mouseY > y && mouseY < (y+cardHeight);
}
void render()
{
shape(svg, x, y, cardWidth, cardHeight);
}
}

The render() method of the class Deck is called once every draw() loop, with frameRate set to 10.<br>
Anyway, the code works fine, the only problem is in how two svg are rendered, as you can see here:

For some reasons, only the 5 of spade and the inner drawing of the jack of heart are completely tilted.<br>
However when opened with Inkscape or any browser they look correctly orientated, thus my confusion.<br>
I tried to use the original versions of those two svg, yet they are still rendered tilted. I tried to compare the xml of those two svg, but I couldn't understand what could be causing the problem.<br>
It may also be processing, but then I would have no idea why or how to fix it.<br>
Any help will be appreciated, thanks in advance.<br>

EDIT<br>
Adding main sketch file as requested in the comments.<br>
However note that it's stripped off of the upper gray bar and the rectangles.

//Global objects.
Deck deck;
//Global objects.
//Global variables.
int edge = 2;
int cardSpace = 15;
int cardWidth = 100;
int cardHeight = 140;
//Global variables.
void settings()
{
int w = cardWidth*8 + cardSpace*9;
int h = cardHeight*5 + 32;
size(w, h);
}
void setup()
{
frameRate(30);
deck = new Deck();  //Initialized here because of loadImage().
}
void draw()
{
background(60, 145, 50);
deck.render();
}

I tested it, and this seems to fix it.

In SPADE-5.svg, on line 84/85, remove

transform="rotate(180,1744.645,-315.5025)"

HEART-11-JACK.svg, on line 123/124, remove

transform="rotate(0.33810995,363.27095,269.89449)"

(make sure not to delete the >)