/*
	Ravaio Theme Stylesheet Made by Gramziu
*/
body,
html {
  background-color: #F8F8F8;
  color: #5A5A5A;
}
select {
  background-color: transparent;
  border-color: #dfdfdf;
}
.background-deep select {
  border-color: #cdcdcd;
}
a,
a:visited {
  color: #5A5A5A;
}
a:hover {
  color: #4a5a4e;
}
a:active {
  color: #1f2821;
}
/*
	Structure styles
	Positioning overall page
*/
/*
	Global head styles
	Displayed on every page
*/
#wrap-header {
  background-color: #4a5a4e;
}
#wrap-header-index {
  background-color: transparent;
}
.is-sticky #wrap-header {
  background-color: #4a5a4e;
}
.is-sticky #wrap-header-index {
  background-color: #4a5a4e;
}
.site-header,
.site-header a,
.site-header span {
  color: #FAFAFA;
}
.site-header > i + span,
.site-header a > i + span,
.site-header span > i + span {
  color: inherit;
}
.site-header a:hover,
.site-header span:hover {
  color: #757575;
}
.site-header a:active,
.site-header span:active {
  color: #757575;
}
#breadcrumbs li:before {
  color: rgba(0, 0, 0, 0.24);
}
.site-nav .count {
  background-color: #758d3e;
  color: #FAFAFA;
}
#header-avatar > span {
  background-color: rgba(0, 0, 0, 0.3);
  color: #FAFAFA !important;
}
#header-avatar:hover > span {
  background-color: #ededed;
  color: #5A5A5A !important;
}
#header-avatar:active > span {
  background-color: #ededed;
  color: #5A5A5A !important;
}
.open #header-avatar > span {
  background-color: #ededed;
  color: #5A5A5A !important;
}
#header-avatar img {
  border-color: rgba(0, 0, 0, 0.24);
}
#header-avatar:hover img {
  border-color: #dfdfdf;
}
#header-avatar:active img {
  border-color: #757575;
}
.open #header-avatar img {
  border-color: #757575;
}
#header-mini-menu {
  background-color: rgba(0, 0, 0, 0.24);
  color: #FAFAFA;
}
#header-mini-menu:hover {
  background-color: #ededed;
  color: #5A5A5A !important;
}
#header-mini-menu:active {
  background-color: #ededed;
  color: #5A5A5A !important;
}
.open > #header-mini-menu {
  background-color: #ededed;
  color: #5A5A5A !important;
}
/*
	Global foot styles
	Displayed on every page
*/
#wrap-footer {
  background-color: #1f2821;
  color: #757575;
}
#wrap-footer a,
#wrap-footer a:visited {
  color: #FAFAFA;
}
#wrap-footer a:hover {
  color: #757575;
}
#wrap-footer a:active {
  color: #757575;
}
/*
	Main containers
*/
.background-main .box-normal {
  background-color: #FFFFFF;
  border-color: #E6E6E6;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.03);
  color: #5A5A5A;
}
.background-main .box-normal .strong-head {
  border-color: rgba(0, 0, 0, 0.06);
}
.background-deep .box-normal {
  background-color: #fafafa;
  border-color: #dfdfdf;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.03);
  color: #5A5A5A;
}
.background-deep .box-normal .strong-head {
  border-color: rgba(0, 0, 0, 0.06);
}
.info-box {
  background-color: rgba(0, 0, 0, 0.12);
  color: rgba(0, 0, 0, 0.3);
}
#information {
  background-color: #8B0000;
  color: #FAFAFA;
}
#site-desc-full,
#site-desc-small {
  background-color: #1f2821;
}
#site-desc-full h1,
#site-desc-small h1 {
  color: #FAFAFA;
}
#site-desc-full h2,
#site-desc-small h2 {
  color: #FAFAFA;
}
#sub-header {
  background-color: #1f2821;
}
#sub-header.sub-header-small {
  background-color: transparent;
}
.sub-header-title {
  color: #FAFAFA;
}
.sub-header-title a,
.sub-header-title a:visited {
  color: #FAFAFA;
}
.sub-header-title a:hover {
  color: #757575;
}
.sub-header-title a:active {
  color: #757575;
}
.sub-header-title p {
  color: #757575;
}
.sub-header-small .sub-header-title {
  color: #5A5A5A;
}
.sub-header-small .sub-header-title a,
.sub-header-small .sub-header-title a:visited {
  color: #5A5A5A;
}
.sub-header-small .sub-header-title a:hover {
  color: #4a5a4e;
}
.sub-header-small .sub-header-title a:active {
  color: #1f2821;
}
.sub-header-small .sub-header-title p {
  color: #5A5A5A;
}
.sub-header-buttons .button-round {
  color: #FAFAFA;
}
.sub-header-buttons .button-round:hover {
  background-color: rgba(255, 255, 255, 0.1);
  color: #FAFAFA;
}
.sub-header-buttons .button-round:active {
  background-color: rgba(0, 0, 0, 0.1);
  color: #FAFAFA;
}
.sub-header-buttons .open > .button-round {
  background-color: rgba(0, 0, 0, 0.1) !important;
  color: #FAFAFA !important;
}
.sub-header-buttons .chosen-single {
  color: #FAFAFA;
}
.sub-header-buttons .chosen-single:hover,
.sub-header-buttons .chosen-single:active {
  color: #FAFAFA;
}
.sub-header-small .sub-header-buttons .button-round {
  color: #5A5A5A;
}
.sub-header-small .sub-header-buttons .button-round:hover {
  color: #5A5A5A;
}
.sub-header-small .sub-header-buttons .button-round:active {
  color: #5A5A5A;
}
.sub-header-small .sub-header-buttons .open > .button-round {
  color: #5A5A5A !important;
}
.sub-header-small .sub-header-buttons .chosen-single {
  color: #5A5A5A;
}
.sub-header-small .sub-header-buttons .chosen-single:hover,
.sub-header-small .sub-header-buttons .chosen-single:active {
  color: #5A5A5A;
}
#main-search-box-md input,
#main-search-box-md button {
  background-color: #ededed;
}
.sidebar-block {
  background-color: #FFFFFF;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.03);
  border-color: #E6E6E6;
}
.dropdown-search {
  background-color: #FFFFFF;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.18), 0 1px 1px rgba(0, 0, 0, 0.06);
}
.dropdown-search input,
.dropdown-search button {
  background-color: #ededed;
  color: #5A5A5A;
}
.action-bar-top {
  border-bottom-color: #E6E6E6;
}
.action-bar-bottom {
  border-top-color: #E6E6E6;
}
.pagination li a:hover,
.pagination li span:hover {
  background-color: #FFFFFF;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.42);
  color: #5A5A5A;
}
.pagination li a:active,
.pagination li span:active {
  background-color: #ededed;
  box-shadow: none;
  color: #5A5A5A;
}
.pagination .ellipsis span:hover {
  background-color: transparent;
  box-shadow: none;
}
.pagination .ellipsis span:active {
  background-color: transparent;
}
.pagination .active span {
  background-color: #ededed;
}
.pagination .active span:hover {
  background-color: #ededed;
  box-shadow: none;
}
.pagination-small li a,
.pagination-small li span {
  border-color: #E6E6E6;
}
.member-search {
  background-color: #3a4a3e;
}
.member-search a {
  color: #FAFAFA;
}
.member-search a:visited {
  color: #FAFAFA;
}
.search-box input {
  border-color: #3a4a3e;
}
.search-box input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.18);
}
.search-box input:hover {
  border-color: #4a5a4e;
}
.search-box input:focus {
  border-color: #4a5a4e;
}
.search-box input,
.search-box button {
  background-color: transparent;
  color: #FAFAFA;
}
.fora-bg,
.forum-bg {
  border-color: #E6E6E6;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.03);
}
/* Section headings (Community Forums, etc.) - changed from h3 to h2 for accessibility */
.fora-bg h2,
.forum-bg h2 {
  background-color: #3a4a3e;
  color: #FAFAFA;
  border-radius: 2px 2px 0 0;
  display: block;
  font-size: 1.3em;
  font-weight: 600;
  line-height: 1.6154;
  padding: 10px 18px 12px;
}
.fora-bg h2 a,
.forum-bg h2 a {
  color: #FAFAFA;
}
.fora-bg h2 a:hover,
.forum-bg h2 a:hover {
  color: #757575;
}
.fora-bg h2 a:active,
.forum-bg h2 a:active {
  color: #1f2821;
}
/* Forum titles (The Lounge, etc.) - changed from h4 to h3 for accessibility */
/* Reset h3 padding/margins and make inline to match original h4 behavior */
.fora-bg h3,
.forum-bg h3 {
  display: inline-block;
  font-size: 1em;
  font-weight: 600;
  margin: 0;
  margin-right: 6px;
  padding: 0;
  max-width: 100%;
  word-wrap: break-word;
  border-radius: 0;
}
.fora-bg h3,
.forum-bg h3,
.fora-bg h3 a,
.forum-bg h3 a {
  color: #5A5A5A;
}
.fora-bg h3 a:hover,
.forum-bg h3 a:hover {
  color: #4a5a4e;
}
.fora-bg h3 a:active,
.forum-bg h3 a:active {
  color: #1f2821;
}
.fora-bg li,
.forum-bg li {
  background-color: #FFFFFF;
}
.fora-bg dfn,
.forum-bg dfn {
  color: #757575;
}
.fora-bg li:after {
  background-color: #E6E6E6;
}
.fora-icon,
.topic-icon {
  color: #999999;
}
.fora-icon div,
.topic-icon div {
  background-color: transparent;
}
.fora-bg li:hover .fora-icon {
  color: #FAFAFA;
}
.fora-bg li:hover .fora-icon div {
  background-color: #4a5a4e;
}
.fora-bg li:hover .fora-icon a,
.fora-bg li:hover .fora-icon i {
  color: #FAFAFA !important;
}
.fora-icon:hover,
.fora-icon:hover a,
.fora-icon:hover i {
  color: #FAFAFA !important;
}
.fora-icon:hover div {
  background-color: #4a5a4e !important;
}
.fora-icon a:hover,
.fora-icon a:hover i {
  color: #FAFAFA !important;
}
.feed-icon {
  color: #757575;
}
.feed-icon:visited {
  color: #757575;
}
.feed-icon:hover,
.feed-icon:active {
  color: #FF9800;
}
.forum_unread,
.forum_unread_locked,
.forum_unread_subforum {
  color: #3a4a3e;
}
.forum_unread i,
.forum_unread_locked i,
.forum_unread_subforum i {
  color: #3a4a3e !important;
}
.unread > div,
.forum_unread > div,
.forum_unread_locked > div,
.forum_unread_subforum > div {
  background-color: transparent;
}
.subforum.unread i {
  color: #3e5f41;
}
.subforum.unread:hover i {
  color: inherit;
}
.fora-stats-sm {
  color: #757575;
}
.subforums-list:after {
  color: #757575;
}
.fora-unapproved-icon {
  color: #FF9800;
}
.fora-unapproved-icon:visited {
  color: #FF9800;
}
.fora-unapproved-icon:hover {
  color: #4a5a4e;
}
.fora-unapproved-icon:active {
  color: #1f2821;
}
.forum-bg ol > li + li {
  border-color: rgba(0, 0, 0, 0.05);
}
.forum-bg .reported {
  background-color: rgba(255, 100, 100, 0.3);
}
.forum-bg .reported dfn {
  color: #AE8E8E;
}
.forum-bg .reported .pagination-small li a,
.forum-bg .reported .pagination-small li span {
  border-color: #AD9898;
}
.forum-bg .deleted {
  background-color: #fafafa;
}
.forum-bg .deleted:hover {
  background-color: #FFFFFF;
}
.pagination-small li {
  background-color: transparent;
}
.topic-description-inner p i {
  color: #757575;
}
.topic-stats-sm {
  color: #757575;
}
.topic-unapproved-icon {
  color: #FF9800;
}
.topic-deleted-icon {
  color: #009688;
}
.topic-reported-icon {
  color: #8B0000;
}
.forum-bg li:hover .topic-icon {
  color: #FAFAFA;
}
.forum-bg li:hover .topic-icon div {
  background-color: #4a5a4e;
}
.topic_unread,
.topic_unread_mine,
.topic_unread_locked,
.topic_unread_locked_mine,
.topic_unread_hot,
.topic_unread_hot_mine,
.sticky_unread,
.sticky_unread_locked,
.sticky_unread_locked_mine,
.sticky_unread_mine,
.announce_unread,
.announce_unread_locked,
.announce_unread_locked_mine,
.announce_unread_mine,
.global_unread,
.global_unread_locked,
.global_unread_locked_mine,
.global_unread_mine {
  color: #3a4a3e;
}
.topic_unread i,
.topic_unread_mine i,
.topic_unread_locked i,
.topic_unread_locked_mine i,
.topic_unread_hot i,
.topic_unread_hot_mine i,
.sticky_unread i,
.sticky_unread_locked i,
.sticky_unread_locked_mine i,
.sticky_unread_mine i,
.announce_unread i,
.announce_unread_locked i,
.announce_unread_locked_mine i,
.announce_unread_mine i,
.global_unread i,
.global_unread_locked i,
.global_unread_locked_mine i,
.global_unread_mine i {
  color: #3a4a3e !important;
}
.topic_unread div,
.topic_unread_mine div,
.topic_unread_locked div,
.topic_unread_locked_mine div,
.topic_unread_hot div,
.topic_unread_hot_mine div,
.sticky_unread div,
.sticky_unread_locked div,
.sticky_unread_locked_mine div,
.sticky_unread_mine div,
.announce_unread div,
.announce_unread_locked div,
.announce_unread_locked_mine div,
.announce_unread_mine div,
.global_unread div,
.global_unread_locked div,
.global_unread_locked_mine div,
.global_unread_mine div {
  background-color: transparent;
}
.forum-bg li:hover .topic-icon a,
.forum-bg li:hover .topic-icon i {
  color: #FAFAFA !important;
}
.topic-icon:hover,
.topic-icon:hover a,
.topic-icon:hover i {
  color: #FAFAFA !important;
}
.topic-icon:hover div {
  background-color: #4a5a4e !important;
}
.topic-icon a:hover,
.topic-icon a:hover i {
  color: #FAFAFA !important;
}
.posts-unread:after {
  background-color: #E6E6E6;
}
.posts-unread span {
  background-color: #8B0000;
  color: #FAFAFA;
}
.post-unread {
  background-color: #8B0000;
}
.postbody {
  background-color: #FFFFFF;
  border-color: #E6E6E6;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.03);
}
.reported .postbody {
  border-color: rgba(255, 100, 100, 0.3);
}
.unapproved .postbody {
  border-color: rgba(255, 100, 0, 0.3);
}
.post-deleted-notice input,
.post-unapproved-notice input {
  background-color: #ededed;
  color: #5A5A5A;
}
.post-reported-notice {
  background-color: rgba(255, 100, 100, 0.3);
}
.post-reported-notice:hover {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.42);
  color: #5A5A5A;
}
.file {
  background-color: #fafafa;
  border-color: #cdcdcd;
  color: #5A5A5A;
}
.file:hover {
  background-color: #ededed;
  color: #5A5A5A;
}
.file-downloads,
.file-size {
  color: #757575;
}
.attachbox-head {
  border-color: #E6E6E6;
}
.attachbox-head i {
  color: #757575;
}
.background-deep .attachbox {
  background-color: #ededed;
  border-color: #cdcdcd;
}
.file-progress {
  background-color: #ededed;
}
.file-progress-bar {
  background-color: #4a5a4e;
}
.file-i-uploaded {
  color: #4CAF50;
}
.file-i-uploading {
  color: #4a5a4e;
}
.attach-preview {
  background-color: #ededed;
}
.poster-online {
  background-color: #388E3C;
  border-color: #FFFFFF;
}
.dropdown-profile {
  background-color: #FFFFFF;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.18), 0 1px 1px rgba(0, 0, 0, 0.06);
}
.dropdown-profile .profile-contact {
  background-color: #fafafa;
  border-color: #E6E6E6;
}
.member-online {
  color: #4CAF50;
}
.post-number {
  color: #757575;
}
.post-number:visited {
  color: #757575;
}
.post-number:hover {
  color: #4a5a4e;
}
.post-number:active {
  color: #1f2821;
}
.post-signature {
  border-color: #E6E6E6;
}
.post-actions {
  background-color: #fafafa;
  border-color: #E6E6E6;
}
.post-actions i {
  color: #757575;
}
.post-actions a:hover i {
  color: #4a5a4e;
}
.post-date {
  color: #757575;
}
.post-date:hover {
  color: #4a5a4e;
}
.post-date a {
  color: #757575;
}
.post-date a:visited {
  color: #757575;
}
.post-date a:hover {
  color: #4a5a4e;
}
.post-date a:active {
  color: #1f2821;
}
.avatar-none {
  background-color: #ededed;
  color: #757575;
}
.avatar-none .username-coloured {
  color: #757575 !important;
}
.avatar-none .username-coloured:hover,
.avatar-none .username-coloured:active {
  color: #757575 !important;
}
.preview-signature {
  background-color: #FFFFFF;
  border-color: #E6E6E6;
}
.dropdown-mega {
  background-color: #FFFFFF;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.18), 0 1px 1px rgba(0, 0, 0, 0.06);
}
.dropdown-mega,
.dropdown-mega a {
  color: #5A5A5A;
}
.dropdown-box {
  background-color: #FFFFFF;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.18), 0 1px 1px rgba(0, 0, 0, 0.06);
}
.dropdown-box .separator {
  border-color: #E6E6E6;
}
.dropdown-box > li > .dropdown-box {
  background-color: rgba(0, 0, 0, 0.1);
}
.dropdown-box > li .open {
  background-color: rgba(0, 0, 0, 0.05);
}
.dropdown-box,
.dropdown-box a,
.dropdown-box span {
  color: #5A5A5A;
}
.dropdown-box a:hover {
  background-color: #ededed;
  color: #5A5A5A;
}
.dropdown-box a:hover span {
  color: #5A5A5A;
}
.dropdown-box a:active {
  background-color: #ededed;
  color: #5A5A5A;
}
.dropdown-box a:active span {
  color: #5A5A5A;
}
.dropdown-box-big {
  background-color: #FFFFFF;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.18), 0 1px 1px rgba(0, 0, 0, 0.06);
}
.dropdown-body,
.dropdown-body a {
  color: #5A5A5A;
}
.dropdown-body a:hover {
  background-color: #ededed;
  color: #5A5A5A;
}
.dropdown-body a:active {
  background-color: #ededed;
  color: #5A5A5A;
}
.dropdown-header {
  background-color: #ededed;
  color: #5A5A5A;
}
.dropdown-header a {
  color: #5A5A5A;
}
.dropdown-header a:hover {
  color: #4a5a4e;
}
.dropdown-header a:active {
  color: #757575;
}
.dropdown-body li {
  border-color: #E6E6E6;
}
.dropdown-body .notification-title .username,
.dropdown-body .notification-title .username-coloured {
  color: #5A5A5A !important;
}
.dropdown-body .notification-time {
  color: #757575;
}
.dropdown-body .notification-mark {
  background-color: #4a5a4e;
  color: #FAFAFA;
}
.dropdown-body .notification-mark:hover {
  background-color: #4a5a4e;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.42);
  color: #FAFAFA;
}
.dropdown-body .notification-mark:active {
  background-color: #2e3831;
  box-shadow: none;
  color: #FAFAFA;
}
.dropdown-body .chosen-drop {
  background-color: transparent;
  box-shadow: none;
}
.dropdown-body select {
  background-color: transparent;
}
.dropdown-footer a,
.dropdown-footer input {
  background-color: #ededed;
  color: #5A5A5A;
}
.dropdown-footer a:hover,
.dropdown-footer input:hover {
  background-color: #4a5a4e;
  color: #FAFAFA;
}
.dropdown-footer a:active,
.dropdown-footer input:active,
.dropdown-footer a:focus,
.dropdown-footer input:focus {
  background-color: #3a4a3e;
  color: #FAFAFA;
}
.live-search .search-result {
  color: #5A5A5A;
}
.live-search .search-result:hover {
  background-color: #ededed;
  color: #5A5A5A;
}
.live-search .search-result:active {
  background-color: #1f2821;
  color: #757575;
}
.input {
  background-color: transparent;
  border-color: #dfdfdf;
  color: #5A5A5A;
}
.background-deep .input {
  border-color: #cdcdcd;
}
.input:hover {
  border-color: #4a5a4e;
}
.input:focus {
  border-color: #2e3831;
  outline: 2px solid #4a5a4e;
  outline-offset: 2px;
}
#quick-login input:-webkit-autofill,
#quick-login input:-webkit-autofill:hover,
#quick-login input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0px 1000px #ffffff inset;
  box-shadow: 0 0 0px 1000px #ffffff inset;
  -webkit-text-fill-color: #5A5A5A;
}
.background-main input:-webkit-autofill,
.background-main input:-webkit-autofill:hover,
.background-main input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0px 1000px #F8F8F8 inset;
  box-shadow: 0 0 0px 1000px #F8F8F8 inset;
  -webkit-text-fill-color: #5A5A5A;
}
input:invalid {
  border-color: #FF0000 !important;
  box-shadow: 0 2px 0 #FF0000;
  outline: 2px solid #FF0000;
  outline-offset: 2px;
}
span.radio {
  background-color: transparent;
  border-color: #3a4a3e;
}
input.radio:checked + span.radio {
  background-color: #3a4a3e;
}
label:hover > span.radio {
  border-color: #4a5a4e;
}
label:hover > input.radio:checked + span.radio {
  background-color: #4a5a4e;
  border-color: #4a5a4e;
}
label:active > span.radio {
  background-color: #3a4a3e !important;
  border-color: #3a4a3e !important;
}
input.radio:disabled + span.radio,
label:active > input.radio:disabled + span.radio {
  background-color: transparent !important;
  border-color: #757575 !important;
}
span.radio-full {
  background-color: transparent;
}
span.radio-full:hover {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.42);
}
span.radio-full:active {
  background-color: #ededed;
  box-shadow: none;
}
input.radio-full:checked + span.radio-full {
  background-color: #ededed;
  box-shadow: none;
}
span.check {
  background-color: transparent;
  border-color: #3a4a3e;
}
span.check:after {
  color: #FAFAFA;
}
input.check:checked + span.check {
  background-color: #3a4a3e;
}
label:hover > span.check {
  border-color: #4a5a4e;
}
label:hover > input.check:checked + span.check {
  background-color: #4a5a4e;
  border-color: #4a5a4e;
}
label:active > span.check {
  background-color: #3a4a3e !important;
  border-color: #3a4a3e !important;
}
.button,
a.button {
  background-color: #4a5a4e;
  color: #FAFAFA;
}
.button:hover,
a.button:hover {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.42);
}
.button:focus,
.button:active,
a.button:active {
  background-color: #2e3831;
  box-shadow: none;
}
.open > .button {
  background-color: #2e3831 !important;
  box-shadow: none !important;
}
.button-flat,
a.button-flat {
  background-color: transparent;
  color: #5A5A5A;
}
.button-flat:hover,
a.button-flat:hover {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.42);
}
.button-flat:focus,
.button-flat:active,
a.button-flat:active {
  background-color: #ededed;
  box-shadow: none;
}
.button-round,
a.button-round {
  background-color: transparent;
  color: #5A5A5A;
}
.button-round:hover,
a.button-round:hover {
  background-color: #FFFFFF;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.42);
}
.button-round:focus,
.button-round:active,
a.button-round:active {
  background-color: #ededed;
  box-shadow: none;
}
.open > .button-round {
  background-color: #ededed !important;
  box-shadow: none !important;
}
.button-multiple a {
  background-color: #4a5a4e;
  color: #FAFAFA;
}
.button-multiple a:hover {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.42);
}
.button-multiple a:active {
  background-color: #2e3831;
  box-shadow: none;
}
.footer-text a {
  color: #757575 !important;
}
.footer-text a:hover {
  color: #FAFAFA !important;
}
.statistics,
.member-statistics {
  border-color: rgba(0, 0, 0, 0.18);
}
.birthdays:before {
  color: rgba(0, 0, 0, 0.06);
}
.username:hover,
.username-coloured:hover {
  color: #4a5a4e !important;
}
.username:active,
.username-coloured:active {
  color: #1f2821 !important;
}
.rc-posts-out {
  background-color: rgba(0, 0, 0, 0.18);
}
.rc-title,
.rc-content {
  color: #FAFAFA;
}
.rc-details {
  border-color: rgba(0, 0, 0, 0.24);
}
#wrap-footer .rc-details a {
  color: #757575;
}
#wrap-footer .rc-details a:visited {
  color: #757575;
}
#wrap-footer .rc-details a:hover {
  color: #FAFAFA;
}
.rc-details,
.rc-time,
.rc-author {
  color: #757575;
}
.rc-hr {
  border-color: rgba(0, 0, 0, 0.24);
}
.quickreply-box {
  background-color: #FFFFFF;
  border-color: #E6E6E6;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.03);
}
.quickreply-box textarea {
  background-color: transparent;
  color: #5A5A5A;
}
.quickreply-buttons {
  background-color: #fafafa;
  border-color: #E6E6E6;
}
.quickreply-buttons button {
  background-color: transparent;
  color: #5A5A5A;
  display: inline-block;
}
.quickreply-buttons button:hover {
  color: #4a5a4e;
}
.dimmed {
  color: #666666;
}
/*
	In post containers
*/
blockquote {
  background-color: #f4f7f1;
  border-color: #758d3e;
}
blockquote > i {
  color: #758d3e;
}
blockquote cite {
  border-color: #c5d4b0;
  color: #4a5a4e;
  font-style: normal;
  font-weight: 600;
}
.codebox {
  background-color: #fafafa;
  border-color: #E6E6E6;
}
.codebox p {
  border-color: #E6E6E6;
}
.codebox p i {
  color: #757575;
}
blockquote blockquote,
blockquote .codebox,
.codebox blockquote,
.codebox .codebox,
blockquote blockquote blockquote blockquote,
blockquote blockquote blockquote .codebox,
blockquote blockquote .codebox blockquote,
blockquote blockquote .codebox .codebox,
blockquote .codebox blockquote blockquote,
blockquote .codebox blockquote .codebox,
blockquote .codebox .codebox blockquote,
blockquote .codebox .codebox .codebox,
.codebox blockquote blockquote blockquote,
.codebox blockquote blockquote .codebox,
.codebox blockquote .codebox blockquote,
.codebox blockquote .codebox .codebox,
.codebox .codebox blockquote blockquote,
.codebox .codebox blockquote .codebox,
.codebox .codebox .codebox blockquote,
.codebox .codebox .codebox .codebox {
  background-color: #FFFFFF;
}
blockquote blockquote blockquote,
blockquote blockquote .codebox,
blockquote .codebox blockquote,
blockquote .codebox .codebox,
.codebox blockquote blockquote,
.codebox blockquote .codebox,
.codebox .codebox blockquote,
.codebox .codebox .codebox {
  background-color: #fafafa;
}
.post-content {
  border-color: #E6E6E6;
}
.posthilit {
  background-color: #4a5a4e;
  color: #FAFAFA;
}
.details dt {
  color: #757575;
}
.faq dt {
  color: #757575;
}
.form dt span {
  color: #5A5A5A;
}
.form dt p {
  color: #757575;
}
/*
	Poll container
*/
.poll-option-title span.votes {
  color: #757575;
}
.poll-option-resultbar {
  background-color: rgba(0, 0, 0, 0.03);
}
.poll-option-resultbar div {
  background-color: #4a5a4e;
}
/*
	Predefined content containers
*/
.background-main,
.background-normal {
  background-color: #F8F8F8;
}
.background-deep {
  background-color: #ebebeb;
}
.background-normal,
.background-deep {
  color: #4a4a4a;
}
.background-normal h3,
.background-deep h3,
.background-normal h3 a,
.background-deep h3 a {
  color: #5A5A5A;
}
.background-normal h3 a:hover,
.background-deep h3 a:hover {
  color: #4a5a4e;
}
.background-normal h3 a:active,
.background-deep h3 a:active {
  color: #1f2821;
}
.important-box {
  background-color: #FFFFFF;
  border-color: #FFC3C3;
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.1);
}
.important-box-link a {
  background-color: #FFFFFF;
  border-color: #FFC3C3;
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.1);
  color: #5A5A5A;
}
.important-box-link a:hover {
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
  color: #5A5A5A;
}
.important-box-link a:active {
  background-color: #ededed;
  border-color: #E6E6E6;
  box-shadow: none;
  color: #5A5A5A;
}
.modal-content {
  background-color: #FFFFFF;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.13);
}
.modal-body .w-input {
  color: #757575;
}
.modal-backdrop {
  background-color: rgba(48, 89, 122, 0.6);
}
.modal-close,
.modal-bb-close {
  background-color: transparent;
  color: #5A5A5A;
}
.error {
  color: #8B0000;
}
.notification-unread {
  background-color: #8B0000;
}
/*
	Styles for phpBB alert and confirm modal
*/
#darkenwrapper {
  background-color: rgba(48, 89, 122, 0.6);
}
.modal-bb-content {
  background-color: #FFFFFF;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.13);
}
/*
	Styling replaced select boxes
*/
.chosen-single {
  border-bottom-color: #dfdfdf;
  color: #5A5A5A;
}
.background-deep .chosen-single {
  border-color: #cdcdcd;
}
.chosen-single:hover {
  border-bottom-color: #4a5a4e;
  color: #5A5A5A;
}
.chosen-single:focus {
  border-color: #2e3831;
  color: #5A5A5A;
}
.chosen-choices:hover input {
  border-bottom-color: #4a5a4e;
  color: #5A5A5A;
}
.chosen-choices:focus input {
  border-color: #2e3831;
  color: #5A5A5A;
}
.search-field input {
  background-color: transparent;
  border-bottom-color: #dfdfdf;
  color: #5A5A5A;
}
.search-field input:hover {
  border-bottom-color: #4a5a4e;
  color: #5A5A5A;
}
.search-field input:focus {
  border-color: #2e3831;
  color: #5A5A5A;
}
.background-deep .search-field input {
  border-bottom-color: #cdcdcd;
}
.search-choice {
  background-color: #3a4a3e;
  color: #FAFAFA;
}
.search-choice-close {
  color: #FAFAFA;
}
.chosen-drop {
  background-color: #FFFFFF;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.18), 0 1px 1px rgba(0, 0, 0, 0.06);
}
.chosen-drop {
  color: #5A5A5A;
}
.chosen-drop li {
  color: #5A5A5A;
}
.chosen-drop li:hover {
  background-color: #ededed;
  color: #5A5A5A;
}
.chosen-drop li:active {
  background-color: #ededed;
  color: #5A5A5A;
}
.chosen-drop li.result-selected {
  color: #757575;
}
.chosen-drop li.result-selected:hover,
.chosen-drop li.result-selected:active {
  color: #757575;
  background-color: transparent;
}
.chosen-search input {
  background-color: #ededed;
  color: #5A5A5A;
}
.group-result,
.group-result:hover,
.group-result:active {
  background-color: #ededed !important;
  color: #5A5A5A !important;
}
.file-total-progress {
  background-color: transparent;
}
.file-total-progress-bar {
  background-color: #4a5a4e;
}
/*
	Posting tools
*/
#message-box {
  background-color: #FFFFFF;
  border-color: #E6E6E6;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.03);
}
#message-wrap:after {
  color: #FAFAFA;
}
#message-wrap:before {
  background-color: #1f2821;
}
#format-buttons {
  background-color: #fafafa;
  border-color: #E6E6E6;
}
#format-buttons input,
#format-buttons button,
#format-buttons .chosen-single,
#format-buttons .smilies-button > span {
  background-color: transparent;
  color: #5A5A5A;
}
#format-buttons input:hover,
#format-buttons button:hover,
#format-buttons .chosen-single:hover,
#format-buttons .smilies-button > span:hover {
  background-color: #4a5a4e;
  color: #FAFAFA;
}
#format-buttons .spacer {
  background-color: #dfdfdf;
}
.smilies-box {
  background-color: #FFFFFF;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.18), 0 1px 1px rgba(0, 0, 0, 0.06);
}
/*
	User Control Panel styles
*/
#side-toggle {
  background-color: #4a5a4e;
}
#cp-menu > ul {
  background-color: #FFFFFF;
  border-color: #E6E6E6;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.03);
}
#cp-menu a {
  color: #5A5A5A;
}
#cp-menu a:hover {
  background-color: #ededed;
}
#cp-menu #active-subsection > a {
  background-color: #ededed;
}
.cp-sidebar-block {
  background-color: #FFFFFF;
  border-color: #E6E6E6;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.03);
}
.cp-sidebar-block button {
  background-color: transparent;
  color: #4CAF50;
}
.pm-legend.pm_message_reported_colour:before {
  background-color: #FF9800;
}
.pm-legend.pm_marked_colour:before {
  background-color: #1976D2;
}
.pm-legend.pm_replied_colour:before {
  background-color: #616161;
}
.pm-legend.pm_friend_colour:before {
  background-color: #388E3C;
}
.pm-legend.pm_foe_colour:before {
  background-color: #8B0000;
}
.cp-rec-list button {
  background-color: transparent;
  color: #8B0000;
}
.cp-list {
  border-color: #E6E6E6;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.03);
}
.cp-list h3 {
  background-color: #3a4a3e;
  color: #FAFAFA;
}
.cp-list h3 a {
  color: #FAFAFA;
}
.cp-list h3 a:hover {
  color: #757575;
}
.cp-list h3 a:active {
  color: #1f2821;
}
.cp-list h4,
.cp-list h4 a {
  color: #5A5A5A;
}
.cp-list h4 a:hover {
  color: #4a5a4e;
}
.cp-list h4 a:active {
  color: #1f2821;
}
.cp-list li {
  background-color: #FFFFFF;
}
.cp-list li + li {
  border-color: #E6E6E6;
}
.cp-list dfn {
  color: #757575;
}
.cp-list li:hover .cp-list-icon {
  color: #FAFAFA;
}
.cp-list li:hover .cp-list-icon div {
  background-color: #4a5a4e;
}
label.cp-list-mark {
  background-color: #4a5a4e;
  color: #FAFAFA;
}
label.cp-list-mark:active {
  background-color: #3a4a3e;
}
input.cp-list-mark:checked + label.cp-list-mark {
  background-color: #3a4a3e;
}
.pm_unread {
  color: #FAFAFA;
}
.pm_unread div {
  background-color: #8B0000;
}
.pm_message_reported_colour .cp-list-icon,
.pm_marked_colour .cp-list-icon,
.pm_replied_colour .cp-list-icon,
.pm_friend_colour .cp-list-icon,
.pm_foe_colour .cp-list-icon {
  color: #FAFAFA;
}
.pm_message_reported_colour .cp-list-icon div {
  background-color: #FF9800;
}
.pm_marked_colour .cp-list-icon div {
  background-color: #1976D2;
}
.pm_replied_colour .cp-list-icon div {
  background-color: #616161;
}
.pm_friend_colour .cp-list-icon div {
  background-color: #388E3C;
}
.pm_foe_colour .cp-list-icon div {
  background-color: #8B0000;
}
.cp-list li:hover .pm_unread div {
  background-color: #8B0000;
}
.pm-quota-bar div {
  background-color: #1976d2;
}
ol.def-rules li {
  border-color: #E6E6E6;
}
.table {
  border-color: #E6E6E6;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.03);
}
.table th {
  background-color: #3a4a3e;
  color: #FAFAFA;
}
.table th a {
  color: #FAFAFA;
}
.table th a:hover {
  color: #757575;
}
.table th a:active {
  color: #1f2821;
}
.table tr + tr {
  border-color: #E6E6E6;
}
.table td {
  background-color: #FFFFFF;
}
.table .table-group td {
  background-color: #ededed;
}
/*
	Simple tooltip
*/
[data-tooltip]:after {
  color: #FFF;
  background-color: rgba(0, 0, 0, 0.75);
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.18), 0 1px 1px rgba(0, 0, 0, 0.06);
}
@media (max-width: 700px) {
  .site-nav > li:after,
  .site-nav-item:after {
    background-color: rgba(48, 89, 122, 0.6);
  }
  #more-menu .dropdown-search,
  #more-menu .dropdown-box-big,
  #more-menu .dropdown-mega {
    background-color: rgba(0, 0, 0, 0.1);
  }
  #more-menu .open {
    background-color: rgba(0, 0, 0, 0.05);
  }
  .fora-description-inner p {
    color: #757575;
  }
}
#back-to-top {
  background-color: #4a5a4e;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.42);
  color: #FAFAFA;
}
#back-to-top:hover {
  box-shadow: 0 3px 7px rgba(0, 0, 0, 0.6);
  color: #FAFAFA !important;
}
#back-to-top:active {
  background-color: #2e3831;
  color: #FAFAFA;
}
.theme-variant:hover:before {
  color: #4a5a4e;
}
.theme-variant:active:before {
  color: #1f2821;
}
.sidebar-recent-author,
.sidebar-recent-category {
  color: #757575;
}

