@media (min-width: 0em) {

	/* Generic */

	section.portal-component,
	section.portal-component * {
		box-sizing: border-box;
	}
	section.portal-component {
		line-height: 1.5;
		font-size: 16px;
		background: #eef3fb;
	}
	section.portal-component .interior {
		display: flex;
		flex-flow: column nowrap;
		justify-content: flex-start;
		align-items: stretch;
		gap: 1em;
		margin: 0 auto;
		padding: 16px;
		width: 100%;
		max-width: 1200px;
	}
	section.portal-component :is(h1,h2,hr) {
		margin: 0;
		font-size: 32px;
		font-weight: 700;
	}
	section.portal-component hr {
		border: 1px solid rgba(0,0,0,0.1);
	}

	/* Subnav */

	section.portal-component.portal_subnav {
		background: #191919;
	}
	section.portal-component.portal_subnav .interior {
		display: flex;
		flex-flow: row nowrap;
		justify-content: space-between;
		align-items: center;
		padding-top: 8px;
		padding-bottom: 8px;
	}
	section.portal-component.portal_subnav .left {
		color: #FFF;
	}
	section.portal-component.portal_subnav .left .title {
		font-weight: 700;
	}
	section.portal-component.portal_subnav .right .menu {
		display: flex;
		flex-flow: row nowrap;
		justify-content: flex-start;
		align-items: center;
		gap: 2em;
		margin: 0;
		padding: 0;
	}
	section.portal-component.portal_subnav .right .menu a {
		padding: 0;
		font-weight: 700;
		text-decoration: none;
		color: #CCC;
	}
	section.portal-component.portal_subnav .right a:hover {
		color: #FFF;
	}

	/* Toasts */

	section.portal-component .error {
		border: 1px solid #800000;
		border-radius: 4px;
		padding: 3px 7px;
		background: #FFEEEE;
		color: #800000;
	}
	section.portal-component .success {
		border: 1px solid #008000;
		border-radius: 4px;
		padding: 3px 7px;
		background: #EEFFEE;
		color: #008000;
	}
	section.portal-component .error p,
	section.portal-component .success p {
		margin: 0;
		padding: 0;
		line-height: 1.5;
	}

	/* Login, Reset */

	section.portal-component.portal_reset form,
	section.portal-component.portal_login form {
		display: flex;
		flex-flow: column nowrap;
		justify-content: flex-start;
		align-items: stretch;
		gap: 1em;
	}
	section.portal-component.portal_reset label,
	section.portal-component.portal_login label {
		display: flex;
		flex-flow: column nowrap;
		justify-content: flex-start;
		align-items: stretch;
	}
	section.portal-component.portal_login label:has(input[type="checkbox"]) {
		flex-flow: row nowrap;
		gap: 0.5em;
	}
	section.portal-component.portal_reset input,
	section.portal-component.portal_login input {
		margin: 0;
		order: 2;
	}
	section.portal-component.portal_reset input[type="text"],
	section.portal-component.portal_login input[type="text"],
	section.portal-component.portal_reset input[type="password"],
	section.portal-component.portal_login input[type="password"] {
		border: 1px solid #000;
		border-radius: 4px;
		line-height: inherit;
		padding: 8px;
	}
	section.portal-component.portal_login input[type="checkbox"] {
		order: 1;
		cursor: pointer;
	}
	section.portal-component.portal_reset span,
	section.portal-component.portal_login span {
		order: 1;
	}
	section.portal-component.portal_login input[type="checkbox"] ~ span {
		order: 2;
		cursor: pointer;
	}
	section.portal-component.portal_reset button[type="submit"],
	section.portal-component.portal_login button[type="submit"] {
		display: block;
		border: none;
		border-radius: 4px;
		padding: 10px 18px;
		background: #800;
		color: #ffffff;
		transition: 0.25s;
		cursor: pointer;
	}
	section.portal-component.portal_reset form ~ p,
	section.portal-component.portal_login form ~ p {
		margin: 0;
	}

	/* Upload & Download Widgets */

	section.portal-component .widget.upload {
		display: flex;
		flex-flow: column nowrap;
		justify-content: flex-start;
		align-items: stretch;
		gap: 8px;
		margin: 32px 0 0 0;
	}
	section.portal-component .widget:is(.upload,.download) .file-name {
		display: flex;
		flex-flow: row nowrap;
		justify-content: flex-start;
		align-items: center;
		gap: 8px;
	}
	section.portal-component .widget:is(.upload,.download) :is(.file-name,.notice) em {
		display: block;
		font-style: italic;
		color: #000;
		opacity: 0.5;
	}
	section.portal-component .widget:is(.upload,.download) .file-name::before {
		content: '';
		display: block;
		border-radius: 16px;
		width: 32px;
		height: 32px;
		line-height: 32px;
		text-align: center;
		color: #FFF;
	}
	section.portal-component .widget:is(.upload,.download).found .file-name::before {
		content: '\2714';
		background: #435A42;
	}
	section.portal-component .widget:is(.upload,.download).not-found .file-name::before {
		content: '\2716';
		background: #800;
	}
	section.portal-component .widget:is(.upload,.download).disabled .file-name::before {
		content: '\268A';
		background: #C0C0C0;
	}
	section.portal-component .widget.upload form {
		display: flex;
		flex-flow: row nowrap;
		justify-content: space-between;
		align-items: center;
		gap: 0;
		margin: 0;
		border-radius: 24px;
		padding: 8px;
		background: #FFF;
		box-shadow: inset 0px 2px 4px rgba(0,0,0,0.5);
	}
	section.portal-component .widget.upload form input[type="file"] {
		margin: 0;
		cursor: pointer;
	}
	section.portal-component .widget.upload form ::file-selector-button {
		appearance: none;
		border: none;
		border-radius: 16px;
		padding: 0 16px;
		height: 32px;
		line-height: 32px;
		font-size: 16px;
		font-weight: 700;
		background: #800;
		color: #FFF;
		cursor: pointer;
	}
	section.portal-component .widget.upload form button[type="submit"] {
		appearance: none;
		margin: 0;
		border: none;
		border-radius: 16px;
		padding: 0 16px;
		height: 32px;
		line-height: 32px;
		font-size: 16px;
		font-weight: 700;
		background: #800;
		color: #FFF;
	}
	section.portal-component .widget.download {
		display: flex;
		flex-flow: row nowrap;
		justify-content: space-between;
		align-items: center;
		gap: 0;
		margin: 8px 0 0 0;
		border-radius: 24px;
		padding: 8px;
		background: #FFF;
		box-shadow: inset 0px 2px 4px rgba(0,0,0,0.5);
	}
	section.portal-component .widget.download a {
		margin: 0;
		border-radius: 16px;
		padding: 0 16px;
		height: 32px;
		line-height: 32px;
		font-size: 16px;
		font-weight: 700;
		background: #C0C0C0;
		color: #FFF;
	}
	section.portal-component .widget.download a:link {
		background: #435A42;
	}

}
@media (min-width: 640px) {

	/* Generic */

	section.portal-component .interior {
		padding: 32px;
	}

}
@media (min-width: 1024px) {

	/* Generic */

	section.portal-component .interior {
		padding: 64px;
	}

}