
:root {
	--white1: #fafaff;
	--white2: #b3b5c6;
	--gray1: #2a2b2f;
	--gray2: #35363b;
	--gray3: #3a3b41;
	--gray4: #45464e;
	--gray5: #4d4e56;
	--gray6: #575861;
	--gray7: #5d5e67;
	--gray8: #696a75;
	--orange1: #fd6a00;
	--orange2: #ff853e;
	--blue1: #3a9fde;
	--blue2: #66befe;
	--blue3: #89caff;
	--error1: #860000;
	--error2: #ff9796;
	--error3: #dd2c2c;
	--error-link: #01318C;
	--green1: #94E749;
	--info-fg: var(--gray1);
	--info-bg: #b3ddff;
	--info-link: var(--error-link);
	--fg: var(--white1);
	--bg: var(--gray1);
	--bg-trans: rgba(77, 78, 86, 0.62);
	--bg-accent: var(--gray5);
	--fg-accent: var(--blue3);
	--fg-reduced: var(--white2);
	--border-accent: var(--orange2);
	--link-fg: var(--fg-accent);
	--role-moderator: var(--orange1);
	--role-admin: var(--blue2);
	--button-bg: var(--blue2);
	--button-fg: var(--gray1);
	--button-hover-bg: var(--blue3);
	--button-danger-bg: var(--error3);
	--button-danger-fg: var(--white1);
	--button-danger-hover-bg: var(--error2);
	--toot-focus-bg: var(--gray5);
	--toot-unfocus-bg: var(--gray3);
	--toot-hover-bg: var(--gray4);
	--toot-info-bg: var(--gray4);
	--no-img-desc-bg: var(--orange1);
	--no-img-desc-fg: var(--gray1);
	--bg-sensitive: var(--gray1);
	--boxshadow: 0 0.4rem 1rem -0.1rem rgba(0,0,0,0.15);
	--boxshadow-border: 0.08rem solid var(--gray1);
	--avatar-border: var(--orange2);
	--input-bg: var(--gray4);
	--input-disabled-bg: var(--gray2);
	--input-border: var(--blue1);
	--input-error-border: var(--error3);
	--input-focus-border: var(--blue3);
	--settings-nav-bg: var(--bg-accent);
	--settings-nav-header-fg: var(--gray1);
	--settings-nav-header-bg: var(--orange1);
	--settings-nav-bg-hover: var(--gray3);
	--settings-nav-bg-active: var(--gray2);
	--error-fg: var(--error1);
	--error-bg: var(--error2);
	--list-entry-bg: var(--gray2);
	--list-entry-alternate-bg: var(--gray3);
	--list-entry-hover-bg: var(--gray4);
	--br: 0.2rem;
}

/*
	GoToSocial
	Copyright (C) 2021-2023 GoToSocial Authors admin@gotosocial.org

	This program is free software: you can redistribute it and/or modify
	it under the terms of the GNU Affero General Public License as published by
	the Free Software Foundation, either version 3 of the License, or
	(at your option) any later version.

	This program is distributed in the hope that it will be useful,
	but WITHOUT ANY WARRANTY; without even the implied warranty of
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
	GNU Affero General Public License for more details.

	You should have received a copy of the GNU Affero General Public License
	along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/

/*
   This stylesheets defines (color) variables to be used by other stylesheets on the page
   postcss-custom-prop-vars will transpile these to css --variables
*/

/* Color definitions */

/* Foreground */

/* default text color, contrast >= 5.0 with all $grays */

/* less important text, can be used with $gray1 (6.8), $gray2 (5.5), $gray3 (4.9), $gray4 (4.5) */

/* Background shades, contrast >= 5.0 with $white1 (#fafaff) */

/* Used for non-text accent colors, can be used as background: $gray1 for text color (contrast 4.6)*/

/* hover/selected accent to $orange1, can be used with $gray1 (5.7), $gray2 (4.6) */

/* darker blue for smaller elements (borders), can only be used with $gray1 (4.7) */

/* all-round accent color, can be used with $gray1 (6.8), $gray2 (5.5), $gray3 (4.9), $gray4 (4.5) */

/* hover/selected accent to $blue2, can be used with $gray1 (7.9), $gray2 (6.3), $gray3 (5.6), $gray4 (5.2), $gray5 (4.7) */

/* Error border/foreground text, can be used with $error2 (5.0), $white1 (10), $white2 (5.1) */

/* Error background text, can be used with $error1 (5.0), $gray1 (6.6), $gray2 (5.3), $gray3 (4.8) */

/* Error button background text, can be used with $white1 (4.51) */

/* Error link text, can be used with $error2 (5.56) */

/* Green for positive/confirmation, similar contrast (luminance) as $blue2 */

/* Color variables as used in a specific location */

/* $settings-nav-fg-hover: $gray1; */

/* $settings-nav-fg-active: $orange2; */

/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */

/*
Document
========
*/

/**
Use a better box model (opinionated).
*/

*,
::before,
::after {
	box-sizing: border-box;
}

/**
Use a more readable tab size (opinionated).
*/

html {
	-moz-tab-size: 4;
	-o-tab-size: 4;
	   tab-size: 4;
}

/**
1. Correct the line height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
*/

html {
	line-height: 1.15; /* 1 */
	-webkit-text-size-adjust: 100%; /* 2 */
}

/*
Sections
========
*/

/**
Remove the margin in all browsers.
*/

body {
	margin: 0;
}

/**
Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
*/

body {
	font-family:
		system-ui,
		-apple-system, /* Firefox supports this but not yet `system-ui` */
		'Segoe UI',
		Roboto,
		Helvetica,
		Arial,
		sans-serif,
		'Apple Color Emoji',
		'Segoe UI Emoji';
}

/*
Grouping content
================
*/

/**
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
*/

hr {
	height: 0; /* 1 */
	color: inherit; /* 2 */
}

/*
Text-level semantics
====================
*/

/**
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr[title] {
	-webkit-text-decoration: underline dotted;
	        text-decoration: underline dotted;
}

/**
Add the correct font weight in Edge and Safari.
*/

b,
strong {
	font-weight: bolder;
}

/**
1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
2. Correct the odd 'em' font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
	font-family:
		ui-monospace,
		SFMono-Regular,
		Consolas,
		'Liberation Mono',
		Menlo,
		monospace; /* 1 */
	font-size: 1em; /* 2 */
}

/**
Add the correct font size in all browsers.
*/

small {
	font-size: 80%;
}

/**
Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
*/

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/*
Tabular data
============
*/

/**
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
*/

table {
	text-indent: 0; /* 1 */
	border-color: inherit; /* 2 */
}

/*
Forms
=====
*/

/**
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
*/

button,
input,
optgroup,
select,
textarea {
	font-family: inherit; /* 1 */
	font-size: 100%; /* 1 */
	line-height: 1.15; /* 1 */
	margin: 0; /* 2 */
}

/**
Remove the inheritance of text transform in Edge and Firefox.
1. Remove the inheritance of text transform in Firefox.
*/

button,
select { /* 1 */
	text-transform: none;
}

/**
Correct the inability to style clickable types in iOS and Safari.
*/

button,
[type='button'],
[type='reset'],
[type='submit'] {
	-webkit-appearance: button;
}

/**
Remove the inner border and padding in Firefox.
*/

::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
Restore the focus styles unset by the previous rule.
*/

:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
Remove the additional ':invalid' styles in Firefox.
See: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737
*/

:-moz-ui-invalid {
	box-shadow: none;
}

/**
Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
*/

legend {
	padding: 0;
}

/**
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
	vertical-align: baseline;
}

/**
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
	height: auto;
}

/**
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
	-webkit-appearance: textfield; /* 1 */
	outline-offset: -2px; /* 2 */
}

/**
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to 'inherit' in Safari.
*/

::-webkit-file-upload-button {
	-webkit-appearance: button; /* 1 */
	font: inherit; /* 2 */
}

/*
Interactive
===========
*/

/*
Add the correct display in Chrome and Safari.
*/

summary {
	display: list-item;
}

html, body {
	background: var(--bg);
	color: var(--fg);
	font-family: "Noto Sans", sans-serif;
	font-size: 1em;
	line-height: 1.3em;
}

/* Element Styling (TODO: move to separate file) */

section {
	background: var(--bg-accent);
	padding: 1rem;
	margin: 0.5rem;
	border-radius: var(--br);
	box-shadow: var(--boxshadow);
	border: var(--boxshadow-border);
}

.button, button {
	cursor: pointer;
	font-weight: bold;
	border: none;
	border-radius: var(--br);
	padding: 0.5rem;
	color: var(--button-fg);
	background: var(--button-bg);
}

.button:hover, .button:focus, button:hover, button:focus {
		background: var(--button-hover-bg);
	}

input {
	flex: 1 1 auto;
	border: 0.15rem solid var(--input-border);
	border-radius: var(--br);
	background: var(--input-bg);
	color: var(--fg);
	padding: 0.3rem;
}

input:focus {
		border-color: var(--input-focus-border);
	}

input:disabled {
		background: var(--input-disabled-bg);
	}

a {
	color: var(--link-fg);
}

a:hover {
		color: var(--link-hover-fg);
	}

.cutoff {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}

.clickable {
	cursor: pointer;
}

.emoji {
	height: 1.45rem;
	width: 1.45rem;
	margin: 0 0.15rem;
	-o-object-fit: contain;
	   object-fit: contain;
	vertical-align: middle;
}

.emoji.hover:hover {
		transform: scale(2);
		background-color: var(--bg);
		box-shadow: var(--boxshadow);
		border: var(--boxshadow-border);
		border-radius: var(--br);
	}

.color0 {
	color: #cc6666;
}

.color1 {
	color: #b5bd68;
}

.color2 {
	color: #f0c674;
}

.color3 {
	color: #81a2be;
}

.color4 {
	color: #b294bb;
}

.color5 {
	color: #8abeb7;
}

.color6 {
	color: #c5c8c6;
}

.border-color0 {
	border-color: #cc6666;
}

.border-color1 {
	border-color: #b5bd68;
}

.border-color2 {
	border-color: #f0c674;
}

.border-color3 {
	border-color: #81a2be;
}

.border-color4 {
	border-color: #b294bb;
}

.border-color5 {
	border-color: #8abeb7;
}

.border-color6 {
	border-color: #c5c8c6;
}

.toot {
	background: var(--toot-unfocus-bg);
	margin-top: 0.5rem;
	padding-top: 0.5rem;
}

.toot.active {
		background: var(--toot-focus-bg);
	}

.toot.active .interact {
			background: var(--toot-focus-info-bg);
		}

.toot.active .name .timestamp {
			color: var(--toot-focus-reduced);
		}

.toot:hover {
		background: var(--toot-hover-bg);
	}

.toot:hover .interact {
			background: var(--toot-hover-info-bg);
		}

.toot > * {
		padding-left: 1rem;
		padding-right: 1rem;
	}