/* Latest Discussions Sidebar - Fix text overflow */
.sidebar-recent-title {
  white-space: normal !important;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.sidebar-recent-title a {
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: normal;
}

/* Mobile site title - hidden by default, shown on mobile via hero flex layout below */
.site-title-mobile {
  display: none !important;
}

/* Responsive homepage title sizing (mobile only) */
@media (max-width: 900px) {
  #site-desc-full h1 {
    font-size: 7.2em !important;
  }
}
@media (max-width: 700px) {
  #site-desc-full h1 {
    font-size: 5.6em !important;
  }
}
@media (max-width: 500px) {
  #site-desc-full h1 {
    font-size: 4.4em !important;
  }
}
@media (max-width: 380px) {
  #site-desc-full h1 {
    font-size: 3.6em !important;
  }
}

/* Logo sizing - hidden until proper logo is created */
#logo {
  display: none !important;
}
#logo img {
  height: 32px;
  width: auto;
}

/* Hide BBCode and Smilies status text */
.bbcode-status {
  display: none !important;
}

/* Reduce message textarea height and make it auto-expand */
textarea#message,
textarea.input[name="message"],
#message-wrap textarea.input {
  min-height: 150px !important;
  max-height: none !important;
  height: 33vh !important;
  resize: vertical !important;
}

