#creator-page-row {
    height: 100%;
    margin-inline: -10px;
    margin-block: -10px;
    display: flex;
    flex-flow: column;
    flex-wrap: wrap;
    --bs-gutter-x: 0px;
    gap: 10px;
    padding: 10px;
}

.card-flex-column {
    width: 100%;
    flex: 1;
    display: flex;
    padding: 10px;
}

.item-container {
    /*    width: var(--card-width);*/
    height: auto;
    z-index: 2;
    background-color: #0f0f0f;
    flex: 1;
    display: flex;
    justify-content: center;
}

.card-grid-container {
/*    border: solid white 1px;*/
    align-self: center;
/*    width: 60%;*/
    height: auto;
    display: grid;
    grid-template-columns: 4px auto 4px;
    grid-template-rows: 4px auto 4px;
    justify-items: center;
    align-items: center;
}

.person-card {
    display: flex;
    width: 100%;
    /*    border: solid #ffffff 1px;*/
    padding: 5px;
    align-items: center;
}

.person-card-image {
    height: var(--square-medium);
    width: var(--square-medium);
    background-size: cover;
    margin-right: 15px;
}

.person-card-info {
    color: #dcdcdc;
    flex: 1;
    display: flex;
    justify-content: space-between;
    flex-direction: row; /* Default layout: side by side */
}

.card-info-text {
    display: flex;
    flex-direction: column;
}

.person-card-info-name {
    font: 2em "JetBrains Mono";
    text-align: left;
    color: var(--lag-orange);
}

.person-card-info-desc {
    font: .85em "JetBrains Mono";
    color: #cdcdcd;
}

.social-icons-cont {
    padding-right: 2px;
    padding-left: 2px;
    height: fit-content;
    display: flex;
    flex-flow: row;
    gap: 4px;
    border-bottom: solid white 1px;
    padding-bottom: 2px;
}

.social-icon {
    display: flex;
    height: 18px;
}

    .social-icon a {
        line-height: 100%;
    }

    .social-icon img {
        height: 100%;
    }

@media (max-width: 991px){
    .social-icons-cont {
        flex-direction: row; 
        gap: 10px;
    }

    .person-card-info {
        flex-direction: column; 
        gap: 10px;
    }

    .social-icon {
        height: 24px;
        padding-right: 4px;
        padding-left: 4px;
    }
}



.corner {
    width: 4px;
    height: 4px;
    box-sizing: border-box;
}

.corner-one {
    border-right: solid white 1px;
    border-bottom: solid white 1px;
}

.corner-two {
    border-bottom: solid white 1px;
    width: 100%;
}

.corner-three {
    border-left: solid white 1px;
    border-bottom: solid white 1px;
}

.corner-four {
    border-right: solid white 1px;
    height: 100%;
}

.corner-five {
    border-left: solid white 1px;
    height: 100%;
}

.corner-six {
    border-right: solid white 1px;
    border-top: solid white 1px;
}

.corner-seven {
    border-top: solid white 1px;
    width: 100%;
}

.corner-eight {
    border-left: solid white 1px;
    border-top: solid white 1px;
}