.toot .boosted-by {
		color: var(--fg-reduced);
	}

.toot .main {
		padding-top: 0.5rem;
		display: grid;
		grid-template-rows: auto auto;
		grid-template-columns: 3rem 1fr;
		padding-bottom: 0.5rem;
		gap: 0 0.5rem;
	}

.toot .body {
		width: 100%;
		max-width: 100%;
	}

.toot .body .error {
			overflow: auto;
		}

.toot .avatar {
		grid-row: 1 / span 2;
		border: 0.15rem solid var(--border-accent);
		border-radius: var(--br);
		align-self: start;
		width: 3rem;
		height: 3rem;
	}

.toot .avatar img {
			border-radius: var(--br);
			height: 100%;
			width: 100%;
			-o-object-fit: contain;
			   object-fit: contain;
		}

.toot .top-line {
		margin: 0;
		overflow: hidden;
		display: grid;
		grid-template-columns: 1fr auto;
		max-width: 100%;
		gap: 0.4rem;
	}

.toot .top-line .name {
			color: inherit;
			text-decoration: none;
			display: grid;
			grid-template-columns: auto 1fr;
			gap: 0.4rem;
		}

.toot .top-line .name h3 {
				flex: 1 1 auto;
				max-width: 100%;
			}

.toot .top-line * {
			font-size: 1rem;
			line-height: 1.3rem;
		}

.toot .top-line h3 {
			margin: 0;
		}

.toot .top-line h3 .emoji {
				margin-top: -0.2rem;
				height: 1.3rem;
				width: 1.3rem;
			}

.toot .top-line h3 .emoji:first-child {
					margin-left: 0;
				}

.toot .top-line h3 .emoji:last-child {
					margin-right: 0;
				}

.toot .top-line .username {
			color: var(--fg-accent);
		}

.toot .top-line .timestamp {
			align-self: start;
			text-align: right;
			color: var(--fg-reduced);
		}

.toot .content-warning {
		display: flex;
		gap: 0.5rem;
		flex-wrap: wrap;
		align-items: center;
	}

.toot .content-warning button, .toot .content-warning .button {
			padding: 0.2rem 0.4rem;
			font-size: 0.9rem;
			font-weight: normal;
		}

.toot .content {
		margin-top: 0.2rem;
		word-wrap: anywhere;
	}

.toot .content p:first-child {
			margin-top: 0;
		}

.toot .content p:last-child {
			margin-bottom: 0;
		}

.toot .media {
		padding: 0.4rem 0;
		display: grid;
		grid-auto-rows: 10rem;
		grid-template-columns: 50% 50%;
		overflow: hidden;
		gap: 0.3rem;
	}

.toot .media .media-wrapper {
			position: relative;
		}

.toot .media .media-wrapper a {
				position: relative;
				z-index: 1;
			}

.toot .media.single .media-wrapper {
			grid-column: span 2;
		}

.toot .media.odd .media-wrapper:first-child, .toot .media.double .media-wrapper {
			grid-row: span 2;
		}

.toot .media .open, .toot .media .open .button {
			display: none;
		}

.toot .media .closed {
			z-index: 2;
		}

/* Media is shown */

.toot .media input.sensitive-checkbox:checked ~ .video-play {
				display: flex;
			}

.toot .media input.sensitive-checkbox:checked ~ .sensitive .closed {
					transition: 0.8s;
					pointer-events: none;
					opacity: 0;
				}

.toot .media input.sensitive-checkbox:checked ~ .sensitive .closed > * {
						display: none;
					}

.toot .media input.sensitive-checkbox:checked ~ .sensitive .open {
					display: flex;
					justify-content: flex-start;
				}

.toot .media input.sensitive-checkbox:checked ~ .sensitive .open .button {
						align-self: flex-start;
						display: initial;
						z-index: 4;
					}

.toot .media .video-play .icon-span {
				align-self: center;
				display: initial;
				z-index: 4;
			}

.toot .media .video-play .icon-span .icon {
					color: var(--white1);
				}

.toot .media .video-play .icon-span .icon-bg {
					color: var(--gray1);
					font-size: 1.1em;
				}

.toot .media .video-play {

			display: flex;
			position: absolute;
			height: 100%;
			width: 100%;
			justify-content: center;
			align-items: center;
			font-size: 7em;
			pointer-events: none;
}

.toot .media .sensitive {
			position: absolute;
			height: 100%;
			width: 100%;
		}

.toot .media .sensitive .open, .toot .media .sensitive .closed {
				display: flex;
				position: absolute;
				height: 100%;
				width: 100%;
				justify-content: center;
				padding: 1rem;
			}

.toot .media .sensitive .open label, .toot .media .sensitive .closed label {
					z-index: 3;
				}

.toot .media .sensitive .closed {
				transition: 0.3s;
				background: var(--bg-sensitive);
			}

@supports ((-webkit-backdrop-filter: blur(2rem)) or (backdrop-filter: blur(2rem))) {

.toot .media .sensitive .closed {
					background: transparent;
					-webkit-backdrop-filter: blur(2rem);
					        backdrop-filter: blur(2rem)
			}
				}

.toot .media .sensitive .closed .button {
					align-self: center;
					justify-self: center;
				}

.toot .media .no-image-desc {
			color: var(--no-img-desc-fg);
			background: var(--no-img-desc-bg);
			display: flex;
			position: absolute;
			bottom: 0.1rem;
			right: 0.4rem;
			margin-bottom: 0.4rem;
			margin-right: 0.4rem;
			padding: 0.1rem 0.45rem;
			border-radius: 100%;
			border: 0.2rem solid var(--button-fg);
			z-index: 3;
		}

.toot .media .no-image-desc i.fa {
				display: block;
				line-height: 1.6rem;
			}

.toot .media .no-image-desc span {
				margin-left: 0.3rem;
				display: none;
			}

.toot .media .no-image-desc:hover span {
					display: block;
				}

.toot .media .no-image-desc:hover {
				border-radius: 0.2rem;
}

.toot .media img {
			width: 100%;
			height: 100%;
			-o-object-fit: cover;
			   object-fit: cover;
		}

.toot .media img, .toot .media video {
			-o-object-fit: cover;
			   object-fit: cover;
			-o-object-position: center;
			   object-position: center;
			height: 100%;
			width: 100%;
		}

.toot .interact {
		color: var(--fg-reduced);
		background: var(--toot-unfocus-info-bg);
		display: grid;
		padding: 0.5rem 1rem;
		grid-template-columns: 1fr auto auto;
		gap: 0.5rem;
		width: 100%;
	}

.toot .interact .view-source {
			justify-self: end;
		}

.toot .interact .source {
			border: 0.2rem solid var(--gray1);
			margin-top: 0.5rem;
			padding: 0.5rem;
			grid-row: 2;
			grid-column: 1 / span 2;
			max-width: 100%;
			overflow-x: auto;
		}

.profile {
	background: var(--bg-accent);
	display: grid;
	grid-template-rows: auto auto auto;
	grid-template-columns: 100%;
	gap: 0.5rem;
	margin-bottom: 0.2rem;
	overflow-x: hidden;
	position: relative;

	border-radius: var(--br);
	box-shadow: var(--boxshadow);
	border: var(--boxshadow-border);
}

.profile .headerimage {
		width: 100%;
		aspect-ratio: 3 / 1;
		max-height: 30ch;
		overflow: hidden;
		box-shadow: var(--boxshadow);
	}

.profile .headerimage img {
			width: 100%;
			height: 100%;
			-o-object-fit: cover;
			   object-fit: cover;
			border-radius: var(--br-inner) var(--br-inner) 0 0;
		}

.profile .basic {
		height: 8.5rem;
		margin-top: -6.5rem;

		display: grid;
		grid-template-columns: 1rem 8.5rem 1fr;
		grid-template-rows: 3rem 3rem 2.5rem;

		grid-template-areas:
			".       avatar ."
			"filler2 avatar displayname"
			".       avatar username";
	}

.profile .basic #profile-basic-filler2 {
			grid-area: filler2;
			background: var(--bg-trans);
		}

.profile .basic .avatar {
			align-self: end;
			box-sizing: border-box;
			height: 8.5rem;
			width: 8.5rem;
			grid-area: avatar;
			background: var(--bg);
			border: 0.2rem solid var(--avatar-border);
			padding: 0;
			border-radius: var(--br);
			position: relative;

			box-shadow: var(--boxshadow);
		}

.profile .basic .avatar img {
				-o-object-fit: cover;
				   object-fit: cover;
				border-radius: var(--br-inner);
				width: 100%;
				height: 100%;
			}

.profile .basic a, .profile .basic div {
			color: inherit;
			text-decoration: none;
		}

.profile .basic .displayname {
			grid-area: displayname;
			font-weight: bold;
			font-size: 2rem;
			line-height: 3rem;
			background: var(--bg-trans);
			word-break: break-all;
			white-space: nowrap;
			text-overflow: ellipsis;
			overflow: hidden;
			max-height: 6rem;
			padding: 0 0.5rem;
		}

.profile .basic .usernamecontainer {
			height: 2.5rem;
			display: grid;
			grid-template-columns: auto 1fr;
			grid-area: username;
			/* justify-content: space-between; */
			padding: 0;
			gap: 0.5rem;
			position: relative;
			
			color: var(--fg-accent);
			font-weight: bold;
		}

.profile .basic .usernamecontainer .username {
				white-space: nowrap;
				text-overflow: ellipsis;
				overflow: hidden;
				-webkit-user-select: all;
				   -moz-user-select: all;
				        user-select: all;

				line-height: 2.5rem;
				padding-left: 0;
				margin-left: 0.5rem;
			}

.profile .basic .usernamecontainer .role {
				justify-self: start;
				align-self: center;
				line-height: 1.1rem;
				font-size: 0.9rem;
				margin-right: 0.2rem;
				padding: 0.2rem;
				margin-top: 0.1rem;
				padding-top: 0.1rem;
				border: 0.1rem solid var(--gray1);
				border-radius: var(--br);
				font-variant: small-caps;
			}

.profile .basic .usernamecontainer .role.admin {
				background: var(--gray1);
				color: var(--orange2);
				border-color: var(--orange2);
			}

.profile .basic .usernamecontainer .role.moderator {
				background: var(--gray1);
				color: var(--blue2);
				border-color: var(--blue1);
			}

.profile .detailed {
		display: flex;
		flex-direction: column;
		flex: 1 1 25em;
	}

.profile .detailed h2 {
			margin-top: 0;
		}

.profile .detailed .bio {
			margin-top: 0;
			margin-bottom: 0.5rem;
			margin-left: 1rem;
			margin-right: 1rem;
			word-break: break-word;
		}

.profile .detailed .bio a {
				color: var(--acc1);
				text-decoration: underline;
			}

.profile .accountstats {
		display: flex;
		flex-wrap: wrap;
		border-radius: 0 0 var(--br) var(--br);
		border-top: 0.1rem solid var(--bg);
		margin-bottom: 1rem;
	}