/* Standardize all dropdown font sizes */
.dropdown-box,
.dropdown-mega,
.dropdown-body,
.dropdown-box a,
.dropdown-mega a,
.dropdown-body a {
  font-size: 13px !important;
}

.dropdown-body .notification-title {
  font-size: 13px !important;
}

/* Off-side menu button - make it clearer */
#side-toggle {
  border: 2px solid #4a5a4e !important;
  border-radius: 4px !important;
  padding: 6px 10px !important;
  background-color: rgba(74, 90, 78, 0.05) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
}

#side-toggle:hover {
  background-color: rgba(74, 90, 78, 0.15) !important;
  border-color: #3a4a3e !important;
}

#side-toggle:active {
  background-color: rgba(74, 90, 78, 0.25) !important;
}

/* Fix page overflow on right side */
body, html {
  max-width: 100%;
  overflow-x: clip;
}

#wrap-inner, #mbrs {
  max-width: 100%;
}

/* Sticky footer - min-height ensures footer sits near viewport bottom on short pages */
#page-body {
  min-height: calc(100vh - 60px);
}

/* Regular footer height matches mobile nav (60px) to prevent overlap at breakpoints */
#wrap-footer {
  padding: 20px 0;
}

.chunk {
  max-width: 1200px;
}

/* Hide H1 site title visually but keep for screen readers and SEO */
.site-title-header {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.site-title-header a {
  color: inherit;
  text-decoration: none;
}

/* Accessibility: Increase touch target size for small links */
a.lastsubject {
  position: relative;
}

a.lastsubject::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 48px;
  min-height: 48px;
}

