.body-a {
	display: flex;
	justify-content:center;
	align-items: flex-start;
	gap: 32px;
	color: var(--text-title);
	font-size: 24px;
	font-family: 'Atkinson Hyperlegible';
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: 0.48px;
	padding: 0 80px;
	overflow: auto;
	padding-top:150px;
	padding-bottom:100px;
}



/* header */

.header {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.header-subtitle {
	color: var(--text-title);
	font-size: 28px;
	font-family: 'Atkinson Hyperlegible';
	font-style: normal;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -1.39px;
	text-align: left;
}

.header-link-see-all {
	text-align: center;
}
/* end header*/




/* card-a */

.card-a {
	box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.1);
	display: flex;
	align-items: center;
	gap: 16px;
	background-color: var(--surface-default);
	padding: 16px;
	border-radius: 13px;
}

.card-img1 {
	flex-shrink: 0;
}

.card-subtitle {
	flex-grow: 1;
	text-align: left;
}

.card-right-arrow1 {
	width: 24px;
	flex-shrink: 0;
}
/* end card-a*/




/* card-b */

.card-b {
	box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.1);
	display: flex;
	align-items: center;
	gap: 16px;
	background-color: var(--surface-default);
	padding: 16px;
	border-radius: 13px;
}

.card-img2 {
	flex-shrink: 0;
}

.card-text {
	flex-grow: 1;
	color: var(--greyscale-800);
	font-size: 24px;
	font-family: 'Atkinson Hyperlegible';
	font-style: normal;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -1.19px;
	text-align: left;
}

.card-right-arrow2 {
	width: 24px;
	flex-shrink: 0;
}
/* end card-b*/


.mini-icons {
	width: 50px;
	flex-shrink: 0;
	border-radius: 50%;
}

.line {
	height: 0;
	flex-shrink: 0;
	border-top: 1px solid var(--border-default);
}

.text-a {
	max-height: 128px;
	color: var(--text-title);
	font-size: 14px;
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0px;
	text-align: left;
}

.text-b {
	color: var(--text-title);
	font-size: 14px;
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0px;
	text-align: left;
}



/* row-c */

.row-c {
	display: flex;
	align-items: center;
	gap: 8px;
}

.row-thumb-up {
	width: 24px;
	flex-shrink: 0;
}
/* end row-c*/


.body-a-left {
	width: 429px;
	display: flex;
	flex-direction: column;
	gap: 32px;
	flex-shrink: 0;
}

.card-events {
	container: card-events / inline-size;
	gap: 16px;
}



/* event */

.event {
	box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.1);
	display: flex;
	align-items: center;
	gap: 8px;
	background-color: var(--surface-default);
	padding: 16px;
	border-radius: 24px;
}

.event-col-left {
	width: 80px;
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
}

.event-text-top {
	color: var(--text-title);
	font-size: 20px;
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0px;
	text-align: center;
}

.event-subtitle {
	color: var(--text-title);
	font-size: 36px;
	font-family: 'Atkinson Hyperlegible';
	font-style: normal;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -1.78px;
	text-align: center;
}

.event-text-bottom {
	color: var(--text-title);
	font-size: 14px;
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0px;
	text-align: center;
}

.event-col {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex-grow: 1;
}

.event-text1 {
	color: var(--text-title);
	font-size: 24px;
	font-family: 'Atkinson Hyperlegible';
	font-style: normal;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -1.19px;
	text-align: left;
}

.event-row-bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: flex-start;
	gap: 8px;
	row-gap: 8px;
}

.event-distance {
	width: 18px;
	flex-shrink: 0;
}

.event-text2 {
	flex-grow: 1;
	color: var(--text-title);
	font-size: 20px;
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0px;
	text-align: left;
}
/* end event*/


.card-events-subtitle {
	text-align: left;
}

.card-events-link {
	text-align: center;
}

.card-s {
	container: card-s / inline-size;
	gap: 16px;
}

.card-labs {
	container: card-s / inline-size;
	gap: 16px;
}

.body-a-feed-container {
	margin-bottom: -747px;
	max-width: 1280px;
	overflow: scroll;
	display: flex;
	flex-direction: column;
	gap: 16px;
	flex-grow: 1;
}



/* feed-card-a */

.feed-card-a {
	container: feed-card-a / inline-size;
	box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	gap: 16px;
	background-color: var(--logo-signature-colors-white);
	padding: 16px;
	border-radius: 24px;
	overflow: hidden;
}



/* post-comment */