.profile .accountstats .entry-group {
			flex: 1 1 auto;
			min-width: 50%;
			display: flex;
		}

.profile .accountstats .entry {
			white-space: nowrap;
			width: 50%;
			margin: 1rem;
			margin-bottom: 0;
			text-align: center;
		}

@media screen and (max-width: 600px) {
		.profile {
			gap: 0.1rem;
		}

		.profile .basic {
			margin-top: calc(-22vw + 1rem);
			height: initial;
			display: flex;
			flex-direction: column;
		}

			.profile .basic #profile-basic-filler2 {
				display: none;
			}

			.profile .basic .avatar {
				align-self: flex-start;
				margin-left: 1rem;
				height: 22vw;
				width: 22vw;
			}

			.profile .basic .displayname {
				padding-left: 1rem;
				font-size: 1.5rem;
				line-height: 2rem;
				margin-top: 0.5rem;
				align-self: stretch;
			}

			.profile .basic .usernamecontainer {
				padding-left: 1rem;
			}

				.profile .basic .usernamecontainer .username {
					margin-left: 0;
				}
	}

/*!
Fork Awesome 1.2.0
License - https://forkaweso.me/Fork-Awesome/license

Copyright 2018 Dave Gandy & Fork Awesome

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 */

@font-face{font-family:ForkAwesome;src:url(../fonts/forkawesome-webfont.eot?v=1.2.0);src:url(../fonts/forkawesome-webfont.eot?#iefix&v=1.2.0) format('embedded-opentype'),url(../fonts/forkawesome-webfont.woff2?v=1.2.0) format('woff2'),url(../fonts/forkawesome-webfont.woff?v=1.2.0) format('woff'),url(../fonts/forkawesome-webfont.ttf?v=1.2.0) format('truetype'),url(../fonts/forkawesome-webfont.svg?v=1.2.0#forkawesomeregular) format('svg');font-weight:400;font-style:normal;font-display:block}

.fa{display:inline-block;font:normal normal normal 14px/1 ForkAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}

.fa-2x{font-size:2em}

.fa-3x{font-size:3em}

.fa-4x{font-size:4em}

.fa-5x{font-size:5em}

.fa-fw{width:1.28571429em;text-align:center}

.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}

.fa-ul>li{position:relative}

.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}

.fa-li.fa-lg{left:-1.85714286em}

.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}

.fa-pull-left{float:left}

.fa-pull-right{float:right}

.fa.fa-pull-left{margin-right:.3em}

.fa.fa-pull-right{margin-left:.3em}

.pull-right{float:right}

.pull-left{float:left}

.fa.pull-left{margin-right:.3em}

.fa.pull-right{margin-left:.3em}

.fa-spin{animation:fa-spin 2s infinite linear}

.fa-pulse{animation:fa-spin 1s infinite steps(8)}

@keyframes fa-spin{0%{transform:rotate(0)}100%{transform:rotate(359deg)}}

.fa-rotate-90{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";transform:rotate(90deg)}

.fa-rotate-180{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";transform:rotate(180deg)}

.fa-rotate-270{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";transform:rotate(270deg)}

.fa-flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";transform:scale(-1,1)}

.fa-flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";transform:scale(1,-1)}

:root .fa-flip-horizontal,:root .fa-flip-vertical,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-rotate-90{filter:none}

.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}

.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}

.fa-stack-1x{line-height:inherit}

.fa-stack-2x{font-size:2em}

.fa-inverse{color:#fff}

.fa-glass:before{content:"\f000"}

.fa-music:before{content:"\f001"}

.fa-search:before{content:"\f002"}

.fa-envelope-o:before{content:"\f003"}

.fa-heart:before{content:"\f004"}

.fa-star:before{content:"\f005"}

.fa-star-o:before{content:"\f006"}

.fa-user:before{content:"\f007"}

.fa-film:before{content:"\f008"}

.fa-th-large:before{content:"\f009"}

.fa-th:before{content:"\f00a"}

.fa-th-list:before{content:"\f00b"}

.fa-check:before{content:"\f00c"}

.fa-close:before,.fa-remove:before,.fa-times:before{content:"\f00d"}

.fa-search-plus:before{content:"\f00e"}

.fa-search-minus:before{content:"\f010"}

.fa-power-off:before{content:"\f011"}

.fa-signal:before{content:"\f012"}

.fa-cog:before,.fa-gear:before{content:"\f013"}

.fa-trash-o:before{content:"\f014"}

.fa-home:before{content:"\f015"}

.fa-file-o:before{content:"\f016"}

.fa-clock-o:before{content:"\f017"}

.fa-road:before{content:"\f018"}

.fa-download:before{content:"\f019"}

.fa-arrow-circle-o-down:before{content:"\f01a"}

.fa-arrow-circle-o-up:before{content:"\f01b"}

.fa-inbox:before{content:"\f01c"}

.fa-play-circle-o:before{content:"\f01d"}

.fa-repeat:before,.fa-rotate-right:before{content:"\f01e"}

.fa-refresh:before,.fa-sync:before{content:"\f021"}

.fa-list-alt:before{content:"\f022"}

.fa-lock:before{content:"\f023"}

.fa-flag:before{content:"\f024"}

.fa-headphones:before{content:"\f025"}

.fa-volume-off:before{content:"\f026"}

.fa-volume-down:before{content:"\f027"}

.fa-volume-up:before{content:"\f028"}

.fa-qrcode:before{content:"\f029"}

.fa-barcode:before{content:"\f02a"}

.fa-tag:before{content:"\f02b"}

.fa-tags:before{content:"\f02c"}

.fa-book:before{content:"\f02d"}

.fa-bookmark:before{content:"\f02e"}

.fa-print:before{content:"\f02f"}

.fa-camera:before{content:"\f030"}

.fa-font:before{content:"\f031"}

.fa-bold:before{content:"\f032"}

.fa-italic:before{content:"\f033"}

.fa-text-height:before{content:"\f034"}

.fa-text-width:before{content:"\f035"}

.fa-align-left:before{content:"\f036"}

.fa-align-center:before{content:"\f037"}

.fa-align-right:before{content:"\f038"}

.fa-align-justify:before{content:"\f039"}

.fa-list:before{content:"\f03a"}

.fa-dedent:before,.fa-outdent:before{content:"\f03b"}

.fa-indent:before{content:"\f03c"}

.fa-video-camera:before,.fa-video:before{content:"\f03d"}

.fa-image:before,.fa-photo:before,.fa-picture-o:before{content:"\f03e"}

.fa-pencil:before{content:"\f040"}

.fa-map-marker:before{content:"\f041"}

.fa-adjust:before{content:"\f042"}

.fa-tint:before{content:"\f043"}

.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}

.fa-share-square-o:before{content:"\f045"}

.fa-check-square-o:before{content:"\f046"}

.fa-arrows:before{content:"\f047"}

.fa-step-backward:before{content:"\f048"}

.fa-fast-backward:before{content:"\f049"}

.fa-backward:before{content:"\f04a"}

.fa-play:before{content:"\f04b"}

.fa-pause:before{content:"\f04c"}

.fa-stop:before{content:"\f04d"}

.fa-forward:before{content:"\f04e"}

.fa-fast-forward:before{content:"\f050"}

.fa-step-forward:before{content:"\f051"}

.fa-eject:before{content:"\f052"}

.fa-chevron-left:before{content:"\f053"}

.fa-chevron-right:before{content:"\f054"}

.fa-plus-circle:before{content:"\f055"}

.fa-minus-circle:before{content:"\f056"}

.fa-times-circle:before{content:"\f057"}

.fa-check-circle:before{content:"\f058"}

.fa-question-circle:before{content:"\f059"}

.fa-info-circle:before{content:"\f05a"}

.fa-crosshairs:before{content:"\f05b"}

.fa-times-circle-o:before{content:"\f05c"}

.fa-check-circle-o:before{content:"\f05d"}

.fa-ban:before{content:"\f05e"}

.fa-arrow-left:before{content:"\f060"}

.fa-arrow-right:before{content:"\f061"}

.fa-arrow-up:before{content:"\f062"}

.fa-arrow-down:before{content:"\f063"}

.fa-mail-forward:before,.fa-share:before{content:"\f064"}

.fa-expand:before{content:"\f065"}

.fa-compress:before{content:"\f066"}

.fa-plus:before{content:"\f067"}

.fa-minus:before{content:"\f068"}

.fa-asterisk:before{content:"\f069"}

.fa-exclamation-circle:before{content:"\f06a"}

.fa-gift:before{content:"\f06b"}

.fa-leaf:before{content:"\f06c"}

.fa-fire:before{content:"\f06d"}

.fa-eye:before{content:"\f06e"}

.fa-eye-slash:before{content:"\f070"}

.fa-exclamation-triangle:before,.fa-warning:before{content:"\f071"}

.fa-plane:before{content:"\f072"}

.fa-calendar:before{content:"\f073"}

.fa-random:before{content:"\f074"}

.fa-comment:before{content:"\f075"}

.fa-magnet:before{content:"\f076"}

.fa-chevron-up:before{content:"\f077"}

.fa-chevron-down:before{content:"\f078"}

.fa-retweet:before{content:"\f079"}

.fa-shopping-cart:before{content:"\f07a"}

.fa-folder:before{content:"\f07b"}

.fa-folder-open:before{content:"\f07c"}

.fa-arrows-v:before{content:"\f07d"}

.fa-arrows-h:before{content:"\f07e"}

.fa-bar-chart-o:before,.fa-bar-chart:before{content:"\f080"}

.fa-twitter-square:before{content:"\f081"}

.fa-facebook-square:before{content:"\f082"}

.fa-camera-retro:before{content:"\f083"}

.fa-key:before{content:"\f084"}

.fa-cogs:before,.fa-gears:before{content:"\f085"}

.fa-comments:before{content:"\f086"}

.fa-thumbs-o-up:before{content:"\f087"}

.fa-thumbs-o-down:before{content:"\f088"}

.fa-star-half:before{content:"\f089"}

.fa-heart-o:before{content:"\f08a"}

.fa-sign-out:before{content:"\f08b"}

.fa-linkedin-square:before{content:"\f08c"}

.fa-thumb-tack:before{content:"\f08d"}

.fa-external-link:before{content:"\f08e"}

.fa-sign-in:before{content:"\f090"}

.fa-trophy:before{content:"\f091"}

.fa-github-square:before{content:"\f092"}

.fa-upload:before{content:"\f093"}

.fa-lemon-o:before{content:"\f094"}

.fa-phone:before{content:"\f095"}

.fa-square-o:before{content:"\f096"}

.fa-bookmark-o:before{content:"\f097"}

.fa-phone-square:before{content:"\f098"}

.fa-twitter:before{content:"\f099"}

.fa-facebook-f:before,.fa-facebook:before{content:"\f09a"}

.fa-github:before{content:"\f09b"}

.fa-unlock:before{content:"\f09c"}

.fa-credit-card:before{content:"\f09d"}

.fa-feed:before,.fa-rss:before{content:"\f09e"}

.fa-hdd-o:before{content:"\f0a0"}

.fa-bullhorn:before{content:"\f0a1"}

.fa-bell-o:before{content:"\f0f3"}

.fa-certificate:before{content:"\f0a3"}

.fa-hand-o-right:before{content:"\f0a4"}

.fa-hand-o-left:before{content:"\f0a5"}

.fa-hand-o-up:before{content:"\f0a6"}

.fa-hand-o-down:before{content:"\f0a7"}

.fa-arrow-circle-left:before{content:"\f0a8"}

.fa-arrow-circle-right:before{content:"\f0a9"}

.fa-arrow-circle-up:before{content:"\f0aa"}

.fa-arrow-circle-down:before{content:"\f0ab"}

.fa-globe:before{content:"\f0ac"}

.fa-globe-e:before{content:"\f304"}

.fa-globe-w:before{content:"\f305"}

.fa-wrench:before{content:"\f0ad"}

.fa-tasks:before{content:"\f0ae"}

.fa-filter:before{content:"\f0b0"}

.fa-briefcase:before{content:"\f0b1"}

.fa-arrows-alt:before{content:"\f0b2"}

.fa-community:before,.fa-group:before,.fa-users:before{content:"\f0c0"}

.fa-chain:before,.fa-link:before{content:"\f0c1"}

.fa-cloud:before{content:"\f0c2"}

.fa-flask:before{content:"\f0c3"}

.fa-cut:before,.fa-scissors:before{content:"\f0c4"}

.fa-copy:before,.fa-files-o:before{content:"\f0c5"}

.fa-paperclip:before{content:"\f0c6"}

.fa-floppy-o:before,.fa-save:before{content:"\f0c7"}

.fa-square:before{content:"\f0c8"}

.fa-bars:before,.fa-navicon:before,.fa-reorder:before{content:"\f0c9"}

.fa-list-ul:before{content:"\f0ca"}

.fa-list-ol:before{content:"\f0cb"}

.fa-strikethrough:before{content:"\f0cc"}

.fa-underline:before{content:"\f0cd"}

.fa-table:before{content:"\f0ce"}

.fa-magic:before{content:"\f0d0"}

.fa-truck:before{content:"\f0d1"}

.fa-pinterest:before{content:"\f0d2"}

.fa-pinterest-square:before{content:"\f0d3"}

.fa-google-plus-square:before{content:"\f0d4"}

.fa-google-plus-g:before,.fa-google-plus:before{content:"\f0d5"}

.fa-money:before{content:"\f0d6"}

.fa-caret-down:before{content:"\f0d7"}

.fa-caret-up:before{content:"\f0d8"}

.fa-caret-left:before{content:"\f0d9"}

.fa-caret-right:before{content:"\f0da"}

.fa-columns:before{content:"\f0db"}

.fa-sort:before,.fa-unsorted:before{content:"\f0dc"}

.fa-sort-desc:before,.fa-sort-down:before{content:"\f0dd"}

.fa-sort-asc:before,.fa-sort-up:before{content:"\f0de"}

.fa-envelope:before{content:"\f0e0"}

.fa-linkedin:before{content:"\f0e1"}

.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}

