@font-face {
    font-family: "futura";
    src: url("assets/futura.ttf") format("truetype");
}
@font-face {
    font-family: "conthrax";
    src: url("assets/conthrax.semi-bold.otf") format("truetype");
}
@font-face {
    font-family: "walkerbot";
    src: url("assets/walker-bot-ldr.regular.ttf") format("truetype");
}
body {
    background-color: #E7F5F6; 
    color: #055260;
    font-family: "futura", sans-serif;
}
.main{
    border: none;
    width: 50%;
    min-width: 350px;
    height: 100%;
    margin: auto;
    margin-top: -68px;
    background-color: #ffffff;
}
.title {
    border: none;
    width: 100%;
    height: 150px;
    font-family: "walkerbot", sans-serif;
    color: #E7F5F6;
    background-color: #5DBFCE;
    overflow-x: hidden;
    overflow-y: clip;
}
.title h1{
    font-size: 100px;
}
.links {
    border: none;
    width: 100%;
    height: 30px;
    background-color: #BFF5FB;
    margin-top: -5px;
}
.links p {
    margin-top: 5px;
}
.content {
    display: flex;
}
.left {
    border: none;
    width: 50%;
    height: 100%;
    float: left;
}
.right {
    border: none;
    width: 50%;
    height: 100%;
    float: right;
    border-left: 2px solid #BFF5FB;
    overflow-x: hidden;
}
.right h1 {
    font-family: "conthrax", sans-serif;
    font-size: 25px;
}
p, h1, h2, h3 {
    padding: 0px 15px 0px 15px;
}
a {
    color: #055260;
}
.art-category {
    border: #BFF5FB 2px solid;
    width: 70%;
    margin: auto;
    margin-top: 20px;
    text-align: center;
}
.commissions {
    border: #BFF5FB 2px solid;
    width: 70%;
    margin: auto;
    margin-top: 20px;
    text-align: center;
}

.art-category img {
  filter:sepia(0.8) hue-rotate(150deg) saturate(2) contrast(0.8);
  image-rendering: pixelated;
  transition: 0.2s;
  }
.art-category img:hover {
    filter: none;
    transition: 0.2s;
}
.comicbox img, .artfightbox img {
    width: 90%;
    margin: auto;
    padding-left: 5%;
}