/* Vertex's original image assets and blue palette, adapted to SMF 2.1 markup. */
body { background: #a0b7c6; color: #444; font: 80%/1.3 "Helvetica Neue", Helvetica, Arial, sans-serif; }
a:link, a:visited { color: #346; }
#footerfix { max-width: none; padding: 0; }
.vertex_width, #wrapper, #footer .inner_wrap { width: 90%; max-width: 2300px; margin: 0 auto; }
#wrapper { min-width: 0; box-sizing: border-box; background: #ececec; box-shadow: 0 5px 10px #0003; padding: 0 22px 12px; border: 0; border-radius: 0; }
#content_section { margin: 0; padding: 0; }
#main_content_section { padding: 12px 0 0; }
#top_section { padding: 0; background: transparent; border: 0; min-height: 0; }
.header_topbar { background: #114f7e url(../images/vertex_image/topbar_bg.png) repeat-x; color: #ececec; min-height: 36px; }
.header_topbar_content { display: flex; align-items: center; min-height: 36px; }
#top_info { display: flex; flex: 1; width: auto; max-width: none; flex-wrap: wrap; align-items: center; padding: 0; margin: 0; float: none; gap: 0; }
#top_info > li { width: auto; max-width: none; margin: 0; padding: 0 6px; line-height: 24px; border-radius: 0; white-space: nowrap; }
#top_info > li:first-child { padding-left: 0; }
#top_info > li + li { border-left: 1px solid #86a8c1; }
#top_info > li > a, #top_info > li > a:visited, #top_info .showLikeNotification { display: inline; color: #e1e1e1; background: transparent; padding: 0; border: 0; box-shadow: none; }
#top_info .new-pms { color: #ffff8b; font-weight: bold; }
.vertex_avatar img { width: 20px; height: 20px; max-width: 20px; max-height: 20px; vertical-align: middle; border-radius: 3px; box-shadow: 0 0 2px #0005; }
.vertex_social { margin-left: 8px; }
.vertex_social:first-of-type { margin-left: auto; }
.header_main { background: #1a6291 url(../images/vertex_image/main_bg.png) repeat-x; min-height: 72px; }
.header_main_content { display: flex; align-items: center; justify-content: space-between; }
.banner_logo { display: block; padding-left: 15px; min-width: 0; }
.banner_logo img { display: block; max-width: 100%; height: auto; }
#search_form { display: flex; align-items: center; gap: 0; padding: 0; float: none; margin: 0 15px 0 0; background: #ececec; border: 1px solid #041a2f; border-radius: 4px; height: 28px; box-sizing: border-box; width: 246px; }
#search_form input[type=search] { width: 162px; min-width: 0; border: 0; background: transparent; padding: 4px; height: 24px; font: italic 12px Arial,sans-serif; box-shadow: none; }
#search_form select { max-width: 56px; height: 14px; padding: 0; font: 10px Arial,sans-serif; border: 0; background: #c8c8c8; color: #222; }
#search_form button { min-width: 26px; width: 26px; height: 26px; border: 0; padding: 0; background: #28506f url(../images/vertex_image/quick_search_token_icon.png) no-repeat center; }
#search_form button span { visibility: hidden; }
.header_nav { background: #073057 url(../images/vertex_image/nav_bg.png) repeat-x; min-height: 36px; }
.header_nav_content { min-height: 36px; }
#main_menu { margin: 0; padding: 0; }
.header_nav .dropmenu > li > a { color: #ececec; border: 0; background: transparent; border-radius: 0; padding: 0 20px; font-size: 11.52px; line-height: 36px; text-shadow: none; }
.header_nav .dropmenu { padding: 0 26px; }
.header_nav .dropmenu > li { margin: 0; }
.header_nav .dropmenu > li > a.active, .header_nav .dropmenu > li:hover > a { background: #215985; color: #fff; }
.header_nav .dropmenu > li > a .main_icons { display: none; }
.header_nav .dropmenu li ul a { color: #346; }
.navigate_section { margin: 0 0 14px; padding: 4px 0; font-size: 11px; background: transparent; border: 0; border-radius: 0; }
/* Vertex places breadcrumbs inside the content flow. A full-width float here
   leaves following overflow-contained forms with zero available width. */
#main_content_section > .navigate_section { float: none; clear: both; }
.navigate_section ul { border: 0; border-radius: 0; box-shadow: none; background: transparent; }
.vertex_notice { padding: 8px; text-align: center; font-size: 14px; margin: 0 0 16px; border: 1px solid #bbb; background: #f4f4f4; border-radius: 0; line-height: 18px; }
div.cat_bar { background: #114d77 url(../images/theme/main_block.png) no-repeat 0 -160px; border-radius: 0; height: 31px; padding: 0 9px; box-shadow: none; border: 0; }
.title_bar { background: #246293; border-radius: 0; }
div.cat_bar h3.catbg { color: #ececec; border-radius: 0; background: transparent; padding: 0 9px; font: normal 14px/31px Arial,sans-serif; }
.cat_bar .catbg a { color: #fff; }
.toggle_up::before, .toggle_down::before { width: 13px; height: 13px; background: transparent url(../images/collapse.gif) no-repeat center; border: 0; border-radius: 0; box-shadow: none; }
.toggle_down::before { background-image: url(../images/expand.gif); }
.toggle_up:hover::before, .toggle_down:hover::before { background-color: transparent; box-shadow: none; }
.vertex_recent_bar { height: 31px; margin: 0 9px 1px 0; background: #dadfe6 url(../images/theme/main_block.png) no-repeat 0 -120px; }
.vertex_recent_bar h4.titlebg { height: 31px; padding: 0 9px; margin: 0; color: #ececec; font-size: 1.2em; font-weight: normal; line-height: 31px; background: url(../images/theme/main_block.png) no-repeat 100% -120px; }
.vertex_recent_bar .icon { vertical-align: middle; margin: -2px 5px 0 0; }
.vertex_recent_bar .show_all_link { color: #ececec; font-size: 12px; font-weight: normal; }
#info_center { background: #f5f5f5; padding: 0; border: 1px solid #c5c5c5; box-shadow: none; }
#info_center > .title_bar { height: 31px; margin: 0; border: 0; background: #114d77 url(../images/theme/main_block.png) no-repeat 0 -160px; }
#info_center > .title_bar h3.titlebg { height: 31px; padding: 0 17px; margin: 0; border: 0; background: transparent; color: #ececec; font: normal 14px/31px Arial,sans-serif; }
#info_center > .title_bar a { color: #ececec; }
#info_center #upshrink_stats { margin: 0; padding: 14px 10px 10px; }
#info_center .sub_bar { height: 31px; border: 0; margin: 0 9px 1px 0; background: #dadfe6 url(../images/theme/main_block.png) no-repeat 0 -120px; }
#info_center .sub_bar h4.subbg { height: 31px; padding: 0 9px; border: 0; background: url(../images/theme/main_block.png) no-repeat 100% -120px; color: #ececec; font-size: 1.2em; font-weight: normal; line-height: 31px; }
#info_center .sub_bar a { color: #ececec; }
#info_center .main_icons.stats::before { background: url(../images/icons/info.gif) no-repeat center; }
#info_center .main_icons.people::before { background: url(../images/icons/online.gif) no-repeat center; }
#info_center p.inline { padding: 0.5em; margin: 0; font-size: 1em; line-height: 1.3; }
dl#ic_recentposts { display: grid; grid-template-columns: minmax(0, 1fr) auto; width: auto; margin: 0 0 0.5em; padding: 0.5em; line-height: 1.3em; }
dl#ic_recentposts dt, dl#ic_recentposts dd { margin: 0; padding: 0; }
dl#ic_recentposts dd { text-align: right; padding-left: 1em; }
dl#ic_recentposts:not(.show_all) dt:nth-of-type(n+11), dl#ic_recentposts:not(.show_all) dd:nth-of-type(n+11) { display: none; }
#shoutbox .windowbg2 { color: #000; background: #f0f2f4; }
#shoutbox .content { padding: 0.5em 1.2em; margin: 0; border: 0; }
#shoutbox_table { color: #444; }
#shoutbox_table td { padding: 2px; font-size: 85%; line-height: 16.64px; }
#shoutbox .topslice, #shoutbox .botslice { display: none; }
#shoutbox .button_submit { background: #448dd1; border: 1px solid #001c37; color: #fff; padding: 2px 3px; font-weight: normal; cursor: pointer; }
#shoutbox .button_submit:hover { background: #66a4de; border-color: #0f3252; }
#shoutbox .shoutbox_postbar, #shoutbox .shoutbox_postbar > tbody { display: block; width: 100%; }
#shoutbox .shoutbox_postbar > tbody > tr { display: flex; align-items: center; gap: 8px; }
#shoutbox .shoutbox_compose { display: flex; flex: 1; min-width: 0; width: auto; gap: 4px; padding: 0 !important; }
#shoutbox .shoutbox_compose #shoutbox_message { flex: 1; min-width: 0; width: 0 !important; }
#shoutbox .shoutbox_compose .button_submit, #shoutbox .shoutbox_toolbar { flex: none; }
#shoutbox .shoutbox_spacer { display: none; }
.windowbg, .roundframe, #quickreply, .generic_list_wrapper { border-radius: 0; background-color: #e7edf3; }
.windowbg:nth-of-type(even) { background-color: #f0f4f7; }
.boardindex_table .main_container, .boardindex_table .board_row { border-radius: 0; }
.boardindex_table .main_container { margin-bottom: 14px; }
.boardindex_table .up_contain { display: grid; grid-template-columns: 76px minmax(0,1fr) 15% 24%; align-items: stretch; margin: 0; border: 0; border-top: 1px solid #eee; background: #dfe1e3; }
.boardindex_table .board_icon { width: auto; padding: 7px 0; background: #d5dade; border-right: 2px solid #ececec; display: flex; justify-content: center; align-items: center; align-self: stretch; }
.boardindex_table .board_icon a { display: block; width: 48px; height: 40px; background: url(../images/on.png) no-repeat center; background-size: auto; }
.boardindex_table .board_icon a.board_off { background-image: url(../images/off.png); }
.boardindex_table .board_icon a.board_on2 { background-image: url(../images/on2.png); }
.boardindex_table .board_icon a.board_redirect { background-image: url(../images/redirect.png); }
.boardindex_table .info { width: auto; padding: 5px 10px; align-self: center; }
.boardindex_table .info .subject { color: #2074a5; font-size: 14px; font-weight: bold; }
.boardindex_table .board_stats { margin: 0; width: auto; padding: 7px 6px; background: #d5dade; border-left: 2px solid #ececec; border-right: 2px solid #ececec; align-self: stretch; display: flex; justify-content: center; align-items: center; color: #111; font-size: 11px; }
.boardindex_table .board_stats p { border: 0; margin: 0; }
.boardindex_table .lastpost { width: auto; padding: 4px 8px; font-size: 11px; line-height: 15px; align-self: center; }
.boardindex_table .lastpost p { margin: 0; }
.boardindex_table .children { grid-column: 2 / -1; box-sizing: border-box; }
.button, a.button:link, a.button:visited { background: #448dd1; border: 1px solid #123b60; color: #fff; border-radius: 0; text-shadow: none; }
.button:hover, a.button:hover { background: #66a4de; color: #fff; }
.visually_hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
#footer { background: transparent; border: 0; }
@media (max-width: 720px) {
 .vertex_width, #wrapper, #footer .inner_wrap { width: 100%; }
 .header_main_content { flex-direction: column; align-items: stretch; }
 .banner_logo { padding-left: 10px; max-width: 400px; }
 #search_form { margin: 6px 10px 10px; flex-wrap: nowrap; width: calc(100% - 20px); }
 #search_form input[type=search] { flex: 1; width: auto; }
 #top_info > li { font-size: 11px; }
 #wrapper { padding: 0 6px 8px; }
 .header_nav .mobile_user_menu { color: #fff; margin: 0; padding: 10px; display: block; }
 .header_nav .popup_window .dropmenu > li > a { color: #346; }
 .header_nav .popup_window .dropmenu { padding: 0; }
 .header_nav .popup_window .dropmenu > li > a.active { color: #fff; }
 #main_content_section img { max-width: 100%; }
 .vertex_notice { font-size: 12px; }
 dl#ic_recentposts { grid-template-columns: minmax(0, 1fr); }
 dl#ic_recentposts dd { padding: 0 0 0.5em; }
 #shoutbox .shoutbox_postbar > tbody > tr { flex-wrap: wrap; }
 #shoutbox .shoutbox_compose { flex-basis: 100%; }
 #shoutbox .shoutbox_toolbar { margin-left: auto; }
 #shoutbox_table, #shoutbox_table tbody, #shoutbox_table tr { display: block; width: 100%; }
 #shoutbox_table td { display: block; width: auto !important; white-space: normal; text-align: left !important; }
 #shoutbox_table td:first-child { padding-bottom: 0; }
 #shoutbox_table td + td { padding-top: 0; padding-bottom: 6px; }
 #top_info > li { white-space: normal; }
 .boardindex_table .up_contain { grid-template-columns: 48px minmax(0,1fr); }
 .boardindex_table .board_icon { grid-row: 1 / 3; }
 .boardindex_table .info { padding: 8px; }
 .boardindex_table .board_stats { display: none; }
 .boardindex_table .lastpost { grid-column: 2; padding: 0 8px 8px; }
 .boardindex_table .children { grid-column: 2; }
}