.fa-gavel:before,.fa-legal:before{content:"\f0e3"}

.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}

.fa-comment-o:before{content:"\f0e5"}

.fa-comments-o:before{content:"\f0e6"}

.fa-bolt:before,.fa-flash:before{content:"\f0e7"}

.fa-sitemap:before{content:"\f0e8"}

.fa-umbrella:before{content:"\f0e9"}

.fa-clipboard:before,.fa-paste:before{content:"\f0ea"}

.fa-lightbulb-o:before{content:"\f0eb"}

.fa-exchange:before{content:"\f0ec"}

.fa-cloud-download:before{content:"\f0ed"}

.fa-cloud-upload:before{content:"\f0ee"}

.fa-user-md:before{content:"\f0f0"}

.fa-stethoscope:before{content:"\f0f1"}

.fa-suitcase:before{content:"\f0f2"}

.fa-bell:before{content:"\f0a2"}

.fa-coffee:before{content:"\f0f4"}

.fa-cutlery:before,.fa-utensils:before{content:"\f0f5"}

.fa-file-text-o:before{content:"\f0f6"}

.fa-building-o:before{content:"\f0f7"}

.fa-hospital-o:before{content:"\f0f8"}

.fa-ambulance:before{content:"\f0f9"}

.fa-medkit:before{content:"\f0fa"}

.fa-fighter-jet:before{content:"\f0fb"}

.fa-beer:before{content:"\f0fc"}

.fa-h-square:before{content:"\f0fd"}

.fa-plus-square:before{content:"\f0fe"}

.fa-angle-double-left:before{content:"\f100"}

.fa-angle-double-right:before{content:"\f101"}

.fa-angle-double-up:before{content:"\f102"}

.fa-angle-double-down:before{content:"\f103"}

.fa-angle-left:before{content:"\f104"}

.fa-angle-right:before{content:"\f105"}

.fa-angle-up:before{content:"\f106"}

.fa-angle-down:before{content:"\f107"}

.fa-desktop:before{content:"\f108"}

.fa-laptop:before{content:"\f109"}

.fa-tablet:before{content:"\f10a"}

.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}

.fa-circle-o:before{content:"\f10c"}

.fa-quote-left:before{content:"\f10d"}

.fa-quote-right:before{content:"\f10e"}

.fa-spinner:before{content:"\f110"}

.fa-circle:before{content:"\f111"}

.fa-mail-reply:before,.fa-reply:before{content:"\f112"}

.fa-github-alt:before{content:"\f113"}

.fa-folder-o:before{content:"\f114"}

.fa-folder-open-o:before{content:"\f115"}

.fa-smile-o:before{content:"\f118"}

.fa-frown-o:before{content:"\f119"}

.fa-meh-o:before{content:"\f11a"}

.fa-gamepad:before{content:"\f11b"}

.fa-keyboard-o:before{content:"\f11c"}

.fa-flag-o:before{content:"\f11d"}

.fa-flag-checkered:before{content:"\f11e"}

.fa-terminal:before{content:"\f120"}

.fa-code:before{content:"\f121"}

.fa-mail-reply-all:before,.fa-reply-all:before{content:"\f122"}

.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}

.fa-location-arrow:before{content:"\f124"}

.fa-crop:before{content:"\f125"}

.fa-code-fork:before{content:"\f126"}

.fa-chain-broken:before,.fa-unlink:before{content:"\f127"}

.fa-question:before{content:"\f128"}

.fa-info:before{content:"\f129"}

.fa-exclamation:before{content:"\f12a"}

.fa-superscript:before{content:"\f12b"}

.fa-subscript:before{content:"\f12c"}

.fa-eraser:before{content:"\f12d"}

.fa-puzzle-piece:before{content:"\f12e"}

.fa-microphone:before{content:"\f130"}

.fa-microphone-slash:before{content:"\f131"}

.fa-shield:before{content:"\f132"}

.fa-calendar-o:before{content:"\f133"}

.fa-fire-extinguisher:before{content:"\f134"}

.fa-rocket:before{content:"\f135"}

.fa-maxcdn:before{content:"\f136"}

.fa-chevron-circle-left:before{content:"\f137"}

.fa-chevron-circle-right:before{content:"\f138"}

.fa-chevron-circle-up:before{content:"\f139"}

.fa-chevron-circle-down:before{content:"\f13a"}

.fa-html5:before{content:"\f13b"}

.fa-css3:before{content:"\f13c"}

.fa-anchor:before{content:"\f13d"}

.fa-unlock-alt:before{content:"\f13e"}

.fa-bullseye:before{content:"\f140"}

.fa-ellipsis-h:before{content:"\f141"}

.fa-ellipsis-v:before{content:"\f142"}

.fa-rss-square:before{content:"\f143"}

.fa-play-circle:before{content:"\f144"}

.fa-ticket:before{content:"\f145"}

.fa-minus-square:before{content:"\f146"}

.fa-minus-square-o:before{content:"\f147"}

.fa-level-up:before{content:"\f148"}

.fa-level-down:before{content:"\f149"}

.fa-check-square:before{content:"\f14a"}

.fa-pencil-square:before{content:"\f14b"}

.fa-external-link-square:before{content:"\f14c"}

.fa-share-square:before{content:"\f14d"}

.fa-compass:before{content:"\f14e"}

.fa-caret-square-o-down:before,.fa-toggle-down:before{content:"\f150"}

.fa-caret-square-o-up:before,.fa-toggle-up:before{content:"\f151"}

.fa-caret-square-o-right:before,.fa-toggle-right:before{content:"\f152"}

.fa-eur:before,.fa-euro:before{content:"\f153"}

.fa-gbp:before,.fa-pound:before{content:"\f154"}

.fa-dollar:before,.fa-usd:before{content:"\f155"}

.fa-inr:before,.fa-rupee:before{content:"\f156"}

.fa-cny:before,.fa-jpy:before,.fa-rmb:before,.fa-yen:before{content:"\f157"}

.fa-rouble:before,.fa-rub:before,.fa-ruble:before{content:"\f158"}

.fa-krw:before,.fa-won:before{content:"\f159"}

.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}

.fa-file:before{content:"\f15b"}

.fa-file-text:before{content:"\f15c"}

.fa-sort-alpha-asc:before,.fa-sort-alpha-down:before{content:"\f15d"}

.fa-sort-alpha-desc:before,.fa-sort-alpha-up:before{content:"\f15e"}

.fa-sort-amount-asc:before,.fa-sort-amount-down:before{content:"\f160"}

.fa-sort-amount-desc:before,.fa-sort-amount-up:before{content:"\f161"}

.fa-sort-numeric-asc:before,.fa-sort-numeric-down:before{content:"\f162"}

.fa-sort-numeric-desc:before,.fa-sort-numeric-up:before{content:"\f163"}

.fa-thumbs-up:before{content:"\f164"}

.fa-thumbs-down:before{content:"\f165"}

.fa-youtube-square:before{content:"\f166"}

.fa-youtube:before{content:"\f167"}

.fa-xing:before{content:"\f168"}

.fa-xing-square:before{content:"\f169"}

.fa-youtube-play:before{content:"\f16a"}

.fa-dropbox:before{content:"\f16b"}

.fa-stack-overflow:before{content:"\f16c"}

.fa-instagram:before{content:"\f16d"}

.fa-flickr:before{content:"\f16e"}

.fa-adn:before{content:"\f170"}

.fa-bitbucket:before{content:"\f171"}

.fa-bitbucket-square:before{content:"\f172"}

.fa-tumblr:before{content:"\f173"}

.fa-tumblr-square:before{content:"\f174"}

.fa-long-arrow-down:before{content:"\f175"}

.fa-long-arrow-up:before{content:"\f176"}

