:root {
	--primary-theme-color: #15e991;
	--primary-theme-color-hover: #13bd76;
	--secondary-theme-color: #00f0ff;
}

body {
	background-color: #181818;
	scrollbar-width: thin;
	scrollbar-color: var(--primary-theme-color) #292929;
}

@supports not (scrollbar-color: auto) {
	html::-webkit-scrollbar,
	body::-webkit-scrollbar,
	html::-webkit-scrollbar-thumb,
	body::-webkit-scrollbar-thumb {
		background: var(--primary-theme-color);
	}

	html::-webkit-scrollbar-track,
	body::-webkit-scrollbar-track {
		background: #292929;
	}
}

a:link,
a:visited {
	transition: all .05s ease-in-out;
	text-decoration: none;
}

button, input, textarea, select {
	transition: all .05s ease-in-out;
}

body#index .mgw-link-index:link,
body#index .mgw-link-index:visited,
body#index .mgw-link-index > span {
	color: var(--primary-theme-color) !important;
	background-color: #383838;
}

body#users .mgw-link-users:link,
body#users .mgw-link-users:visited,
body#users .mgw-link-users > span {
	color: var(--primary-theme-color) !important;
	background-color: #383838;
}

body#search .mgw-link-search:link,
body#search .mgw-link-search:visited,
body#search .mgw-link-search > span {
	color: var(--primary-theme-color) !important;
	background-color: #383838;
}

/* HEADER */

.mgw-header {
	/** background-color: #121212; **/
	background-color: #292929;
	transition: all .1s ease-in-out;
	border: 1px solid transparent;
}

.mgw-header.scroll-detected {
	width: calc(100% - 1rem);
	margin-left: auto;
	margin-right: auto;
	top: 0.5rem;
	border-radius: 6px;
	border: 1px solid #3d3d3d;
	transition: all .1s ease-in-out;
}

.desktop-menu a:link,
.desktop-menu a:visited {
	color: #adadad;
	text-transform: uppercase;
	font-size: 1rem;
	font-weight: 500;
	line-height: normal;

	width: auto;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: start;
	border-radius: 4px;
}

.desktop-menu a > i {
	height: 32px;
	width: 32px;
	background-color: #383838;
}

.desktop-menu a > span {
	font-size: 0.9rem;
	color: #b1b1b1;
}

.desktop-menu a:hover,
.desktop-menu a:active {
	color: var(--primary-theme-color);
}

.desktop-menu a:hover > span, 
.desktop-menu a:active > span,
.desktop-menu a:focus-visible > span {
	color: var(--primary-theme-color);
}

.desktop-menu a:focus-visible {
	color: var(--primary-theme-color);
	outline: none;
}

.mgw-header-member {

}

.mgw-header-member a:link,
.mgw-header-member a:visited {
	text-transform: uppercase;
	font-size: 1rem;
	font-weight: 500;
	line-height: normal;
	color: #adadad;
}

.mgw-header-member a:hover,
.mgw-header-member a:active {
	color: var(--primary-theme-color);
}

.mgw-header-member a:focus-visible {
	outline: none;
	color: var(--primary-theme-color);
}

.mgw-header-member .mgw-header-user-pms-badge {
	background-color: var(--secondary-theme-color);
	color: #2b2b2b !important;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
	padding: 0 4px;
	height: 32px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.mgw-header-member .mgw-header-user-pms:link,
.mgw-header-member .mgw-header-user-pms:visited {
	background-color: #383838;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
}

.mgw-header-member .mgw-header-user-logout:link,
.mgw-header-member .mgw-header-user-logout:visited {
	color: #e57878;
	background-color: #383838;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px;
}

.mgw-header-member .mgw-header-user-logout:hover,
.mgw-header-member .mgw-header-user-logout:active {
	color: #c94545;
}

.mgw-header-member .mgw-header-user-logout:focus-visible {
	outline: none;
	color: #c94545;
}

.mgw-header-user,
.mgw-header-user-login:link,
.mgw-header-user-login:visited {
	color: #2b2b2b !important;
	text-transform: uppercase;
	font-size: 0.975rem;
	font-weight: 500;
	line-height: normal;
	padding: 0 0.5rem;
	border: 0;
	background-color: var(--primary-theme-color);
	border-radius: 4px;
}

.mgw-header-user:hover,
.mgw-header-user-login:hover,
.mgw-header-user-login:active {
	background-color: var(--primary-theme-color-hover);
}

.mgw-header-user:focus-visible,
.mgw-header-user-login:focus-visible {
	outline: 2px solid var(--primary-theme-color) !important;
	outline-offset: 3px;
	box-shadow: none;
}

.mgw-header-user-register:link,
.mgw-header-user-register:visited {
	background-color: #383838;
	border-radius: 4px;
	width: 32px;
	height: 32px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.mgw-header-user-register:focus-visible {
	outline: 2px solid var(--primary-theme-color) !important;
	outline-offset: 3px;
	box-shadow: none;
}

.mgw-header-user-drop {
	background-color: #121212;
}

.mgw-header-user-drop > nav > p {
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 0.85rem;
	color: #9f9f9f;
}

.mgw-header-user-drop > nav > p > span {
	font-size: 0.69rem;
	color: var(--secondary-theme-color);
}

.mgw-header-user-drop > nav > a:focus-visible {
	outline: none;
	color: var(--primary-theme-color-hover);
}

.mgw-header-as-account > img {
	height: auto;
	width: 25px;
}

.mgw-header-as-account > a:link > span,
.mgw-header-as-account > a:visited > span {
	color: #adadad !important;
	background-color: transparent;
}

.mgw-header-as-account > a:hover > span,
.mgw-header-as-account > a:active > span {
	color: var(--primary-theme-color) !important;
}

.mgw-header-as-account > a:focus-visible {
	outline: none;
}

.mgw-header-as-account > a:focus-visible > span {
	outline: none !important;
	color: var(--primary-theme-color) !important;
}

.mgw-main-event-card:link > div,
.mgw-main-event-card:visited > div {
	background-color: rgba(0,0,0, 0.4);
}

.mgw-main-event-card:hover > div,
.mgw-main-event-card:active > div,
.mgw-main-event-card:focus-visible > div {
	background-color: rgba(0,0,0, 0.6);
}

#mgw-main-event {
	background: url(https://i.imgur.com/ppH1RWI.jpeg) no-repeat center;
	background-size: cover;
}

/** NAVIGATION CANVAS **/
.mgw-navigation-canvas {
	background-color: #292929;
	border-color: transparent;
	border-top: 1px solid #393939;
	height: calc(100vh - 50px);
	width: 100%;
	max-width: 250px;
	z-index: 300;
}
/** END **/

.mgw-navigation {
	background-color: #292929;
	color: #686868;
}

.mgw-navigation a:link,
.mgw-navigation a:visited {
	color: var(--primary-theme-color);
}

.mgw-navigation a:hover,
.mgw-navigation a:active {
	color: var(--primary-theme-color-hover);
}

.mgw-navigation a:focus-visible {
	outline: none;
	color: var(--primary-theme-color-hover);
}

.mgw-navigation .active {
	color: #adadad;
}