/* Fix oversized MCP (Moderator Control Panel) h3 headings */
#cp-main h3 {
  font-size: 1.6em !important;
}

/* FAQ/Help/Rules/About pages - match site standard font size (1.3em instead of 1.5em) */
.faq dt {
  font-size: 1.3em;
}

.faq dd {
  font-size: 1.3em;
}

.background-deep .faq-title,
.background-normal .faq-title {
  font-size: 1.3em;
}

/* Agreement/Terms page and UCP content paragraphs - body is 10px so bare <p> renders tiny */
#agreement .chunk p,
#cp-main-inner > p {
  font-size: 1.3em;
  line-height: 1.6154;
}

.password-wrap { display: inline-flex; align-items: center; }
.toggle-pw {
	background: transparent !important; border: none !important;
	cursor: pointer; color: #aaa; padding: 0 0 0 0.5em;
	font-size: 1em; line-height: 1; flex-shrink: 0;
}
.toggle-pw:hover { color: #555; }

#quick-login .modal-body label { display: block; }
#quick-login .modal-body .input { width: 100%; box-sizing: border-box; }
#quick-login .modal-body .password-wrap { width: 100%; }
#quick-login .modal-body .password-wrap .input { flex: 1; width: auto; }

/* Hide BBCode formatting toolbar — BBCode still works for quotes, just not advertised */
#format-buttons, #abbc3_buttons { display: none !important; }

/* UCP nav trim - hide sections not relevant to this forum */
#cp-menu li.tab:has(a[href*="ucp_zebra"]) { display: none !important; }
#cp-menu li:has(a[href*="mode=signature"]) { display: none !important; }
#cp-menu li:has(a[href*="mode=drafts"]) { display: none !important; }


/* =============================================================================
   SHF HERO PANEL
   ============================================================================= */

#site-desc-full > .chunk {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  padding-bottom: 36px;
}