.fa-long-arrow-left:before{content:"\f177"}

.fa-long-arrow-right:before{content:"\f178"}

.fa-apple:before{content:"\f179"}

.fa-windows:before{content:"\f17a"}

.fa-android:before{content:"\f17b"}

.fa-linux:before{content:"\f17c"}

.fa-dribbble:before{content:"\f17d"}

.fa-skype:before{content:"\f17e"}

.fa-foursquare:before{content:"\f180"}

.fa-trello:before{content:"\f181"}

.fa-female:before{content:"\f182"}

.fa-male:before{content:"\f183"}

.fa-gittip:before,.fa-gratipay:before{content:"\f184"}

.fa-sun-o:before{content:"\f185"}

.fa-moon-o:before{content:"\f186"}

.fa-archive:before{content:"\f187"}

.fa-bug:before{content:"\f188"}

.fa-vk:before{content:"\f189"}

.fa-weibo:before{content:"\f18a"}

.fa-renren:before{content:"\f18b"}

.fa-pagelines:before{content:"\f18c"}

.fa-stack-exchange:before{content:"\f18d"}

.fa-arrow-circle-o-right:before{content:"\f18e"}

.fa-arrow-circle-o-left:before{content:"\f190"}

.fa-caret-square-o-left:before,.fa-toggle-left:before{content:"\f191"}

.fa-dot-circle-o:before{content:"\f192"}

.fa-wheelchair:before{content:"\f193"}

.fa-vimeo-square:before{content:"\f194"}

.fa-try:before,.fa-turkish-lira:before{content:"\f195"}

.fa-plus-square-o:before{content:"\f196"}

.fa-space-shuttle:before{content:"\f197"}

.fa-slack:before{content:"\f198"}

.fa-envelope-square:before{content:"\f199"}

.fa-wordpress:before{content:"\f19a"}

.fa-openid:before{content:"\f19b"}

.fa-bank:before,.fa-institution:before,.fa-university:before{content:"\f19c"}

.fa-graduation-cap:before,.fa-mortar-board:before{content:"\f19d"}

.fa-yahoo:before{content:"\f19e"}

.fa-google:before{content:"\f1a0"}

.fa-reddit:before{content:"\f1a1"}

.fa-reddit-square:before{content:"\f1a2"}

.fa-stumbleupon-circle:before{content:"\f1a3"}

.fa-stumbleupon:before{content:"\f1a4"}

.fa-delicious:before{content:"\f1a5"}

.fa-digg:before{content:"\f1a6"}

.fa-drupal:before{content:"\f1a9"}

.fa-joomla:before{content:"\f1aa"}

.fa-language:before{content:"\f1ab"}

.fa-fax:before{content:"\f1ac"}

.fa-building:before{content:"\f1ad"}

.fa-child:before{content:"\f1ae"}

.fa-paw:before{content:"\f1b0"}

.fa-spoon:before,.fa-utensil-spoon:before{content:"\f1b1"}

.fa-cube:before{content:"\f1b2"}

.fa-cubes:before{content:"\f1b3"}

.fa-behance:before{content:"\f1b4"}

.fa-behance-square:before{content:"\f1b5"}

.fa-steam:before{content:"\f1b6"}

.fa-steam-square:before{content:"\f1b7"}

.fa-recycle:before{content:"\f1b8"}

.fa-automobile:before,.fa-car:before{content:"\f1b9"}

.fa-cab:before,.fa-taxi:before{content:"\f1ba"}

.fa-tree:before{content:"\f1bb"}

.fa-spotify:before{content:"\f1bc"}

.fa-deviantart:before{content:"\f1bd"}

.fa-soundcloud:before{content:"\f1be"}

.fa-database:before{content:"\f1c0"}

.fa-file-pdf-o:before{content:"\f1c1"}

.fa-file-word-o:before{content:"\f1c2"}

.fa-file-excel-o:before{content:"\f1c3"}

.fa-file-powerpoint-o:before{content:"\f1c4"}

.fa-file-image-o:before,.fa-file-photo-o:before,.fa-file-picture-o:before{content:"\f1c5"}

.fa-file-archive-o:before,.fa-file-zip-o:before{content:"\f1c6"}

.fa-file-audio-o:before,.fa-file-sound-o:before{content:"\f1c7"}

.fa-file-movie-o:before,.fa-file-video-o:before{content:"\f1c8"}

.fa-file-code-o:before{content:"\f1c9"}

.fa-vine:before{content:"\f1ca"}

.fa-codepen:before{content:"\f1cb"}

.fa-jsfiddle:before{content:"\f1cc"}

.fa-life-bouy:before,.fa-life-buoy:before,.fa-life-ring:before,.fa-life-saver:before,.fa-support:before{content:"\f1cd"}

.fa-circle-o-notch:before{content:"\f1ce"}

.fa-ra:before,.fa-rebel:before,.fa-resistance:before{content:"\f1d0"}

.fa-empire:before,.fa-ge:before{content:"\f1d1"}

.fa-git-square:before{content:"\f1d2"}

.fa-git:before{content:"\f1d3"}

.fa-hacker-news:before,.fa-y-combinator-square:before,.fa-yc-square:before{content:"\f1d4"}

.fa-tencent-weibo:before{content:"\f1d5"}

.fa-qq:before{content:"\f1d6"}

.fa-wechat:before,.fa-weixin:before{content:"\f1d7"}

.fa-paper-plane:before,.fa-send:before{content:"\f1d8"}

.fa-paper-plane-o:before,.fa-send-o:before{content:"\f1d9"}

.fa-history:before{content:"\f1da"}

.fa-circle-thin:before{content:"\f1db"}

.fa-header:before,.fa-heading:before{content:"\f1dc"}

.fa-paragraph:before{content:"\f1dd"}

.fa-sliders:before{content:"\f1de"}

.fa-share-alt:before{content:"\f1e0"}

.fa-share-alt-square:before{content:"\f1e1"}

.fa-bomb:before{content:"\f1e2"}

.fa-futbol-o:before,.fa-soccer-ball-o:before{content:"\f1e3"}

.fa-tty:before{content:"\f1e4"}

.fa-binoculars:before{content:"\f1e5"}

.fa-plug:before{content:"\f1e6"}

.fa-slideshare:before{content:"\f1e7"}

.fa-twitch:before{content:"\f1e8"}

.fa-yelp:before{content:"\f1e9"}

.fa-newspaper-o:before{content:"\f1ea"}

.fa-wifi:before{content:"\f1eb"}

.fa-calculator:before{content:"\f1ec"}

.fa-paypal:before{content:"\f1ed"}

.fa-google-wallet:before{content:"\f1ee"}

.fa-cc-visa:before{content:"\f1f0"}

.fa-cc-mastercard:before{content:"\f1f1"}

.fa-cc-discover:before{content:"\f1f2"}

.fa-cc-amex:before{content:"\f1f3"}

.fa-cc-paypal:before{content:"\f1f4"}

.fa-cc-stripe:before{content:"\f1f5"}

.fa-bell-slash:before{content:"\f1f6"}

.fa-bell-slash-o:before{content:"\f1f7"}

.fa-trash:before{content:"\f1f8"}

.fa-copyright:before{content:"\f1f9"}

.fa-at:before{content:"\f1fa"}

.fa-eyedropper:before{content:"\f1fb"}

.fa-paint-brush:before{content:"\f1fc"}

.fa-birthday-cake:before{content:"\f1fd"}

.fa-area-chart:before{content:"\f1fe"}

.fa-pie-chart:before{content:"\f200"}

.fa-line-chart:before{content:"\f201"}

.fa-lastfm:before{content:"\f202"}

.fa-lastfm-square:before{content:"\f203"}

.fa-toggle-off:before{content:"\f204"}

.fa-toggle-on:before{content:"\f205"}

.fa-bicycle:before{content:"\f206"}

.fa-bus:before{content:"\f207"}

.fa-ioxhost:before{content:"\f208"}

.fa-angellist:before{content:"\f209"}

.fa-cc:before,.fa-closed-captioning:before{content:"\f20a"}

.fa-ils:before,.fa-shekel:before,.fa-sheqel:before{content:"\f20b"}

.fa-meanpath:before{content:"\f20c"}

.fa-buysellads:before{content:"\f20d"}

.fa-connectdevelop:before{content:"\f20e"}

.fa-dashcube:before{content:"\f210"}

.fa-forumbee:before{content:"\f211"}

.fa-leanpub:before{content:"\f212"}

.fa-sellsy:before{content:"\f213"}

.fa-shirtsinbulk:before{content:"\f214"}

.fa-simplybuilt:before{content:"\f215"}

.fa-skyatlas:before{content:"\f216"}

.fa-cart-plus:before{content:"\f217"}

.fa-cart-arrow-down:before{content:"\f218"}

.fa-diamond:before,.fa-gem:before{content:"\f219"}

.fa-ship:before{content:"\f21a"}

.fa-user-secret:before{content:"\f21b"}

.fa-motorcycle:before{content:"\f21c"}

.fa-street-view:before{content:"\f21d"}

.fa-heartbeat:before{content:"\f21e"}

.fa-venus:before{content:"\f221"}

.fa-mars:before{content:"\f222"}

.fa-mercury:before{content:"\f223"}

.fa-intersex:before,.fa-transgender:before{content:"\f224"}

.fa-transgender-alt:before{content:"\f225"}

.fa-venus-double:before{content:"\f226"}

.fa-mars-double:before{content:"\f227"}

.fa-venus-mars:before{content:"\f228"}

.fa-mars-stroke:before{content:"\f229"}

.fa-mars-stroke-v:before{content:"\f22a"}

.fa-mars-stroke-h:before{content:"\f22b"}

.fa-neuter:before{content:"\f22c"}

.fa-genderless:before{content:"\f22d"}

.fa-facebook-official:before{content:"\f230"}

.fa-pinterest-p:before{content:"\f231"}

.fa-whatsapp:before{content:"\f232"}

.fa-server:before{content:"\f233"}

.fa-user-plus:before{content:"\f234"}

.fa-user-times:before{content:"\f235"}

.fa-bed:before,.fa-hotel:before{content:"\f236"}

.fa-viacoin:before{content:"\f237"}

.fa-train:before{content:"\f238"}

.fa-subway:before{content:"\f239"}

.fa-medium:before{content:"\f23a"}

.fa-medium-square:before{content:"\f2f8"}

.fa-y-combinator:before,.fa-yc:before{content:"\f23b"}

.fa-optin-monster:before{content:"\f23c"}

.fa-opencart:before{content:"\f23d"}

.fa-expeditedssl:before{content:"\f23e"}

.fa-battery-4:before,.fa-battery-full:before,.fa-battery:before{content:"\f240"}

.fa-battery-3:before,.fa-battery-three-quarters:before{content:"\f241"}

.fa-battery-2:before,.fa-battery-half:before{content:"\f242"}

