.info-item {
    display: flex;
}

.info-item:not(:first-child) {
    margin-top: 15px;
}

.info-item div:first-child {
    font-weight: 600;
    margin-right: 4px;
}

/* Game press kit buttons */
.game-press-kit-button {
    border-radius: var(--main-rounding);
    background-color: hsl(222, 14%, 28%);
  
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;

    display: flex;

    font-size: 1.2rem;
    font-weight: 500;

    align-items: center;
}

.game-press-kit-button:not(:first-child) {
    margin-top: 15px;
}





/* Videos */
.video {
    overflow: hidden;
    position: relative;
    z-index: 0;
    width: 100%;
    border-radius: var(--main-rounding);
}

.video::after {
    padding-top: 56.25%;
    display: block;
    content: '';
}

.video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* Image Grid */

/* Desktop */
@media only screen and (min-width: 546px) {
    .row {
        display: flex;
        flex-wrap: wrap;
    }
}
  
.column {
    flex: 50%;
    padding: 0 4px;
}

.column img {
    margin-top: 8px;
    vertical-align: middle;
    width: 100%;
    border-radius: var(--main-rounding);
}

.image-asset {
    cursor: pointer;

    border-color: transparent;
    border-width: 3px;
    border-style: solid;

    transition: 200ms ease-in-out;
}

.image-asset:hover {
    border-color: var(--main-color);
}



/* Team member */
.team-member {
    background-color: hsl(222, 14%, 28%);
    padding: 10px;
    padding-left: 15px;
    padding-right: 15px;
    border-radius: var(--main-rounding);
    width: 100%;

    display: inline-block; 
    vertical-align: top;
}

.team-member:nth-child(n+3) {
    margin-top: 15px;
}

.team-member .name {
    margin-bottom: 5px;
    font-size: large;
    font-weight: 600;
}

.team-member .left {
    float: left;
    height: 100%;
}

.team-member .right {
    float: right;
    margin-top: 10px;
}

.team-member .social-icons {
    display: inline-flex;
}

.team-member .social-icons a {
    display: inline-flex;
    margin-left: 4px;
    margin-right: 4px;
    border-radius: 100%;
}

.team-member .social-icons .icon {
    width: 100%;
    max-width: 35px;
    transition: opacity 0.2s ease-in-out;
    border-radius: 100%;
  }

.team-member .social-icons a:hover .icon {
    /* filter: invert(62%) sepia(88%) saturate(6739%) hue-rotate(341deg) brightness(109%) contrast(101%); */
    opacity: 50%;
}


/* Separator */
.separator {
    display: flex;
    align-items: center;
    text-align: center;
    font-weight: 600;
    font-size: large;
  }
  
  .separator::before,
  .separator::after {
    content: '';
    flex: 1;
    border-bottom: 2px solid rgb(238, 238, 238);
  }
  
  .separator:not(:empty)::before {
    margin-right: .25em;
  }
  
  .separator:not(:empty)::after {
    margin-left: .25em;
  }