.dot {
	height: 15px;
	width: 15px;
	background-color: #f57f17;
	border-radius: 50%;
	display: inline-block;
	display: none;
	transition: opacity 1s;
}

span.col {
	flex-direction: column;
	display: inline-flex;
	justify-content: center;
	text-align: center;
	vertical-align: text-top;
}

sup,
sub {
	top: 0;
	bottom: 0;
	line-height: 1;
	font-size: .5em;
}

/*@media only screen and (min-width: 601px) and (max-width: 992px){
    main {
        max-width: 50%;
    }
}*/

@media only screen and (min-width: 993px) {

	main {
		max-width: 45% !important;
	}

	div.shrink-40 {
		max-width: 40% !important;
	}

	div.shrink-45 {
		max-width: 45% !important;
	}

	div.shrink-50 {
		max-width: 50% !important;
	}

	button.shrink {
		max-width: 40%;
	}
}

.overlay {
	display: inline-block;
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: transparent;
	background-size: 100% 100%;
	cursor: pointer;
}

:root {
	scroll-behavior: smooth;
}

/*
 *  
 *  Custom backgrounds and rounds for all types of textboxes.
 *
 */

.thicc {
	border-width: 2px !important;
	border-radius: 8px !important;
}

.common {
	background: linear-gradient(to bottom, rgba(255, 87, 34, 0.3) 10%, rgba(255, 87, 34, 0.31)) !important;
}

/*.post {
	background: linear-gradient(to bottom, rgba(158, 158, 158, 0.3) 10%, rgba(158, 158, 158, 0.31)) !important;
}*/

.reply {
	border-color: rgb(245, 127, 23, 1) !important;
	background: rgb(245, 127, 23, 1) !important;
	/*background: linear-gradient(to bottom, rgba(245, 127, 23, 0.3) 10%, rgba(245, 127, 23, 0.31)) !important;*/
}

.info {
	background: linear-gradient(to bottom, rgba(33, 150, 243, 0.3) 10%, rgba(33, 150, 243, 0.31)) !important;
}

.warn {
	background: linear-gradient(to bottom, rgba(255, 193, 7, 0.3) 10%, rgba(255, 193, 7, 0.31)) !important;
}

.danger {
	background: linear-gradient(to bottom, rgba(244, 67, 54, 0.3) 10%, rgba(244, 67, 54, 0.31)) !important;
}

/*
 *
 *  Flexbox
 *
 */

.post {
	text-align: left;
	width: 100%;
	border-bottom: 1px solid;
	padding-bottom: 1rem;
}

.post-feed {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 1rem;
}