.fa-battery-1:before,.fa-battery-quarter:before{content:"\f243"}

.fa-battery-0:before,.fa-battery-empty:before{content:"\f244"}

.fa-mouse-pointer:before{content:"\f245"}

.fa-i-cursor:before{content:"\f246"}

.fa-object-group:before{content:"\f247"}

.fa-object-ungroup:before{content:"\f248"}

.fa-sticky-note:before{content:"\f249"}

.fa-sticky-note-o:before{content:"\f24a"}

.fa-cc-jcb:before{content:"\f24b"}

.fa-cc-diners-club:before{content:"\f24c"}

.fa-clone:before{content:"\f24d"}

.fa-balance-scale:before{content:"\f24e"}

.fa-hourglass-o:before{content:"\f250"}

.fa-hourglass-1:before,.fa-hourglass-start:before{content:"\f251"}

.fa-hourglass-2:before,.fa-hourglass-half:before{content:"\f252"}

.fa-hourglass-3:before,.fa-hourglass-end:before{content:"\f253"}

.fa-hourglass:before{content:"\f254"}

.fa-hand-grab-o:before,.fa-hand-rock-o:before{content:"\f255"}

.fa-hand-paper-o:before,.fa-hand-stop-o:before{content:"\f256"}

.fa-hand-scissors-o:before{content:"\f257"}

.fa-hand-lizard-o:before{content:"\f258"}

.fa-hand-spock-o:before{content:"\f259"}

.fa-hand-pointer-o:before{content:"\f25a"}

.fa-hand-peace-o:before{content:"\f25b"}

.fa-trademark:before{content:"\f25c"}

.fa-registered:before{content:"\f25d"}

.fa-creative-commons:before{content:"\f25e"}

.fa-gg:before{content:"\f260"}

.fa-gg-circle:before{content:"\f261"}

.fa-tripadvisor:before{content:"\f262"}

.fa-odnoklassniki:before{content:"\f263"}

.fa-odnoklassniki-square:before{content:"\f264"}

.fa-get-pocket:before{content:"\f265"}

.fa-wikipedia-w:before{content:"\f266"}

.fa-safari:before{content:"\f267"}

.fa-chrome:before{content:"\f268"}

.fa-firefox:before{content:"\f269"}

.fa-opera:before{content:"\f26a"}

.fa-internet-explorer:before{content:"\f26b"}

.fa-television:before,.fa-tv:before{content:"\f26c"}

.fa-contao:before{content:"\f26d"}

.fa-500px:before{content:"\f26e"}

.fa-amazon:before{content:"\f270"}

.fa-calendar-plus-o:before{content:"\f271"}

.fa-calendar-minus-o:before{content:"\f272"}

.fa-calendar-times-o:before{content:"\f273"}

.fa-calendar-check-o:before{content:"\f274"}

.fa-industry:before{content:"\f275"}

.fa-map-pin:before{content:"\f276"}

.fa-map-signs:before{content:"\f277"}

.fa-map-o:before{content:"\f278"}

.fa-map:before{content:"\f279"}

.fa-commenting:before{content:"\f27a"}

.fa-commenting-o:before{content:"\f27b"}

.fa-houzz:before{content:"\f27c"}

.fa-vimeo-v:before,.fa-vimeo:before{content:"\f27d"}

.fa-black-tie:before{content:"\f27e"}

.fa-fonticons:before{content:"\f280"}

.fa-reddit-alien:before{content:"\f281"}

.fa-edge:before{content:"\f282"}

.fa-credit-card-alt:before{content:"\f283"}

.fa-codiepie:before{content:"\f284"}

.fa-modx:before{content:"\f285"}

.fa-fort-awesome:before{content:"\f286"}

.fa-usb:before{content:"\f287"}

.fa-product-hunt:before{content:"\f288"}

.fa-mixcloud:before{content:"\f289"}

.fa-scribd:before{content:"\f28a"}

.fa-pause-circle:before{content:"\f28b"}

.fa-pause-circle-o:before{content:"\f28c"}

.fa-stop-circle:before{content:"\f28d"}

.fa-stop-circle-o:before{content:"\f28e"}

.fa-shopping-bag:before{content:"\f290"}

.fa-shopping-basket:before{content:"\f291"}

.fa-hashtag:before{content:"\f292"}

.fa-bluetooth:before{content:"\f293"}

.fa-bluetooth-b:before{content:"\f294"}

.fa-percent:before{content:"\f295"}

.fa-gitlab:before{content:"\f296"}

.fa-wpbeginner:before{content:"\f297"}

.fa-wpforms:before{content:"\f298"}

.fa-envira:before{content:"\f299"}

.fa-universal-access:before{content:"\f29a"}

.fa-wheelchair-alt:before{content:"\f29b"}

.fa-question-circle-o:before{content:"\f29c"}

.fa-blind:before{content:"\f29d"}

.fa-audio-description:before{content:"\f29e"}

.fa-phone-volume:before,.fa-volume-control-phone:before{content:"\f2a0"}

.fa-braille:before{content:"\f2a1"}

.fa-assistive-listening-systems:before{content:"\f2a2"}

.fa-american-sign-language-interpreting:before,.fa-asl-interpreting:before{content:"\f2a3"}

.fa-deaf:before,.fa-deafness:before,.fa-hard-of-hearing:before{content:"\f2a4"}

.fa-glide:before{content:"\f2a5"}

.fa-glide-g:before{content:"\f2a6"}

.fa-sign-language:before,.fa-signing:before{content:"\f2a7"}

.fa-low-vision:before{content:"\f2a8"}

.fa-viadeo:before{content:"\f2a9"}

.fa-viadeo-square:before{content:"\f2aa"}

.fa-snapchat:before{content:"\f2ab"}

.fa-snapchat-ghost:before{content:"\f2ac"}

.fa-snapchat-square:before{content:"\f2ad"}

.fa-first-order:before{content:"\f2b0"}

.fa-yoast:before{content:"\f2b1"}

.fa-themeisle:before{content:"\f2b2"}

.fa-google-plus-circle:before,.fa-google-plus-official:before{content:"\f2b3"}

.fa-fa:before,.fa-font-awesome:before{content:"\f2b4"}

.fa-handshake-o:before{content:"\f2b5"}

.fa-envelope-open:before{content:"\f2b6"}

.fa-envelope-open-o:before{content:"\f2b7"}

.fa-linode:before{content:"\f2b8"}

.fa-address-book:before{content:"\f2b9"}

.fa-address-book-o:before{content:"\f2ba"}

.fa-address-card:before,.fa-vcard:before{content:"\f2bb"}

.fa-address-card-o:before,.fa-vcard-o:before{content:"\f2bc"}

.fa-user-circle:before{content:"\f2bd"}

.fa-user-circle-o:before{content:"\f2be"}

.fa-user-o:before{content:"\f2c0"}

.fa-id-badge:before{content:"\f2c1"}

.fa-drivers-license:before,.fa-id-card:before{content:"\f2c2"}

.fa-drivers-license-o:before,.fa-id-card-o:before{content:"\f2c3"}

.fa-quora:before{content:"\f2c4"}

.fa-free-code-camp:before{content:"\f2c5"}

.fa-telegram:before{content:"\f2c6"}

.fa-thermometer-4:before,.fa-thermometer-full:before,.fa-thermometer:before{content:"\f2c7"}

.fa-thermometer-3:before,.fa-thermometer-three-quarters:before{content:"\f2c8"}

.fa-thermometer-2:before,.fa-thermometer-half:before{content:"\f2c9"}

.fa-thermometer-1:before,.fa-thermometer-quarter:before{content:"\f2ca"}

.fa-thermometer-0:before,.fa-thermometer-empty:before{content:"\f2cb"}

.fa-shower:before{content:"\f2cc"}

.fa-bath:before,.fa-bathtub:before,.fa-s15:before{content:"\f2cd"}

.fa-podcast:before{content:"\f2ce"}

.fa-window-maximize:before{content:"\f2d0"}

.fa-window-minimize:before{content:"\f2d1"}

.fa-window-restore:before{content:"\f2d2"}

.fa-times-rectangle:before,.fa-window-close:before{content:"\f2d3"}

.fa-times-rectangle-o:before,.fa-window-close-o:before{content:"\f2d4"}

.fa-bandcamp:before{content:"\f2d5"}

.fa-grav:before{content:"\f2d6"}

.fa-etsy:before{content:"\f2d7"}

.fa-imdb:before{content:"\f2d8"}

.fa-ravelry:before{content:"\f2d9"}

.fa-eercast:before{content:"\f2da"}

.fa-microchip:before{content:"\f2db"}

.fa-snowflake-o:before{content:"\f2dc"}

.fa-superpowers:before{content:"\f2dd"}

.fa-wpexplorer:before{content:"\f2de"}

.fa-meetup:before{content:"\f2e0"}

.fa-mastodon:before{content:"\f2e1"}

.fa-mastodon-alt:before{content:"\f2e2"}

.fa-fork-awesome:before,.fa-fork-circle:before{content:"\f2e3"}

.fa-peertube:before{content:"\f2e4"}

.fa-diaspora:before{content:"\f2e5"}

.fa-friendica:before{content:"\f2e6"}

.fa-gnu-social:before{content:"\f2e7"}

.fa-liberapay-square:before{content:"\f2e8"}

.fa-liberapay:before{content:"\f2e9"}

.fa-scuttlebutt:before,.fa-ssb:before{content:"\f2ea"}

.fa-hubzilla:before{content:"\f2eb"}

.fa-social-home:before{content:"\f2ec"}

.fa-artstation:before{content:"\f2ed"}

.fa-discord:before{content:"\f2ee"}

.fa-discord-alt:before{content:"\f2ef"}

.fa-patreon:before{content:"\f2f0"}

.fa-snowdrift:before{content:"\f2f1"}

.fa-activitypub:before{content:"\f2f2"}

.fa-ethereum:before{content:"\f2f3"}

.fa-keybase:before{content:"\f2f4"}

.fa-shaarli:before{content:"\f2f5"}

.fa-shaarli-o:before{content:"\f2f6"}

.fa-cut-key:before,.fa-key-modern:before{content:"\f2f7"}

.fa-xmpp:before{content:"\f2f9"}

.fa-archive-org:before{content:"\f2fc"}

.fa-freedombox:before{content:"\f2fd"}

.fa-facebook-messenger:before{content:"\f2fe"}

.fa-debian:before{content:"\f2ff"}

.fa-mastodon-square:before{content:"\f300"}

.fa-tipeee:before{content:"\f301"}

.fa-react:before{content:"\f302"}

.fa-dogmazic:before{content:"\f303"}

.fa-zotero:before{content:"\f309"}

.fa-nodejs:before{content:"\f308"}

.fa-nextcloud:before{content:"\f306"}

.fa-nextcloud-square:before{content:"\f307"}

.fa-hackaday:before{content:"\f30a"}

.fa-laravel:before{content:"\f30b"}