.post-comment {
	container: post-comment / inline-size;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.post-comment-header1 {
	display: flex;
	align-items: flex-start;
	gap: 16px;
}

.post-comment-header2 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.post-comment-text-meghan-hoffman {
	text-align: left;
}

.post-comment-text-ai-connections {
	color: var(--text-body);
	text-align: left;
}

.post-comment-text-this-is-amazing {
	margin-left: 66px;
	align-self: stretch;
	color: var(--text-title);
	text-align: left;
}
/* end post-comment*/


.feed-card-post-info1 {
	display: flex;
	align-items: center;
	gap: 8px;
}

.feed-card-profile-info {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-grow: 1;
	padding: 12px 0;
}

.feed-card-text-fname-lname {
	text-align: left;
}

.feed-card-text-stud {
	text-align: left;
}

.feed-card-text-post1 {
	text-align: left;
}

.feed-card-attachment {
	margin-top: 1px;
	flex-shrink: 0;
	border-radius: 12px;
}

.feed-card-stats {
	margin-top: 1px;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}



/* row-b */

.row-b {
	display: flex;
	align-items: flex-start;
	gap: 4px;
}
/* end row-b*/


.feed-card-interactions {
	margin-top: 1px;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	gap: 62px;
	padding: 0 21px;
}
/* end feed-card-a*/




/* feed-card-b */

.feed-card-b {
	container: feed-card-b / inline-size;
	box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	gap: 16px;
	background-color: var(--logo-signature-colors-white);
	padding: 16px 16px 675px 16px;
	border-radius: 24px;
	overflow: hidden;
}

.feed-card-post-info2 {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 2px 0;
}

.feed-card-mini-icons-a {
	width: 50px;
	flex-shrink: 0;
	border-radius: 50%;
}

.feed-card-text-profile {
	flex-grow: 1;
	text-align: left;
}

.feed-card-text-post2 {
	text-align: left;
}

.feed-card-text2 {
	max-height: 128px;
	text-align: left;
}
/* end feed-card-b*/


.body-a-post {
	container: body-a-post / inline-size;
	box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	gap: 16px;
	background-color: var(--logo-signature-colors-white);
	padding: 16px;
	border-radius: 24px;
}

.input-group-create-a-post {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.input-group-create-a-post-profile-icon {
	width: 54px;
}

.input-group-create-a-post-type-box {
	min-height: 54px;
	flex-grow: 1;
	color: var(--puma-black);
	text-align: left;
}

.body-a-attachments {
	container: body-a-attachments / inline-size;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	padding: 0 32px;
}



/* row-a */

.row-a {
	display: flex;
	align-items: center;
	gap: 8px;
}

.row-add-photo {
	width: 24px;
	flex-shrink: 0;
}

.row-text1 {
	color: var(--text-subtitle);
	font-size: 20px;
	font-family: 'IBM Plex Sans';
	font-style: normal;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0px;
	text-align: left;
}
/* end row-a*/


.feed-card1 .feed-card-text1 {
	margin-top: 1px;
}

.feed-card1 .see-more-posts {
	margin-top: 1px;
	align-self: start;
}



/** breakpoints (margin / paddings) **/

@media screen and (max-width: 1280px) {
	.body-a {
		padding-inline: var(--margin-md);
	}
	.post-comment-text-this-is-amazing {
		margin-inline: 0;
	}
	.feed-card-interactions {
		padding-inline: 0;
	}
	.body-a-attachments {
		padding-inline: 0;
	}
}

@media screen and (max-width: 576px) {
	.body-a {
		padding-inline: var(--margin-sm);
	}
}



/* container queries (flex rows) */

@media(max-width:1501px) {
	.body-a {
		flex-direction: column;
		align-items: stretch;
		gap: 100px;
	}
	.body-a > .body-a-left {
		width: 100%;
		max-width: 429px;
	}
}

@container card-s (width < 176px) {
	.header {
		flex-direction: column;
		align-items: center;
		gap: 13px;
	}
	.header > * {
		text-align: center;
	}
}

@container card-events (width < 380px) {
	.event {
		flex-direction: column;
		align-items: center;
		gap: 17px;
	}
	.event > * {
		text-align: center;
	}
	.event > .event-col-left > * {
		text-align: unset;
	}
	.event > .event-col {
		width: 100%;
	}
	.event > .event-col > * {
		text-align: unset;
	}
}

@container post-comment (width < 219px) {
	.post-comment-header1 {
		flex-direction: column;
		align-items: center;
		gap: 14px;
	}
	.post-comment1 > * {
		margin-left: 0; margin-right: 0;
	}
	.post-comment-header1 > * {
		text-align: center;
	}
	.post-comment-header1 > .post-comment-header2 {
		align-items: center;
	}
	.post-comment-header1 > .post-comment-header2 > * {
		text-align: unset;
	}
}

@container feed-card-a (width < 329px) {
	.feed-card-post-info1 {
		flex-direction: column;
		align-items: center;
		gap: 14px;
	}
	.feed-card-post-info1 > * {
		text-align: center;
	}
	.feed-card-post-info1 > .feed-card-profile-info {
		width: 100%;
	}
}

@container feed-card-a (width < 381px) {
	.feed-card-interactions {
		flex-direction: column;
		align-items: center;
		gap: 13px;
	}
	.feed-card-interactions > * {
		text-align: center;
	}
}

@container feed-card-b (width < 858px) {
	.feed-card-post-info2 {
		flex-direction: column;
		align-items: center;
		gap: 13px;
	}
	.feed-card-post-info2 > * {
		text-align: center;
	}
	.feed-card-post-info2 > .feed-card-text-profile {
		width: 100%;
	}
}

@container body-a-post (width < 858px) {
	.input-group-create-a-post {
		flex-direction: column;
		align-items: center;
		gap: 14px;
	}
	.input-group-create-a-post > * {
		text-align: center;
	}
	.input-group-create-a-post > .input-group-create-a-post-type-box {
		width: 100%;
	}
}

@container body-a-post (width < 548px) {
	.body-a-attachments {
		flex-direction: column;
		align-items: center;
		gap: 13px;
	}
	.body-a-attachments > * {
		text-align: center;
	}
}

@container body-a-attachments (width < 148px) {
	.row-a {
		flex-direction: column;
		align-items: center;
		gap: 13px;
	}
	.row-a > * {
		text-align: center;
	}
}