.top-items {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

/*
 *
 *
 *
 *
 */

:root,
body.dark-blu {
	--primary: #2196f3;
	--on-primary: #001e3c;
	--primary-container: #003c69;
	--on-primary-container: #d1e4ff;
	--secondary: #a9bcd4;
	--on-secondary: #1e2a39;
	--secondary-container: #2f3c4b;
	--on-secondary-container: #d7e3f7;
	--tertiary: #c8a7d8;
	--on-tertiary: #2e1d3d;
	--tertiary-container: #46365a;
	--on-tertiary-container: #f2daff;
	--error: #ffb4ab;
	--on-error: #690005;
	--error-container: #93000a;
	--on-error-container: #ffb4ab;
	--background: #131519;
	--on-background: #d9dbe0;
	--surface: #0f1013;
	--on-surface: #d9dbe0;
	--surface-variant: #3a3e45;
	--on-surface-variant: #b7bbc4;
	--outline: #7b818b;
	--outline-variant: #3a3e45;
	--shadow: #000000;
	--scrim: #000000;
	--inverse-surface: #d9dbe0;
	--inverse-on-surface: #232529;
	--inverse-primary: #0061a4;
	--surface-dim: #0f1013;
	--surface-bright: #34363a;
	--surface-container-lowest: #0b0c0e;
	--surface-container-low: #131519;
	--surface-container: #17191c;
	--surface-container-high: #202225;
	--surface-container-highest: #2a2d31;
	--poll-opt1: #64b5f6;
	--poll-opt2: #1e88e5;
	--poll-opt3: #1565c0;
}

body.light-blu {
	--primary: #00497d;
	--on-primary: #ffffff;
	--primary-container: #0073b1;
	--on-primary-container: #ffffff;
	--secondary: #2f4858;
	--on-secondary: #ffffff;
	--secondary-container: #a8c9e8;
	--on-secondary-container: #09212e;
	--tertiary: #654f7a;
	--on-tertiary: #ffffff;
	--tertiary-container: #dac3eb;
	--on-tertiary-container: #2a1b40;
	--error: #ba1a1a;
	--on-error: #ffffff;
	--error-container: #ffb4a8;
	--on-error-container: #4f0005;
	--background: #f2f4f7;
	--on-background: #121416;
	--surface: #e8ebef;
	--on-surface: #121416;
	--surface-variant: #d0d6dd;
	--on-surface-variant: #32383f;
	--outline: #5d636b;
	--outline-variant: #a1a7b0;
	--shadow: #000000;
	--scrim: #000000;
	--inverse-surface: #2a2d30;
	--inverse-on-surface: #f1f1f4;
	--inverse-primary: #58a6da;
	--surface-dim: #d9dde2;
	--surface-bright: #eef1f5;
	--surface-container-lowest: #ffffff;
	--surface-container-low: #eef0f3;
	--surface-container: #e3e6eb;
	--surface-container-high: #dde1e5;
	--surface-container-highest: #d5d9de;
	--poll-opt1: #64b5f6;
	--poll-opt2: #1e88e5;
	--poll-opt3: #1565c0;
}

body.dark-orang {
	--primary: #ff5722;
	--on-primary: #000000;
	--primary-container: #ff6d3a;
	--on-primary-container: #1a0a05;
	--secondary: #e0bfb3;
	--on-secondary: #3a2925;
	--secondary-container: #6d5049;
	--on-secondary-container: #ffebe3;
	--tertiary: #ff9f5e;
	--on-tertiary: #3b1c00;
	--tertiary-container: #633b20;
	--on-tertiary-container: #ffdcc3;
	--error: #ffb4a8;
	--on-error: #4f0005;
	--error-container: #93000a;
	--on-error-container: #ffb4a8;
	--background: #131214;
	--on-background: #f3f2f3;
	--surface: #181617;
	--on-surface: #f0f0f0;
	--surface-variant: #5a4f52;
	--on-surface-variant: #d6cad0;
	--outline: #a3979b;
	--outline-variant: #5a4f52;
	--shadow: #000000;
	--scrim: #000000;
	--inverse-surface: #f0f0f0;
	--inverse-on-surface: #262425;
	--inverse-primary: #ff784e;
	--surface-dim: #131214;
	--surface-bright: #3b3739;
	--surface-container-lowest: #0e0d0e;
	--surface-container-low: #191718;
	--surface-container: #1d1b1d;
	--surface-container-high: #282628;
	--surface-container-highest: #323032;
	--poll-opt1: #ffab91;
	--poll-opt2: #ff7043;
	--poll-opt3: #d84315;
}

body.light-orang {
	--primary: #ff5722;
	--on-primary: #ffffff;
	--primary-container: #f0a07c;
	--on-primary-container: #4a1b10;
	--secondary: #756d78;
	--on-secondary: #ffffff;
	--secondary-container: #d6d0ca;
	--on-secondary-container: #2a2929;
	--tertiary: #a8655d;
	--on-tertiary: #ffffff;
	--tertiary-container: #e0b1a9;
	--on-tertiary-container: #442a26;
	--error: #ba1a1a;
	--on-error: #ffffff;
	--error-container: #ffdad6;
	--on-error-container: #410002;
	--background: #f9f6f3;
	--on-background: #2a2929;
	--surface: #ffffff;
	--on-surface: #2a2929;
	--surface-variant: #dfd9d3;
	--on-surface-variant: #5e5a5c;
	--outline: #857d79;
	--outline-variant: #cfc9c4;
	--shadow: #000000;
	--scrim: #000000;
	--inverse-surface: #333132;
	--inverse-on-surface: #f4f1ee;
	--inverse-primary: #ffb59d;
	--surface-dim: #ebe6e2;
	--surface-bright: #ffffff;
	--surface-container-lowest: #faf7f5;
	--surface-container-low: #f7f3f0;
	--surface-container: #f3efec;
	--surface-container-high: #ede9e6;
	--surface-container-highest: #e8e4e0;
	--poll-opt1: #ffab91;
	--poll-opt2: #ff7043;
	--poll-opt3: #d84315;
}

.poll-opt1 {
	background-color: var(--poll-opt1);
}

.poll-opt2 {
	background-color: var(--poll-opt2);
}

.poll-opt3 {
	background-color: var(--poll-opt3);
}