.fa-signalapp:before{content:"\f30c"}

.fa-gnupg:before{content:"\f30d"}

.fa-php:before{content:"\f30e"}

.fa-ffmpeg:before{content:"\f30f"}

.fa-joplin:before{content:"\f310"}

.fa-syncthing:before{content:"\f311"}

.fa-inkscape:before{content:"\f312"}

.fa-matrix-org:before{content:"\f313"}

.fa-pixelfed:before{content:"\f314"}

.fa-bootstrap:before{content:"\f315"}

.fa-dev-to:before{content:"\f316"}

.fa-hashnode:before{content:"\f317"}

.fa-jirafeau:before{content:"\f318"}

.fa-emby:before{content:"\f319"}

.fa-wikidata:before{content:"\f31a"}

.fa-gimp:before{content:"\f31b"}

.fa-c:before{content:"\f31c"}

.fa-digitalocean:before{content:"\f31d"}

.fa-att:before{content:"\f31e"}

.fa-gitea:before{content:"\f31f"}

.fa-file-epub:before{content:"\f321"}

.fa-python:before{content:"\f322"}

.fa-archlinux:before{content:"\f323"}

.fa-pleroma:before{content:"\f324"}

.fa-unsplash:before{content:"\f325"}

.fa-hackster:before{content:"\f326"}

.fa-spell-check:before{content:"\f327"}

.fa-moon:before{content:"\f328"}

.fa-sun:before{content:"\f329"}

.fa-f-droid:before{content:"\f32a"}

.fa-biometric:before{content:"\f32b"}

.fa-wire:before{content:"\f32c"}

.fa-tor-onion:before{content:"\f32e"}

.fa-volume-mute:before{content:"\f32f"}

.fa-bell-ringing:before{content:"\f32d"}

.fa-bell-ringing-o:before{content:"\f330"}

.fa-hal:before{content:"\f333"}

.fa-jupyter:before{content:"\f335"}

.fa-julia:before{content:"\f334"}

.fa-classicpress:before{content:"\f331"}

.fa-classicpress-circle:before{content:"\f332"}

.fa-open-collective:before{content:"\f336"}

.fa-orcid:before{content:"\f337"}

.fa-researchgate:before{content:"\f338"}

.fa-funkwhale:before{content:"\f339"}

.fa-askfm:before{content:"\f33a"}

.fa-blockstack:before{content:"\f33b"}

.fa-boardgamegeek:before{content:"\f33c"}

.fa-bunny:before{content:"\f35f"}

.fa-buymeacoffee:before{content:"\f33d"}

.fa-cc-by:before{content:"\f33e"}

.fa-cc-cc:before,.fa-creative-commons-alt:before{content:"\f33f"}

.fa-cc-nc-eu:before{content:"\f341"}

.fa-cc-nc-jp:before{content:"\f342"}

.fa-cc-nc:before{content:"\f340"}

.fa-cc-nd:before{content:"\f343"}

.fa-cc-pd:before{content:"\f344"}

.fa-cc-remix:before{content:"\f345"}

.fa-cc-sa:before{content:"\f346"}

.fa-cc-share:before{content:"\f347"}

.fa-cc-zero:before{content:"\f348"}

.fa-conway-glider:before,.fa-conway-hacker:before{content:"\f349"}

.fa-csharp:before{content:"\f34a"}

.fa-email-bulk:before{content:"\f34b"}

.fa-email-bulk-o:before{content:"\f34c"}

.fa-gnu:before{content:"\f34d"}

.fa-google-play:before{content:"\f34e"}

.fa-heroku:before{content:"\f34f"}

.fa-hassio:before,.fa-home-assistant:before{content:"\f350"}

.fa-java:before{content:"\f351"}

.fa-mariadb:before{content:"\f352"}

.fa-markdown:before{content:"\f353"}

.fa-mysql:before{content:"\f354"}

.fa-nordcast:before{content:"\f355"}

.fa-plume:before{content:"\f356"}

.fa-postgresql:before{content:"\f357"}

.fa-sass-alt:before{content:"\f359"}

.fa-sass:before{content:"\f358"}

.fa-skate:before{content:"\f35a"}

.fa-sketchfab:before{content:"\f35b"}

.fa-tex:before{content:"\f35c"}

.fa-textpattern:before{content:"\f35d"}

.fa-unity:before{content:"\f35e"}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}

/*! PhotoSwipe main CSS by Dmytro Semenov | photoswipe.com */

.pswp {
  --pswp-bg: #000;
  --pswp-placeholder-bg: #222;
  

  --pswp-root-z-index: 100000;
  
  --pswp-preloader-color: rgba(79, 79, 79, 0.4);
  --pswp-preloader-color-secondary: rgba(255, 255, 255, 0.9);
  
  /* defined via js:
  --pswp-transition-duration: 333ms; */
  
  --pswp-icon-color: #fff;
  --pswp-icon-color-secondary: #4f4f4f;
  --pswp-icon-stroke-color: #4f4f4f;
  --pswp-icon-stroke-width: 2px;

  --pswp-error-text-color: var(--pswp-icon-color);
}

/*
	Styles for basic PhotoSwipe (pswp) functionality (sliding area, open/close transitions)
*/