.shf-hero-panel {
  position: relative;
  z-index: 1001;
  width: calc(100% - 48px);
  max-width: 820px;
  margin-top: 92px;
  background: rgba(10, 16, 12, 0.62);
  backdrop-filter: blur(14px) saturate(1.4);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 6px;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
  transition: opacity 0.35s ease, transform 0.35s ease;
}

.shf-hero-inner {
  padding: 28px 36px 24px;
  height: 340px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* Scrollable content area — flex: 1 + min-height: 0 lets it fill the inner and scroll */
.shf-hero-content {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding-right: 8px;
  margin-bottom: 4px;
}

/* Scrollbar — near-white thumb */
.shf-hero-content::-webkit-scrollbar {
  width: 5px;
}
.shf-hero-content::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 3px;
}
.shf-hero-content::-webkit-scrollbar-thumb {
  background: rgba(168, 196, 160, 0.55);
  border-radius: 3px;
}
.shf-hero-content::-webkit-scrollbar-thumb:hover {
  background: rgba(168, 196, 160, 0.85);
}

.shf-hero-title {
  margin: 0 0 12px;
  font-size: 1.5em !important;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #FAFAFA !important;
  line-height: 1.25;
}

.shf-hero-body {
  margin: 0 0 10px;
  font-size: 1.05em;
  line-height: 1.65;
  color: rgba(250, 250, 250, 0.82) !important;
}

