h1, h2, h3, p {
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
}

h1.title {
    font-size: 32px;
    color: white;
    position: relative;
    top: -10;
}

h1.title span.slash {
    font-size: 16;
    vertical-align: middle;
    font-family: 'Fira Code', sans-serif;
    color: rgba(255, 255, 255, 0.5);
}

html, body {
    height: 100%;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.centered {
    text-align: center;
}

.four04 {
    color: #f10034;
    transform: rotate(248deg);
    font-size: 64;
    writing-mode: vertical-lr;
    font-family: 'Fira Code', sans-serif;
}

.bg-img {
    background-image: url("../images/00045-1001487361.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    width:100%;
    height:100%;
    backdrop-filter: blur(10px) hue-rotate(-25deg);
}

div.socials {
    display: inline-block;
    position: absolute;
    text-align: center;
}

div.socials code {
    position: relative;
    top: 3em;

    font-family: 'Fira Code', sans-serif;
    font-weight: 300;
    font-size: 12;
    color: white;
}

code img.github {
    position: relative;
    top: 4px;
}

code img.linkedin {
    position: relative;
    top: 2px;
}

code a {
    text-decoration: none;
    color: white;
}

code a:hover {
    font-weight: bold;
}