.pswp {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: var(--pswp-root-z-index);
	display: none;
	touch-action: none;
	outline: 0;
	opacity: 0.003;
	contain: layout style size;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* Prevents focus outline on the root element,
  (it may be focused initially) */

.pswp:focus {
  outline: 0;
}

.pswp * {
  box-sizing: border-box;
}

.pswp img {
  max-width: none;
}

.pswp--open {
	display: block;
}

.pswp,
.pswp__bg {
	transform: translateZ(0);
	will-change: opacity;
}

.pswp__bg {
  opacity: 0.005;
	background: var(--pswp-bg);
}

.pswp,
.pswp__scroll-wrap {
	overflow: hidden;
}

.pswp__scroll-wrap,
.pswp__bg,
.pswp__container,
.pswp__item,
.pswp__content,
.pswp__img,
.pswp__zoom-wrap {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.pswp__img,
.pswp__zoom-wrap {
	width: auto;
	height: auto;
}

.pswp--click-to-zoom.pswp--zoom-allowed .pswp__img {
	cursor: zoom-in;
}

.pswp--click-to-zoom.pswp--zoomed-in .pswp__img {
	cursor: move;
	cursor: grab;
}

.pswp--click-to-zoom.pswp--zoomed-in .pswp__img:active {
  cursor: grabbing;
}

/* :active to override grabbing cursor */

.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img,
.pswp--no-mouse-drag.pswp--zoomed-in .pswp__img:active,
.pswp__img {
	cursor: zoom-out;
}

/* Prevent selection and tap highlights */

.pswp__container,
.pswp__img,
.pswp__button,
.pswp__counter {
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.pswp__item {
	/* z-index for fade transition */
	z-index: 1;
	overflow: hidden;
}

.pswp__hidden {
	display: none !important;
}

/* Allow to click through pswp__content element, but not its children */

.pswp__content {
  pointer-events: none;
}

.pswp__content > * {
  pointer-events: auto;
}

/*

  PhotoSwipe UI

*/

/*
	Error message appears when image is not loaded
	(JS option errorMsg controls markup)
*/

.pswp__error-msg-container {
  display: grid;
}

.pswp__error-msg {
	margin: auto;
	font-size: 1em;
	line-height: 1;
	color: var(--pswp-error-text-color);
}

/*
class pswp__hide-on-close is applied to elements that
should hide (for example fade out) when PhotoSwipe is closed
and show (for example fade in) when PhotoSwipe is opened
 */

.pswp .pswp__hide-on-close {
	opacity: 0.005;
	will-change: opacity;
	transition: opacity var(--pswp-transition-duration) cubic-bezier(0.4, 0, 0.22, 1);
	z-index: 10; /* always overlap slide content */
	pointer-events: none; /* hidden elements should not be clickable */
}

/* class pswp--ui-visible is added when opening or closing transition starts */

.pswp--ui-visible .pswp__hide-on-close {
	opacity: 1;
	pointer-events: auto;
}

/* <button> styles, including css reset */

.pswp__button {
	position: relative;
	display: block;
	width: 50px;
	height: 60px;
	padding: 0;
	margin: 0;
	overflow: hidden;
	cursor: pointer;
	background: none;
	border: 0;
	box-shadow: none;
	opacity: 0.85;
	-webkit-appearance: none;
	-webkit-touch-callout: none;
}

.pswp__button:hover,
.pswp__button:active,
.pswp__button:focus {
  transition: none;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
  opacity: 1;
}

.pswp__button:disabled {
  opacity: 0.3;
  cursor: auto;
}

.pswp__icn {
  fill: var(--pswp-icon-color);
  color: var(--pswp-icon-color-secondary);
}

.pswp__icn {
  position: absolute;
  top: 14px;
  left: 9px;
  width: 32px;
  height: 32px;
  overflow: hidden;
  pointer-events: none;
}

.pswp__icn-shadow {
  stroke: var(--pswp-icon-stroke-color);
  stroke-width: var(--pswp-icon-stroke-width);
  fill: none;
}

.pswp__icn:focus {
	outline: 0;
}

/*
	div element that matches size of large image,
	large image loads on top of it,
	used when msrc is not provided
*/

div.pswp__img--placeholder,
.pswp__img--with-bg {
	background: var(--pswp-placeholder-bg);
}

.pswp__top-bar {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 60px;
	display: flex;
  flex-direction: row;
  justify-content: flex-end;
	z-index: 10;

	/* allow events to pass through top bar itself */
	pointer-events: none !important;
}

.pswp__top-bar > * {
  pointer-events: auto;
  /* this makes transition significantly more smooth,
     even though inner elements are not animated */
  will-change: opacity;
}

/*

  Close button

*/

.pswp__button--close {
  margin-right: 6px;
}

/*

  Arrow buttons

*/

.pswp__button--arrow {
  position: absolute;
  top: 0;
  width: 75px;
  height: 100px;
  top: 50%;
  margin-top: -50px;
}

.pswp__button--arrow:disabled {
  display: none;
  cursor: default;
}

.pswp__button--arrow .pswp__icn {
  top: 50%;
  margin-top: -30px;
  width: 60px;
  height: 60px;
  background: none;
  border-radius: 0;
}

.pswp--one-slide .pswp__button--arrow {
  display: none;
}

/* hide arrows on touch screens */

.pswp--touch .pswp__button--arrow {
  visibility: hidden;
}

/* show arrows only after mouse was used */

.pswp--has_mouse .pswp__button--arrow {
  visibility: visible;
}

.pswp__button--arrow--prev {
  right: auto;
  left: 0px;
}

.pswp__button--arrow--next {
  right: 0px;
}

.pswp__button--arrow--next .pswp__icn {
  left: auto;
  right: 14px;
  /* flip horizontally */
  transform: scale(-1, 1);
}

/*

  Zoom button

*/

.pswp__button--zoom {
  display: none;
}

.pswp--zoom-allowed .pswp__button--zoom {
  display: block;
}

/* "+" => "-" */

.pswp--zoomed-in .pswp__zoom-icn-bar-v {
  display: none;
}

/*

  Loading indicator

*/

.pswp__preloader {
  position: relative;
  overflow: hidden;
  width: 50px;
  height: 60px;
  margin-right: auto;
}

.pswp__preloader .pswp__icn {
  opacity: 0;
  transition: opacity 0.2s linear;
  animation: pswp-clockwise 600ms linear infinite;
}

.pswp__preloader--active .pswp__icn {
  opacity: 0.85;
}

@keyframes pswp-clockwise {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/*

  "1 of 10" counter

*/

.pswp__counter {
  height: 30px;
  margin-top: 15px;
  -webkit-margin-start: 20px;
          margin-inline-start: 20px;
  font-size: 14px;
  line-height: 30px;
  color: var(--pswp-icon-color);
  text-shadow: 1px 1px 3px var(--pswp-icon-color-secondary);
  opacity: 0.85;
}

.pswp--one-slide .pswp__counter {
  display: none;
}

.pswp__dynamic-caption {
  color: #fff;
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  transition: opacity 120ms linear !important; /* override default */
}

.pswp-caption-content {
  display: none;
}

.pswp__dynamic-caption a {
  color: #fff;
}

.pswp__dynamic-caption--faded {
  opacity: 0 !important;
}

.pswp__dynamic-caption--aside {
  width: auto;
  max-width: 300px;
  padding: 20px 15px 20px 20px;
  margin-top: 70px;
}

.pswp__dynamic-caption--below {
  width: auto;
  max-width: 700px;
  padding: 15px 0 0;
}

.pswp__dynamic-caption--on-hor-edge {
  padding-left: 15px;
  padding-right: 15px;
}

.pswp__dynamic-caption--mobile {
  width: 100%;
  background: rgba(0,0,0,0.5);
  padding: 10px 15px;

  right: 0;
  bottom: 0;

  /* override styles that were set via JS.
    as they interfere with size measurement */
  top: auto !important; 
  left: 0 !important;
}

/* TODO: rename this file */

@font-face {
	font-family: "Noto Sans";
	src: url(../NotoSans.woff2);
}

body {
	display: grid;
	grid-template-columns: 1fr minmax(auto, 90ch) 1fr;
	grid-template-columns: 1fr min(92%, 90ch) 1fr;
	grid-template-rows: 1fr auto;
	min-height: 100vh;
}

.page {
	grid-column: 2;
}

.profile-content, .thread-content {
	margin: 0;
	margin-bottom: 3rem;
}

.profile-content .thread, .thread-content .thread {
		display: grid;
		width: 100%;
		position: relative;
	}

.profile-content .toots, .thread-content .toots {
		margin-top: 1rem;
	}

.bio {
	overflow: hidden;
}

.avatar {
	height: 8rem;
	width: 8rem;
	-o-object-fit: cover;
	   object-fit: cover;
}

/* Toot TODO: move to fedifox-lib? */

.info-stats {
	display: flex;
	gap: 0.4rem 1rem;
	flex-wrap: wrap;
}

.info-stats a {
		color: inherit;
	}

.info-stats .stats, .info-stats .stats div {
		display: flex;
		gap: 1rem;
	}

.info-stats .stats div, .info-stats .stats div div {
			gap: 0.5rem;
		}

.info-stats .visibility .fa {
		margin-top: 0.15em;
	}

.info-stats i.fa-reply-all {
		margin-top: 0.2em;
	}

.info-stats i.fa-retweet {
		margin-top: 0.08em;
	}

.info-stats i.fa-star {
		margin-top: 0.1em;
	}

p:first-child {
	margin-top: 0;
}

p:last-child {
	margin-bottom: 0;
}

.error {
	margin-bottom: 0;
	color: var(--error1);
	background: var(--error2);
	padding: 1rem;
	border: 0.1rem solid var(--error1);
	border-radius: var(--br);
}

.error h2 {
		margin: 0;
	}

/* Thread TODO: split to own file */

.thread.stale {
		opacity: 0.9;
		transition: 0.2s;
	}

.loading-big {
	color: var(--white2);
	position: fixed;
	left: 0;
	right: 0;
	text-align: center;
	font-size: 4rem;
	top: calc(50vh - 4rem);
}

.toot .cw-checkbox ~ .content {
		display: none;
	}

.toot .cw-checkbox:checked ~ .content {
		display: initial;
	}

.toot.missing {
		padding: 0.5rem;
	}

.toot.missing i {
			padding-left: 0;
			padding-right: 0.5rem;
			color: var(--error2);
		}

@media screen and (orientation: portrait) {
		.toot .avatar {
			grid-row: 1;
		}
			.toot .top-line .name {
				grid-template-columns: 1fr;
				grid-template-rows: auto auto;
			}

		.toot .body {
			margin-top: 0.75rem;
			grid-column: 1 / span 2;
		}
}

section.pswp__scroll-wrap {
	background: transparent;
	padding: 0;
	margin: 0;
}

.thread-line {
	border-right-style: solid;
	border-right-width: 0.15rem;
	opacity: 0.8;
}

.thread-line.first {
		margin-top: 0.5rem;
	}

.thread-line.main {
		border-right-style: solid;
	}

.border-color-transparent {
	border-color: transparent;
}

footer {
	grid-column: 1 / span 3;
	display: flex;
	justify-content: center;
	gap: 2rem;
	padding: 2rem;
}

.stats {
	display: inline-grid;
	grid-template-columns: auto 1fr;
	grid-column: 2;
	gap: 0.3rem 1rem;
}

@media (prefers-reduced-motion) {
	.fa-spin {
		animation: none;
	}
}

.hidden {
	display: none;
}

.instance-title {
	text-decoration: none;
	color: inherit;
	text-align: center;
}

.instance-title h1 {
		font-size: 2rem;
		line-height: 2.5rem;
		margin: 2rem;
	}

/* Normal page layout */

body.index-page, body.suspended-page {
	grid-template-columns: 1fr minmax(auto, 120ch) 1fr;
	grid-template-columns: 1fr min(92%, 120ch) 1fr;
}

body.index-page .loading-big {
		position: absolute;
		top: 50%;
	}

body.index-page .index-content {
		border-radius: 1rem;
		display: flex;
		flex-direction: column;
		gap: 1.5rem;
	}

body.index-page .index-content .description {
			height: 50vh;
			position: relative;
			--br: 0.42rem;
		}

body.index-page .index-content .description p {
				position: absolute;
				background: var(--bg-trans);
				bottom: 0;
				padding: 1rem;
				width: 100%;
				border-bottom-left-radius: var(--br);
				border-bottom-right-radius: var(--br);
				z-index: 2;
			}

body.index-page .index-content .description p::before {
					content: "";
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					opacity: 0.7;
					z-index: -1;
					background: var(--gray1);
				}

body.index-page .index-content .description img.thumbnail {
				width: 100%;
				height: 100%;
				-o-object-fit: cover;
				   object-fit: cover;
				border-radius: var(--br);
				position: absolute;
			}

body.index-page .index-content .split {
			display: flex;
			flex-wrap: wrap;
		}

/* padding: 0 1rem; */

body.index-page .index-content .split > div {
				display: inline-flex;
				flex-direction: column;
				padding: 1rem;
				padding-top: 0;
			}

body.index-page .index-content .split > div > h2 {
					margin-top: 0;
				}

body.index-page .index-content .split .split-60 {
				flex-grow: 6;
				flex-basis: 60%;
			}

body.index-page .index-content .split .split-40 {
				flex-grow: 4;
				flex-basis: 40%;
			}

body.index-page .index-content .about {
			background: var(--gray3);
			border-radius: var(--br);
			padding: 1.3rem;
			margin-bottom: 1.3rem;

		}

body.index-page .index-content .about h1, body.index-page .index-content .about h2, body.index-page .index-content .about h3 {
				margin: 0;
				line-height: initial;
			}

body.index-page .index-content .rules {
			display: inline-flex;
			flex-direction: column;
			gap: 1rem 0;
			padding: 0;
			margin: 0;
		}

body.index-page .index-content .rules a {
				padding: 1.3rem;
				background: var(--gray3);
				border-radius: var(--br);
				color: var(--fg);
				font-weight: bold;
				font-size: 1.2rem;
				line-height: 1.5em;
				text-decoration: none;
			}

body.index-page .index-content .rules a li {
					margin-left: 1rem;
				}

body.index-page .index-content .rules a:hover, body.index-page .index-content .rules a:target, body.index-page .index-content .rules a:active {
					background: var(--gray4);
				}

body.index-page .index-content .admin, body.index-page .index-content .info {
			background: var(--gray3);
			padding: 1rem;
			border-radius: var(--br);
		}

body.index-page .index-content .admin:hover {
				background: var(--gray4);
			}

body.index-page .index-content .admin .account {
				display: grid;
				grid-template-columns: auto 1fr;
				grid-template-rows: auto auto;
				height: 5rem;
				text-decoration: none;

				gap: 0.5rem 1rem;
			}

body.index-page .index-content .admin .account h2 {
					align-self: end;
					color: var(--fg);
					margin: 0;
				}

body.index-page .index-content .admin .account img.avatar {
					border-radius: var(--br);
					width: 5rem;
					height: 5rem;
					-o-object-fit: cover;
					   object-fit: cover;
					grid-row: 1 / span 2;
				}

body.index-page .index-content .info {
			display: grid;
			gap: 0.2rem 0.5rem;
			grid-template-columns: auto 1fr;
			margin-top: 1rem;
		}

body.suspended-page .blocklist {
		background: var(--gray3);
		padding: 1.3rem;
		border-radius: var(--br);
	}

body.suspended-page .list {
		display: flex;
		flex-direction: column;
	}

body.suspended-page .list .entry {
			display: grid;
			grid-template-columns: max(30%, 10rem) 1fr;
			gap: 0.5rem;
			padding: 0.5rem;
			align-items: start;

			background: var(--list-entry-bg);
			border: 0.1rem solid transparent;
			border-top-color: transparent;
		}

body.suspended-page .list .entry:nth-child(even) {
				background: var(--list-entry-alternate-bg);
			}

body.suspended-page .list .entry:hover {
				background: var(--list-entry-hover-bg);
			}

body.suspended-page .list .entry:active, body.suspended-page .list .entry:focus, body.suspended-page .list .entry:hover, body.suspended-page .list .entry:target {
				border-color: var(--fg-accent);
			}

body.suspended-page .list .entry > div {
				display: flex;
				align-items: center
			}

body.suspended-page .list .entry .domain a {
				font-weight: bold;
				text-decoration: none;
				display: inline-block;
			}

body.suspended-page .list .entry .public_comment p {
				margin: 0;
			}

a.clickable {
	text-decoration: none;
	color: inherit;
}

.loading {
	display: inline-block;
}


