html {
	height:100%;
}

html, body {
	scroll-behavior: smooth;
}

body {
	font-size:11.5px;
	font-family:Verdana, Arial, sans-serif;
	margin:0 0;
	background:#EFA158;
	/*background-color:#000;*/
	background-position:top center;
	background-attachment:fixed;
	overflow-y:scroll;
	height:100%;
}

li {
	padding:6px;
}

.theme1 {
	background-color: #30B2FF;
	background-image:url('/assets/img/themes/bg1.png');
	background-repeat:repeat-x;
}

.theme2 {
	background-color: #CB7421;
	background-image: url('/assets/img/themes/bg2.png');
}

.theme3 {
	background-color: #87B5DB;
	background-image: url('/assets/img/themes/bg3.png');
	background-repeat:repeat-x;
}

/*part of larger theme to be implemented*/
.theme4 {
	background-color: #002844;
	background-image: url('/assets/img/themes/bg4.png');
	background-repeat:repeat-x;
}

a {
	text-decoration:none;
	color:#24d;
}

a:hover {
	text-decoration:underline;
}

h1, h2, h3, h4, p {
	margin:0 0 10px 0;
}

.input-error {
	color:#cd1200!important
}

.masthead {
	position:fixed;
	background:linear-gradient(to bottom, #247, #124);
	top:0;
	left:0;
	width:100%;
	z-index:10000;
	height:38px;
	box-shadow:#0008 0 -2px 8px, #fff7 0 -1px 0 inset;
	border-bottom:1px solid #000;
}

.masthead > .inner {
	width:962px;
	height:38px;
	margin:0 auto;
	overflow:hidden;
}

.masthead.inline {
	position:relative!important;
	box-shadow:none;
	overflow:hidden;
	border-radius:4px;
	border-bottom:none;
	margin:10px 0;
	z-index:0;
}

.masthead.inline > .inner {
	width:auto;
	border:1px solid #028;
}

.masthead.inline .header {
	border-radius:3px!important;
	padding:0 0;
	width:auto;
	position:relative;
	border-top:none;
	box-shadow:#fff7 1px 1px 0 inset, #fff7 -1px -1px 0 inset;
}

.masthead.inline .header .right-items {
	right:9px;
}

.header {
	height:37px;
	border-top:28px solid transparent;
	position:absolute;
	width:962px;
	bottom:0;
}

.header .inner {
	padding:10px;
	margin:0 auto;
	position:relative;
	padding-top:10px;
}

.brand-name {
	font-size:28px;
	line-height:32px;
	color:#fff;
	font-weight:bold;
	font-family:Georgia, serif;
	text-shadow:#000 1px 1px 3px;
	margin-right:10px;
	position:absolute;
	bottom:-16px;
	padding-left:58px;
	left:0;
}

.brand-name .logo {
	filter:drop-shadow(1px 1px 1.5px #000d);
	position:absolute;
	top:0;
	left:0;
}

.brand-name:hover {
	text-decoration:none;
}

h1.brand-name {
	position:static;
	font-size:42px;
	margin-top:10px;
}

.brand-name .small,
.brand-name small {
	color:#4479FF;
	position:relative;
	font-size:22px!important;
	font-weight:normal!important;
	text-shadow:#000d 0 1px 0!important;
}

.brand-name .small {
	left:-54px;
	top:4px;
}

.header .right-items {
	position:absolute;
	right:0;
	top:9px;
	font-size:11px;
	border:1px solid #444b;
	border-radius: 2px 2px 0 0;
	box-shadow:#fff6 1px -1px 0, #fff6 -1px 1px 0;
}

.header .dropdown {
	display:inline-block;
	position:relative;
}

.dropdown-bg-to-close {
	position:fixed;
	height:100%;
	width:100%;
	top:0;
	left:0;
	display:none;
}

.dropdown-bg-to-close.open {
	display:block;
	cursor:pointer;
}

.dropdown a {
	display:block;
	line-height:24px;
	font-size:13px;
	padding:0 12px;
	color:#f8f8f8;
	user-select:none;
	cursor:pointer;
}

.dropdown a:hover {
	background:#48d8;
	color:#fff;
	box-shadow:#0008 -1px -1px 0 inset, #fff7 1px 1px 0 inset;
	text-decoration:none;
}

.dropdown .dd-contents {
	position:absolute;
	right:0;
	top:28px;
	border:1px solid #000;
	border-top:0;
	width:220px;
	background:linear-gradient(to bottom, #247, #124);
	padding:8px 0;
	border-radius:0 0 3px 3px;
	box-shadow:#fff7 1px 1px 0 inset, #0008 0 1px 2px;
	display:none;
	
}

.dropdown.open .dd-contents {
	display:block;
}

.header .header-item {
	line-height:27px;
	display:inline-block;
	padding:0 12px;
	color:#d8d8d8;
	position:relative;
	text-shadow:#0008 0 1px 0, #0008 1px 0 0, #0008 -1px 0 0, #0008 0 -1px 0;
	font-weight:bold;
	box-shadow:#fff6 1px 1px 0 inset, #fff2 -1px -1px 0 inset;
	border-right:1px solid #444b;
	background-image:linear-gradient(to bottom, #fff4, transparent, #0138);
	user-select:none;
	cursor:pointer;
}

.header .header-item.with-icon {
	position:relative;
	padding-left:32px;
}

.header-item.with-icon .icon {
	position:absolute;
	top:5px;
	left:10px;
	
}

.header .header-item.left {
	border-radius: 1.5px 0 0 0;
}

.header .header-item.right {
	border-radius: 0 1.5px 0 0;
	border-right:none;
}

.header .header-item:hover {
	text-decoration:none;
	background-color:#48d;
	color:#f8f8f8;
	box-shadow:#8df 0 0 4px, #fff8 -1px -1px 0 inset, #fff4 1px 1px 0 inset;
}

.header .header-item.selected {
	box-shadow:#000 0 1px 4px inset;
	background-color:#2348;
	color:#ffffff;
}

.content-positioner {
	top: 49px;
}

/* Page Layout */

.page-positioner {
	width:942px;
	margin:0 auto;
	position:relative;
	min-height:100%;
	background:#fff7;
	padding:0 10px;
	box-shadow:#fff 1px 0 0 inset, #fff -1px 0 0 inset, #000 0 3px 3px;
}

.popover {
	display:flex;
	height:100%;
	width:100%;
	position:fixed;
	top:0;
	left:0;
	background:#0008;
	align-items:center;
	justify-content:center;
}

.main-alert-holder {
	position:fixed;
	width:100%;
	display:flex;
	align-items:center;
	justify-content:center;
}

#main-alert-container{
	position:fixed;
	width:100%;
	height:100%;
	top:0;
	left:0;
	z-index:10000;
}

#main-alert-dialog {
	min-width:var(--550px-default-value;);
	max-width:var(--550px-default-value;);
	top:200px;
	margin:0 auto;
	position:absolute;
}

.left-pane {
	width:550px;
	position:relative;
	padding:49px 0;
	margin-bottom:0;
}

.left-pane.centered {
	margin:0 auto;
}

.footer {
	margin-top:10px;
}

.footer .controls {
	width:100%;
	margin-top:10px;
}

.right-pane {
	position:fixed;
	float:right;
	top:0;
	margin-left:562px;
	width:380px;
	z-index:0;
	max-height:100%;
	overflow:scroll;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

/* Comments */

.right-pane .comments {
	margin-top:10px;
	margin-bottom:4px!important;
}

.right-pane .comments .inner {
	padding:0!important;
}

.right-pane .comments .comment {
	padding:10px;
	border-top:1px solid #cbcbcb;
	width:auto;
}

.right-pane .element h4, .right-pane .element .counter-right {
	padding:10px;
	margin-bottom:0;
}

.right-pane .comment .post-text {
	min-width:324px!important;
	max-width:324px!important;
}

.right-pane .load-more {
	margin-top:0!important;
}

/* Open Tack Styles */

.right-pane .open-tack {
	overflow:hidden;
	height:1px;
}

.right-pane .open-tack > *:not(.button) {
	border-width:0;
	width:0;
	overflow:hidden;
	margin:0 auto 10px;
}

.right-pane .open-tack.open {
	border-width:1px;
	height:800px;
	transition:0.5s;
	transition-delay:0.5s;
	transition-timing-function:linear;
}

.right-pane .open-tack .button {
	left:0;
}

.right-pane .open-tack.open > .button {
	width:378px;
}

.right-pane .open-tack.open > *:not(.button) {
	border-width:1px;
	transition:0.5s;
	width:378px;
	transition-timing-function:linear;
}

/* Cows (Very Important.) */

.cows {
	padding:10px;
}

.cows img {
	width:100%;
	image-rendering:pixelated;
}

.right-pane > .inner {
	min-height:800px;
}

.right-pane .cows {
	margin-top:39px;
}

/* Settings FUCK AAHHH NOOOO */

.page-positioner.settings {
	padding-bottom:0;
}

.page-positioner.settings > .inner {
	border:1px solid #000;
	position:relative;
	border-radius:4.5px;
	box-shadow:#000 0 1px 1px;
	top:49px;
}

.settings > .inner > .left-pane {
	left:0;
	top:0;
	min-height:100%;
	width:195px;
	background:#5A6472;
	border-right:1px solid #000;
	border-radius:3px 0 0 3px;
	box-shadow:#fffd 1px 1px 0 inset, #4282f2 -1px -1px 0 inset;
	position:absolute;
	background-image:linear-gradient(to bottom, #fff8, #0000);
	background-repeat:repeat-x;
	background-size:100% 40px;
	padding: 0 0;
}

.settings .inner > .left-pane > .inner {
	padding:10px 0;
}

.settings .inner > .left-pane h3 {
	padding:6px 20px;
	color:#fff;
	text-shadow:#000b 0 1px 0;
	font-size:13px;
	font-style:italic;
}

.settings .inner > .left-pane .page-option  {
	display:block;
	padding:6px 20px;
	color:#dedede;
	text-shadow:#0008 0 -1px 0;
	position:relative;
	line-height:16px;
	border-top:1px solid transparent;
	border-bottom:1px solid transparent;
}

.settings .inner > .left-pane .page-option.with-icon {
	padding-left:42px;
}

.settings .inner > .left-pane .page-option .icon {
	top:6px;
	left:20px;
	position:absolute;
	filter:drop-shadow(0 -1px 0 #000d);
}

.settings .inner > .left-pane .page-option:hover {
	text-decoration:none;
	background-color:#7C8A9E;
	background-image:linear-gradient(to bottom, #fff8, #0004);
	color:#fff;
	border-color:#444;
	box-shadow:#fffd 1px 1px 0 inset, #4282f288 -1px -1px 0 inset, #fff4 1px 1px 0, #4282f2ff 0 -1px 0;
	z-index:1;
}

.settings .inner > .left-pane .page-option.selected {
	background-color:#424954!important;
	background-image:linear-gradient(to bottom, #0004, transparent);
	color:#dfdfdf!important;
	box-shadow:#0004 1px 1px 0 inset, #fff8 -1px -1px 0 inset, #fff8 1px 1px 0, #4282f288 0 -1px 0;
	border-color:#000!important;
}

.settings .inner > .right-pane {
	background:#ddd;
	min-height:520px;
	position:relative;
	top:0;
	margin-left:196px;
	width:744px;
	border-radius:0 3px 3px 0;
	float:none;
	box-shadow:#0004 1px 1px 0 inset, #fff8 -1px -1px 0 inset;
	border:none;
}

.settings .inner > .right-pane .section-heading * {
	color:#aaa;
	text-shadow:#000b -1px 0 0, #000b 0 -1px 0, #fff 1px 0 0, #fff 0 1px 0;
	padding:10px;
	margin-bottom:0;
	margin-top:0;
}

.settings .inner > .right-pane .section-heading.experiments * {
	color:#3463FF;
	font-weight:normal;
	font-size:42px;
	margin-bottom:10px;
}

.settings .inner > .right-pane h2 {
	padding:0 20px;
	margin-top:10px;
}

.settings .inner > .right-pane .element {
	padding:10px;
	border-bottom:1px solid #000;
	background-color:#d8d8d8;
	background-image:linear-gradient(to bottom, #fff, transparent);
	background-repeat:repeat-x;
	background-size:100% 40px;
	box-shadow:#eee 0 1px 0 inset, #fffb 1px 0 0 inset, #70A4FF -1px -1px 0 inset;	
}

.settings .inner > .right-pane .inner .setting-groups .setting-group > .element:first-child {
	border-top:1px solid #000;
}

.settings .inner > .right-pane .inner .setting-groups .setting-group > .element:last-child {
	box-shadow:#eee 0 1px 0 inset, #fffb 1px 0 0 inset, #70A4FF -1px -1px 0 inset, #0004 0 3px 3px;
}

.settings .inner > .right-pane .element .inner {
	display:flex;
	padding:10px 20px;
	align-items:center;
}

.settings .inner > .right-pane .element .title {
	width:120px;
	margin-right:10px;
	font-weight:bold;
	text-shadow:#fff 0 1px 0;
}

.settings .inner > .right-pane .element .inputs {
	flex:1;
	display:flex;
	align-items:center;
	gap:8px;
}

.settings .inner > .right-pane .element .inputs input.third {
	max-width:110px;
}

.settings .inner > .right-pane .element .inputs input.full-width {
	flex:1;
}

.settings .inner > .right-pane .element .char-count {
	color:#24f;
	text-shadow:#000 0 -1px 0, #fff 0 1px 0;
	margin-left:10px;
	text-align:right;
	min-width:195px;
}

.button.setting-update {
	width:160px;
	margin-left:16px;
}

/* Help Center and Documents */

.help-center .document {
	width:640px;
	margin:0 auto;
	padding:10px 0;
	overflow:hidden;
}

.document .page {
	position:relative;
	padding:35px 40px;
	background:#f8f8f8;
	border:1px solid #aaa;
	margin-bottom:20px;
	box-shadow:#fff 1px 1px 0 inset, #0002 1px 2px 1px;
}

.document .page:before {
	display:block;
	content:"";
	position:absolute;
	border-left:45px solid #f8f8f8;
	border-top:45px solid transparent;
	filter:drop-shadow(-1px 1px 0 #aaa) drop-shadow(0.5px 0.5px 0 #888) drop-shadow(1px 2px 1px #0002);
	z-index:10px;
	top:-1px;
	right:-1px;
}

.document .page:after {
	display:block;
	content:"";
	position:absolute;
	border-right:45px solid #ddd;
	border-bottom:45px solid transparent;
	top:-1px;
	right:-1px;
	z-index:0;
}

.document .page .foot-note {
	color:#888;
}

.document .text {
	width:auto;
}

/* Doubled Tack Styles */
.doubled-tack {
	border:1px solid #cdcdcd;
	border-radius:2px;
	padding:8px;
	width:432px;
	margin-top:8px;
	box-shadow:#0004 0 1px 1px inset;
	position:relative;
	margin-bottom:2px;
	display:block;
	background-color:#f4f4f4;
	background-image:linear-gradient(to bottom, transparent, #fff);
	background-size:20px 20px;
	background-position:bottom;
	background-repeat:repeat-x;
}

.doubled-tack.menu {
	flex:1;
	width:var(--490px-default-value);
}

.menu .selection {
	cursor:pointer;
	padding:4px 8px;
	line-height:1.2;
	color:#24d;
}

.menu .selection:hover {
	background:#24d;
	color:#fefefe;
	border-radius:2px;
}

.menu .selection:active {
	background:#24d;
	color:#fefefe;
	text-shadow:#0008 0 1px 1px;
	box-shadow:#0008 1px 2px 1px inset;
}

.doubled-tack[hidden] {
	display:none;
}

.doubled-tack #tack-box-double-close-button {
	position:absolute;
	top:8px;
	right:8px;
	color:transparent;
	user-select:none;
	overflow:hidden;
	cursor:pointer;
	width:16px;
}

.doubled-tack a.small {
	position:absolute;
	top:8px;
	right:12px;
	color:#24d;
}

.doubled-tack .post-text {
	min-width:416px!important;
	max-width:416px!important;
}

.right-pane .doubled-tack {
	min-width:322px;
	max-width:322px;
}

.right-pane .doubled-tack .post-text {
	min-width:322px!important;
	max-width:322px!important;
}

/* Right Pane Account Stats */

.feed.account-stats {
	margin-bottom:10px;
	position:relative;
	margin-top:49px;
}

.feed.account-stats a.with-userimg {
	line-height:48px;
	font-size:18px;
	color:#333;
}

.stats {
	border:1px solid #cdcdcd;
	display:flex;
	border-radius:2px;
	justify-content:center;
	background-color:#f4f4f4;
	background-image:linear-gradient(to bottom, transparent, #fff);
	background-size:20px 20px;
	background-position:bottom;
	background-repeat:repeat-x;
	box-shadow:#0004 0 1px 1px inset;
}

.stats .part {
	border-right:1px solid #cdcdcd;
	padding:4px 8px 6px;
	color:#777;
	display:block;
	text-align:center;
	flex:1;
}

.stats .part p {
	margin:2px;
	font-weight:bold;
	color:#24d;
}

.stats .part.right {
	border-right:none;
}

.stats a.part:hover {
	color:#222;
	text-decoration:none;
}

.feed.profile .stats {
	margin-top:20px;
}

.feed.profile .post-controls .buttons .icon.flag {
	position:relative;
	top:3px;
}

/* Upload Stuff */

.upload-form input[type=text], .upload-form input[type=password], .upload-form textarea, .upload-form input[type=number] {
	width:504px;
	margin-bottom:10px;
}

/* Composition Stuff*/

.tack-box {
	margin-bottom:10px;
	overflow:visible;
	position:relative;
}

.tack-box textarea, .tack-box input[type=text], .tack-box input[type=password], .tack-box input[type=number] {
	width:436px;
	resize:vertical;
}

.counter-right {
	text-align:right;
	position:relative;
	margin-bottom:10px;
}

.counter-right h4,
.counter-right h3,
.counter-right h2,
.counter-right h1 {
	position:absolute;
	top:0;
	left:0;
}

/* User Image/Icon Stuff */

.user-image {
	display:block;
	background:url("/assets/img/brand/default-avatar.png");
	background-position:center;
	background-size:cover;
	border-radius:3px;
	box-shadow:#fff4 0 2px 1px inset;
}

.icon {
	display:inline-block;
	color:transparent;
	overflow:hidden;
	user-select:none;
	cursor:pointer;
}

.size-16 {
	min-width:16px;
	max-width:16px;
	height:16px;
}

.size-24 {
	min-width:24px;
	max-width:24px;
	height:24px;
}

.size-48 {
	min-width:48px;
	max-width:48px;
	height:48px;
}

.size-128 {
	min-width:128px;
	max-width:128px;
	height:128px;
}

.icon.index {
	background:url('/assets/img/icons/index.png');
}

.icon.star {
	background:url('/assets/img/icons/star.png');
}

.icon.add {
	background:url('/assets/img/icons/add.png');
}

.icon.block {
	background:url('/assets/img/icons/block.png');
}

.icon.double {
	background:url('/assets/img/icons/double.png');
}

.icon.open {
	background:url('/assets/img/icons/open.png');
}

.icon.upload {
	background:url('/assets/img/icons/upload.png');
}

.icon.edit {
	background:url('/assets/img/icons/edit.png');
}

.icon.tack {
	background:url('/assets/img/icons/tack.png');
}

.icon.media {
	background:url('/assets/img/icons/media.png');
}

.icon.clapper {
	background:url('/assets/img/icons/clapper.png');
}

.icon.trash {
	background:url('/assets/img/icons/trash.png');
}

.icon.cog {
	background:url('/assets/img/icons/cog.png');
}

.icon.attach {
	background:url('/assets/img/icons/attach.png');
}

.icon.close {
	background:url('/assets/img/icons/close.png');
}

.icon.flag {
	background:url('/assets/img/icons/flag.png');
}

.icon.ponder {
	background:url('/assets/img/icons/ponder.png');
}

.icon.access {
	background:url('/assets/img/icons/access.png');
}

.icon.tip {
	background:url('/assets/img/icons/tip.png');
}

.icon.user {
	background:url('/assets/img/icons/user.png');
}

.icon.id {
	background:url('/assets/img/icons/id.png');
}

.icon.spy {
	background:url('/assets/img/icons/spy.png');
}

.icon.logo {
	min-width:50px;
	height:50px;
	background:url('/assets/img/brand/logo.png');
}

a.with-userimg .user-image {
	width:24px;
	float:left;
	margin-right:8px;
}

a.with-userimg {
	line-height:24px;
}

/* Profile SHIT */

.profile-avatar-frame {
	min-width:128px;
	max-width:128px;
	height:128px;
	position:relative;
	margin-right:calc(6px * -1);
}

.profile-avatar-frame .frame {
	min-width:128px;
	max-width:128px;
	height:128px;
	background-image:url('/assets/img/brand/default-avatar-frame.png');
	position:absolute;
}

.profile-avatar-frame .user-image {
	position:absolute;
	width:94px!important;
	max-width:94px!important;
	height:94px;
	left:15px;
	top:15px;
	border-radius:2px;
	box-shadow:none!important;
}

.user-display-name {
	color:#999;
	font-size:30px;
	font-family:Georgia, Times, serif;
}

.text.profile-bio, .text.profile-pronouns {
	display:block;
	width:378px;
}

.profile-pronouns {
	margin-bottom:10px;
	margin-top:calc(10px * -1);
}

/* Controls Shit */

.row {
	display:block;
	width:100%;
}

input[type="checkbox"] {
	position:relative;
	margin-right:8px;
	left:0px;
}

input[type="color"] {
	height:26px;
	width:48px;
}

select {
	min-width:94px;
}

.post-controls .left, .controls .left {
	flex:1;
	justify-content:left;
}

.controls {
	gap:8px;
}

.button {
	display:inline-block;
	padding:5px 14px;
	background-color:#dedede;
	background-image:linear-gradient(to bottom, #f8f8f8, #dedede);
	background-size:24px 24px;
	background-repeat:repeat-x;
	border:1px solid #828282;
	border-radius:3px;
	font-size:var(--10-5px-default-value);
	cursor:pointer;
	user-select:none;
	box-shadow:#fffd 0 1px 0 inset;
	text-shadow:#fff 0 1px 0;
	color:#424242;
	font-family:Verdana, Arial, sans-serif;
}

a.button {
	position:relative;
	top:5px;
}

.button[disabled], .button.toggled {
	background:#b8b8b8!important;
	box-shadow:#0002 1px 1px 0 inset, #fff6 -1px -1px 0 inset!important;
	color:#505050!important;
}

.button:hover {
	box-shadow:#ffff 1px 1px 0 inset, #fff8 -1px -1px 0 inset;
	color:#000;
	text-decoration:none;
	background-position:0 -16px;
}

.button:active {
	box-shadow:#000a 0 1px 2px inset, #fffd 0 1px 0;
	background:linear-gradient(to bottom, #c0c0c0, #e0e0e0);
	color:#000;
}

.button.with-icon {
	padding-left:35px;
	position:relative;
}

.button.with-icon .icon {
	position:absolute;
	left:10px;
	top:4px;
}

textarea, input[type=text], input[type=password], input[type=number] {
	background-image:linear-gradient(to bottom, #0001, transparent);
	background-size:2px 2px;
	background-repeat:repeat-x;
	background-color:#fff;
	border:1px solid #d4d8ff;
	border-top-color:#848484;
	border-radius:2px;
	outline:none;
	font-family:Arial, sans-serif;
	font-size:var(--default-font-value);
	line-height:1.2;
	padding:5px 6px 3px;
}

input[type=text], input[type=password], input[type=number] {
	padding:5px 6px 3px;
}

textarea:hover, textarea:focus, input[type=text]:hover, input[type=password]:hover, input[type=text]:focus, input[type=password]:focus,  input[type=number]:hover,  input[type=number]:focus {
	border-color:#6688ee;
	border-top-color:#484848;
}

textarea:focus, input[type=text]:focus, input[type=text]:focus, input[type=password]:focus, input[type=number]:focus {
	background-image:linear-gradient(to bottom, #0006, transparent);
	box-shadow:#fafafa 0 1px 0;
}

.search-small input[type=text], .search-small input[type=password] {
	border-radius:2px 0 0 2px;
	border-right-width:0;
	height:15px;
}

.search-small .button {
	border-radius: 0 2px 2px 0;
}

form.search-small .button {
	position:relative;
	top:1px;
}

.clickable {
	color:#454545;
}

.clickable:hover {
	color:#2255dd;
	text-decoration:underline;
	cursor:pointer;
}

.clickable.with-icon {
	line-height:16px;
	padding-left:20px;
	position:relative;
	height:16px;
	display:inline-block;
}

.clickable.with-icon .icon {
	position:absolute;
	top:0;
	left:0;
}

/* Feed stuff */

.feed {
	position:relative;
	background:transparent;
	border:1px solid #000;
	overflow:hidden;
}

.feed .element:last-child {
	border-bottom-width:0!important;
}

.feed .element {
	border-bottom:1px solid #000;
	padding:8px;
	box-shadow:#fff7 1px 2px 0 inset, #0008 -1px -1px 0 inset;
	background-image:linear-gradient(to bottom, #fff4, #0000);
	background-repeat:repeat-x;
	background-size:100% 64px;
	display:flex;
	align-items:begin;
	gap:10px;
	margin-left:0;
	position:relative;
	transition:0.15s;
	background-color:#004080;
}

.feed .element::before {
	display:block;
	content:"";
	opacity:0;
	transition-delay:0s;
	position:absolute;
	top:0;
	right:552px;
}

.feed .element.open {
	transition:0.5s;
	margin-left:450px;
	position:relative;
	border-left:1px solid #000;
	box-shadow:#fff7 1px 2px 0 inset, #0008 -1px -1px 0 inset, #0008 -1px 0 3px;
}

.feed .element.open::before {
	transform:translate-x(0);
	opacity:1;
	transition:0.5s;
	display:block;
	background:#0005;
	padding-left:200px;
	height:calc(100% + 1px);
	line-height:36px;
	right:98px;
	width:376px;
	color:#fff;
	font-weight:bold;
	text-shadow:#000 1px 0 0, #000 0 1px 0, #000 -1px 0 0, #000 0 -1px 0, #000 1px 0 0, #000 0 1px 0, #0f87ff 0 1px 8px;
	content:"Tack and comments in right-hand pane.";
	font-size:18px;
	font-family:Arial;
}

.feed .element > .user-image {
	border:1px solid #343434;
	box-shadow:#fff4 0 2px 1px inset, #fff8 0 -1px 0, #fff8 0 1px 0, #fff8 1px 0 0, #fff8 -1px 0 0;
	position:relative;
	border-radius:0;
}

.feed .element > .user-image.logo {
	border:none;
	box-shadow:none;
	filter:drop-shadow(#fff8 0 -1px 0) drop-shadow(#000b 0 1px 2px);
}

.feed .element > .user-image::after {
	display:block;
	content:"";
	border-top:6px solid transparent;
	border-bottom:6px solid transparent;
	border-right:8px solid #fff;
	filter:drop-shadow(-1px 0 0 #000d) drop-shadow(calc(2px * -1) 0 0 #fff8);
	position:absolute;
	right:calc(12px * -1);
	top:17px;
}

.feed .element #tack-color-tick {
	border-left:8px solid transparent;
	border-right:8px solid transparent;
	border-bottom:6px solid transparent;
	filter: drop-shadow(0 -1px 0 #ffff) drop-shadow(0 -2px 0 #0008);
	position:absolute;
	bottom:6px;
	left:94px;
	z-index:10;
}

.feed .element > .inner {
	padding:10px;
	background:#fff;
	border:1px solid #343434;
	box-shadow:#fff8 0 -1px 0, #fff8 0 1px 0, #fff8 1px 0 0, #fff8 -1px 0 0;
	flex:1;
}

.feed .element .post-controls {
	position:relative;
	height:42px;
}

.feed .element .post-controls .inner {
	display:flex;
	position:absolute;
	gap:6px;
	height:41px;
	border-top:1px solid #bbc8ee;
	align-items:center;
	justify-content:right;
	bottom:calc(10px * -1);
	width:100%;
	padding:0 10px;
	background:#d4d8ff;
	left:calc(10px * -1);
	box-shadow:#fff8 0 1px 0 inset;
}

.feed .element .post-actions {
	margin-top:8px;
}

.feed .element .post-actions .inner {
	display:flex;
	justify-content:right;
	align-items:flex-end;
	gap:12px;
}

.feed .element .post-actions .counter {
	border:1px solid #cdcdcd;
	border-radius:2px;
	padding:2px 4px;
	box-shadow:#0004 0 1px 1px inset, #fff8 0 1px 0;
	position:relative;
	display:inline-block;
	background-color:#f4f4f4;
	background-image:linear-gradient(to bottom, transparent, #fff);
	background-size:20px 20px;
	background-position:bottom;
	background-repeat:repeat-x;
	position:relative;
	width:42px;
	text-align:right;
	line-height:16px;
	margin-right:4px;
}

.feed .element .post-actions .left {
	flex:1;
}

.feed .element .post-actions .counter .icon {
	margin-right:6px;
	cursor:default;
	position:absolute;
	left:4px;
	top:2px;
	margin-bottom:calc(2px * -1);
}

.feed .element .post-controls.with-text {
	height:auto;
}

.feed .element .post-controls.with-text .above-text {
	padding-bottom:10px;
}

.feed .element .post-controls.with-text .inner {
	display:block;
	position:relative;
	height:auto;
	padding:10px;
}

.feed .element .post-contrls.with-text .under-shoot {
}

.feed .element .post-controls.with-text .inner .buttons {
	display:flex;
	width:100%;
	margin-bottom:10px;
	gap:6px;
}

.feed .element .post-controls.with-text .under-shoot {
}

.element > .inner > .post-text {
	min-width:450px;
	max-width:450px;
}

.feed .element .post-text {
	display:inline-block;
	word-wrap:break-word;
	line-height:1.4;
	font-family:Arial;
	font-size:13px;
}

.feed .counter-right.tack {
	margin-bottom:-4px;
}

.feed-loading {
	background-color:#fff;
	height:32px;
	color:transparent;
	background-image:url('/assets/img/brand/working.gif');
	background-repeat:no-repeat;
	background-position:center;
	box-shadow:#0138 0 1px 2px inset;
	border-radius:0 0 3px 3px;
	filter:brightness(98%);
}

.text {
	font-family:Arial;
	width:500px;
	word-wrap:break-word;
	line-height:18px;
}

.right-pane .post-text {
	min-width:340px!important;
	max-width:340px!important;
}

.feed .element .inner > a {
	display:inline-block;
	margin-bottom:10px;
}

.small {
	font-size:10px;
	color:#686868;
}

.load-more.button {
	flex:1;
	text-align:center;
	margin-top:10px;
	width:100%;
	padding:8px 0;
	position:relative;
	left:-1px;
}