.shf-hero-body:last-child {
  margin-bottom: 0;
}

.shf-hero-panel a,
.shf-hero-panel a:visited {
  color: #a8c4a0 !important;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.shf-hero-panel a:hover {
  color: #c8ddc0 !important;
}

/* Future slot scaffolding */
.shf-hero-slots {
  display: flex;
  gap: 16px;
  margin-top: 24px;
  flex-wrap: wrap;
}

.shf-hero-slot {
  flex: 1 1 200px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding-top: 16px;
}

.shf-slot-label {
  display: block;
  font-size: 0.75em;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(250, 250, 250, 0.45) !important;
  margin-bottom: 8px;
}

@media (max-width: 700px) {
  #site-desc-full {
    height: auto !important;
    min-height: 448px;
  }

  #site-desc-full > .chunk {
    justify-content: center;
    gap: 16px;
    padding-top: 76px;
    padding-bottom: 20px;
  }

  .site-title-mobile {
    display: block !important;
    position: static !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    text-align: center;
    color: #4a5a4e;
    font-size: 1.8rem;
    font-weight: 500 !important;
    letter-spacing: 0.2em !important;
    line-height: 1.5;
    flex-shrink: 0;
  }

  .shf-hero-panel {
    width: calc(100% - 24px);
    flex-shrink: 0;
    margin-top: 0;
  }

  .shf-hero-inner {
    padding: 20px 18px 18px;
    min-height: 0;
    justify-content: flex-start;
  }

  .shf-hero-content {
    flex: 1;
    min-height: 0;
  }

  .shf-hero-title {
    font-size: 1.25em;
  }

  .shf-hero-body {
    font-size: 0.95em;
  }
}

