/* font stuff */
@font-face 
{
  font-family: MedievalSharp;
  src: url("../assets/fonts/medieval-sharp-font/MedievalSharp-xOZ5.ttf");
}

/* container stuff */
a {
    all: unset;
}

/* general card formatting */
.card {   
    padding: 5px;
    cursor: pointer;
    width: 300px;
    height: 200px;
    perspective: 1000px;
    transition-duration: 0.8s;
}

.card img {
    max-width: 100%;
    max-height: 100%;
}

.cardInner {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.8s;
    transform-style: preserve-3d;
    border-radius: 5px;
}
.card:hover .cardInner:hover{
    transform: rotateY(180deg);
}


.cardFront, .cardBack {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.cardFront {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.cardBack {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: rotateY(180deg);

}
.cardText {
    display: flex;
    gap: 20px;
    align-items: center;
}

/* specific item formatting */
#FoodWars {
    background-color: #c1759b;
    font-family: MedievalSharp;
}
#dungeonCrawler {
    background-color: #000000;
    color: white;
}
#Printables {
    background-color: #404040;
}
#Github {
    background-color: #000000;
    color: white;
}
#TodoPad {
    background-color: #000000;
    color: white;
}
#Microlang {
    background-color: #1f1e1e;
    color: white;
}
#imgToText {
    background-color: #000000;
    color: white;
}