@charset "utf-8"; /* CSS Document */ html, body { height: 100%; margin: 0; padding: 0; } .bio-container { display: flex; flex-wrap: wrap; align-items: flex-start; padding-top: 30px; } .bio-photo-container { margin-right: 20px; text-align: center; flex: 0 0 auto; align-self: flex-start; } .bio-photo { width: 175px; height: 245px; object-fit: cover; padding-top: 15px; } .bio-caption { font-size: 14px; color: #505050; } .bio-text { flex: 1; max-width: calc(100% - 195px); } .bio-name { font-size: 22px; color: #505050; font-weight: bold; margin-top: 15px; text-transform: none; } .divider { width: 100%; margin-bottom: 52px; margin-top: 12px; height: 1px; background-color: #CEDFEF; border: 0 none; } @media (max-width: 1562px) { .bio-text { flex: 1; max-width: 100%; } } /* Closing bracket added here */ @media (max-width: 960px) { .bio-container { flex-direction: column; align-items: center; } .bio-photo-container { margin-bottom: 20px; margin-right: 0; } .bio-text { text-align: left; max-width: 100%; } }