@media (max-width: 480px) {
  .shf-hero-inner {
    padding: 16px 14px 14px;
  }
}

/* Dismiss button */
.shf-hero-dismiss {
  position: absolute;
  bottom: -1px;
  right: -1px;
  background: transparent;
  border: none;
  padding: 10px 14px 10px 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  border-radius: 0 0 6px 0;
}

.shf-hero-dismiss-x {
  font-size: 1.1em;
  line-height: 1;
  color: rgba(250, 250, 250, 0.35);
  transition: color 0.2s ease;
}

.shf-hero-dismiss-label {
  font-size: 0.72em;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(250, 250, 250, 0.55);
  opacity: 0;
  transform: translateX(6px);
  transition: opacity 0.22s ease, transform 0.22s ease;
  pointer-events: none;
  white-space: nowrap;
}

.shf-hero-dismiss:hover .shf-hero-dismiss-label {
  opacity: 1;
  transform: translateX(0);
}

.shf-hero-dismiss:hover .shf-hero-dismiss-x {
  color: rgba(250, 250, 250, 0.75);
}

.shf-hero-dismiss:active .shf-hero-dismiss-x {
  color: #FAFAFA;
}

/* Panel collapse */
.shf-hero-panel.shf-panel-collapsing {
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
}

.shf-hero-panel.shf-panel-collapsed {
  display: none;
}

