@import 'components/person-card.css';

#SubpageContainer.read-only .kebab-btn {
	visibility: hidden;
}

#SubpageHeader {
	position: relative;
	display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(2, auto);
	column-gap: 4px;
}

#SubpageTitle {
	grid-column: 1;
	grid-row: 1;
}

#SubpageDescription {
	grid-column: 1;
}

#SubpageHeader .subpage-actions {
	grid-row: 1 / -1;
}

#SubpageWrapper .current-user .kebab-btn {
	visibility: hidden;
}

.role-member .person-role-tag-bg {
	display: none;
}


/** Tier 2 */
/** iPads, misc. tablets, widescreen notebooks */
@media
only screen and ( max-width: 1440px ),
only screen and ( max-height: 860px )
{
	#SubpageHeader {
		grid-template-rows: auto;

		margin-bottom: 0;
	}

	#SubpageDescription {
		grid-row: 1;
	}

	#SubpageHeader .subpage-actions {
		grid-row: 1;

		flex-direction: column;
		align-items: end;
	}
}


/** Tier 3 */
@media
only screen and ( max-width: 930px )
{

}


/** Tier 4 */
/** Phones */
@media
only screen and ( max-width: 666px )
{
	#SubpageHeader {
        grid-auto-flow: row;
    }

	#SubpageTitle {
		grid-row: 1;
	}
}