#about {
    margin-top: var(--top-margin);
}
#about .item .thumbnail {
    padding-top: 137%;
}
#about .item {
    margin-bottom: var(--big-spacing);
}
#about .item .email {
    word-break: break-word;
}
#about .text {
    margin-bottom: var(--default-spacing);
}
#about .text .row.last {
    margin-bottom: 5px;
}
#about .awards {
    margin-bottom: var(--default-spacing);
}
#about .awards .row.first {
    margin-top: 5px;
}
aside .team_image img {
    display: block;
    width: 100%;
}
@media only screen and (min-width: 768px) {
    #about .item {
        margin-bottom: 0;
    }
    aside .team_image img {
        margin-top: var(--default-spacing);
    }
}
@media only screen and (min-width: 1024px) {
    #about {
        margin-top: 0;
        display: flex;
    }
    #about > .texts {
        width: 33.33%;
        box-sizing: border-box;
        padding-right: var(--default-spacing);
        position: relative;
    }
    #about > aside {
        width: 66.66%;
    }
    #about .awards {
        position: absolute;
        bottom: 0;
        left: 0;
        box-sizing: border-box;
        padding-right: var(--default-spacing);
    }
    
    /* Members grid */
    #about .grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    /* Span */
    #about .grid .span-3 {
        grid-column: span 2;
    }
    #about .grid .span-4 {
        grid-column: span 3;
    }
    
    /* Width of item in span */
    #about .grid .span-3 .item {
        width: calc((100% - (var(--default-spacing) * 1)) / 2);
        box-sizing: border-box;
    }
    #about .grid .span-4 .item {
        width: calc((100% - (var(--default-spacing) * 2)) / 3);
        box-sizing: border-box;
    }
    
    /* Align item in span */
    #about .grid .span-3.right,
    #about .grid .span-4.right {
        display: flex;
        justify-content: flex-end;
    }
    
    /* Team image */
    aside .team_image img {
        width: calc((((100% - (var(--default-spacing) * 2)) / 3) * 2) + var(--default-spacing));
    }
    aside .team_image {
        display: flex;
        justify-content: flex-end;
    }
}
@media only screen and (min-width: 1280px) {
    
    /* Members grid */
    #about .grid {
        grid-template-columns: repeat(4, 1fr);
    }
    
    /* Span */
    #about .grid .span-3 {
        grid-column: span 3;
    }
    #about .grid .span-4 {
        grid-column: span 4;
    }
    
    /* Width of item in span */
    #about .grid .span-3 .item {
        width: calc((100% - (var(--default-spacing) * 2)) / 3);
    }
    #about .grid .span-4 .item {
        width: calc((100% - (var(--default-spacing) * 3)) / 4);
    }
    
    /* Gap in span */
    #about .grid .span-4.gap-1.left .item {
        margin-left: calc(((100% - (var(--default-spacing) * 3)) / 4) + var(--default-spacing));
    }
    #about .grid .span-4.gap-2.left .item {
        margin-left: calc((((100% - (var(--default-spacing) * 3)) / 4) * 2) + (2 * var(--default-spacing)));
    }
    #about .grid .span-4.gap-1.right .item {
        margin-right: calc(((100% - (var(--default-spacing) * 3)) / 4) + var(--default-spacing));
    }
    #about .grid .span-4.gap-2.right .item {
        margin-right: calc((((100% - (var(--default-spacing) * 3)) / 4) * 2) + (2 * var(--default-spacing)));
    }
    
    aside .team_image img {
        display: block;
        margin-top: var(--default-spacing);
        width: calc((100% - (var(--default-spacing))) / 2);
    }
}