.shf-hero-panel.shf-panel-collapsed--instant {
  display: none;
}

/* =============================================================================
   NAVBAR — CUSTOM SCROLL BEHAVIOUR (READ THIS BEFORE TOUCHING ANYTHING HERE)
   =============================================================================
   The navbar is NOT standard Ravaio. It has been heavily customised via an
   inline <style> block in overall_header.html. Key facts:

   - position: fixed (not absolute — it scrolls with the page)
   - z-index: 1000 (set inline, overrides Ravaio's z-index: 4 from stylesheet.css)
   - Starts transparent; a custom JS scroll handler adds the class "scrolled-white"
     when the user scrolls past a threshold (near #main-index), which applies:
       background-color: rgba(255,255,255,0.98)
       box-shadow: 0 2px 10px rgba(0,0,0,0.1)
       color: #333 on .site-header / .site-nav elements
   - The class is "scrolled-white" — NOT Ravaio's "scrolled-past-top"
   - DO NOT add scrolled-white via JS or it will conflict with the site's own handler

   Hero panel interaction:
   - Panel is z-index: 1001 (just above the navbar's 1000 baseline)
   - Navbar overridden to z-index: 1005 below so dropdowns render above the panel
   - When panel is visible, JS adds body.shf-panel-visible + body.shf-scrolled
     (on any scroll > 0px) so the CSS below forces the white navbar immediately,
     without waiting for the normal scroll threshold. Dismissed on panel close.
   ============================================================================= */

/* z-index layering above hero panel (z-index: 1001):
   navbar > panel, modals > navbar */
#wrap-header,
#wrap-header-index { z-index: 1005 !important; }
#darkenwrapper      { z-index: 2000 !important; }
.modal              { z-index: 2001 !important; }
.modal-bb           { z-index: 2001 !important; }

/* When hero panel is visible AND page is scrolled even 1px, immediately apply the white navbar.
   JS adds shf-panel-visible on show, shf-scrolled on any scroll, removes both on dismiss/top.
   Mirrors the site's own scrolled-white styles to avoid conflict with the scroll handler. */
body.shf-panel-visible.shf-scrolled #wrap-header-index:not(.nav-hidden),
body.shf-panel-visible.shf-scrolled #wrap-header:not(.nav-hidden) {
  background-color: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
}
body.shf-panel-visible.shf-scrolled #wrap-header-index:not(.nav-hidden) .site-header,
body.shf-panel-visible.shf-scrolled #wrap-header-index:not(.nav-hidden) .site-header a,
body.shf-panel-visible.shf-scrolled #wrap-header-index:not(.nav-hidden) .site-header span,
body.shf-panel-visible.shf-scrolled #wrap-header-index:not(.nav-hidden) .site-nav i,
body.shf-panel-visible.shf-scrolled #wrap-header:not(.nav-hidden) .site-header,
body.shf-panel-visible.shf-scrolled #wrap-header:not(.nav-hidden) .site-header a,
body.shf-panel-visible.shf-scrolled #wrap-header:not(.nav-hidden) .site-header span,
body.shf-panel-visible.shf-scrolled #wrap-header:not(.nav-hidden) .site-nav i {
  color: #333 !important;
  transition: color 0.3s ease;
}