div#search_bar {
margin: 0 auto;
max-width: 800px;
background-color: #edf6ff;
border-top: 1px solid #dce9f7;
padding: 5px 8px;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 4px 10px;
font: 12px 'Droid Sans', Arial, sans-serif;
}

#sg_search_form {
position: relative;
display: flex;
gap: 6px;
flex: 1 1 260px;
max-width: 360px;
}

#search_bar a:link, #search_bar a:visited {
color: #233758;
text-decoration: none;
}

#search_bar a:hover {
color: #2370b9;
text-decoration: underline;
}

.search_links {
border-left: 1px solid #c9dcef;
padding-left: 10px;
color: #8b98a4;
white-space: nowrap;
}

#sg_search_input {
flex: 1;
min-width: 0;
font: 13px 'Droid Sans', Arial, sans-serif;
color: #233758;
padding: 4px 8px;
border: 1px solid #c9dcef;
border-radius: 3px;
background: #fff;
}

#sg_search_input:focus {
outline: none;
border-color: #2370b9;
}

#sg_search_form button {
font: bold 12px 'Droid Sans', Arial, sans-serif;
color: #fff;
background: #2370b9;
border: 0;
border-radius: 3px;
padding: 4px 12px;
cursor: pointer;
}

#sg_search_form button:hover {
background: #233758;
}

#sg_search_dropdown {
display: none;
position: absolute;
top: 100%;
left: 0;
right: 0;
margin-top: 2px;
background: #fff;
border: 1px solid #c9dcef;
border-radius: 3px;
box-shadow: 0 3px 10px rgba(0,0,0,.15);
z-index: 50;
text-align: left;
}

#sg_search_dropdown.open {
display: block;
}

#sg_search_dropdown a.sg_search_item {
display: flex;
align-items: baseline;
gap: 8px;
padding: 6px 10px;
font: 13px 'Droid Sans', Arial, sans-serif;
color: #233758;
text-decoration: none;
border-bottom: 1px solid #f0f4f8;
}

#sg_search_dropdown a.sg_search_item:hover, #sg_search_dropdown a.sg_search_item.active {
background: #edf6ff;
color: #2370b9;
}

.sg_search_type {
flex: 0 0 44px;
font-size: 10px;
text-transform: uppercase;
color: #8b98a4;
}

.sg_search_label {
flex: 1;
}

.sg_search_meta {
font-size: 11px;
color: #8b98a4;
white-space: nowrap;
}

#sg_search_dropdown a.sg_search_all {
font-weight: bold;
border-bottom: 0;
}

/* @group Header nav: busiest row, region buttons, strips. Overrides the fixed 800x20 rules in site_sg_new.css */

div:is(#header_resort_nav,#footer_resort_nav) {
height: auto;
min-height: 0;
overflow: visible;
}

div:is(#header_resort_nav,#footer_resort_nav) ul.nav_row {
width: auto;
max-width: 100%;
height: auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 2px 6px;
box-sizing: border-box;
background: none;
}

div:is(#header_resort_nav,#footer_resort_nav) ul.nav_row li {
float: none;
height: auto;
margin: 0;
padding: 0;
line-height: 1.5;
}

div:is(#header_resort_nav,#footer_resort_nav) ul.nav_row li a {
display: inline-block;
padding: 4px 7px;
white-space: nowrap;
}

div:is(#header_resort_nav,#footer_resort_nav) ul.nav_top {
border-bottom: 1px solid #dce9f7;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_regions {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 5px;
padding: 3px 8px;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_region {
font: inherit;
font-size: 11px;
line-height: 16px;
padding: 2px 9px;
border: 1px solid #c9dcef;
border-radius: 11px;
background: #fff;
color: #233758;
cursor: pointer;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_region .cam_number {
color: #2370b9;
margin-left: 3px;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_region.nav_here {
border-color: #2370b9;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_region[aria-expanded="true"],
div:is(#header_resort_nav,#footer_resort_nav) .nav_region[aria-expanded="true"] .cam_number {
background: #2370b9;
border-color: #2370b9;
color: #fff;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_strip {
display: grid;
grid-template-columns: minmax(0, max-content);
justify-content: center;
background: #f6faff;
border-top: 1px solid #dce9f7;
padding: 4px 8px 6px;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_strip[hidden] {
display: none;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_grp {
display: flex;
align-items: baseline;
justify-content: flex-start;
flex-wrap: wrap;
gap: 6px;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_grp ul.nav_row {
margin: 0;
padding: 0;
justify-content: flex-start;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_lbl {
font-size: 10px;
letter-spacing: .08em;
text-transform: uppercase;
color: #7a879b;
font-weight: bold;
min-width: 11.5em;
text-align: right;
padding-right: 4px;
}

div:is(#header_resort_nav,#footer_resort_nav) .nav_grp.nav_full {
justify-content: center;
padding: 4px 8px;
border-top: 1px solid #dce9f7;
}

@media (max-width: 600px) {
div:is(#header_resort_nav,#footer_resort_nav) ul.nav_top {
flex-wrap: nowrap;
overflow-x: auto;
justify-content: flex-start;
scrollbar-width: none;
}
div:is(#header_resort_nav,#footer_resort_nav) ul.nav_top::-webkit-scrollbar {
display: none;
}
div:is(#header_resort_nav,#footer_resort_nav) .nav_grp {
justify-content: flex-start;
}
div:is(#header_resort_nav,#footer_resort_nav) .nav_lbl {
min-width: 0;
width: 100%;
text-align: left;
padding: 2px 7px 0;
}
}

/* @end */

/* @group Cam badge */

.sg-badge { position: absolute; top: .55rem; right: .55rem; z-index: 1; font-size: .72rem; font-weight: 700;
            padding: .1rem .55rem; line-height: 1.5; border-radius: 10px; color: #3a4652; background: #eeeeee;
            box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.sg-badge.is-live   { background: #dcefdc; color: #3d7a45; }
.sg-badge.is-late   { background: #f8e0cf; color: #9a4f1c; }
.sg-badge.is-pause  { background: #f6ecc9; color: #8a6d1f; }
.sg-badge.is-old    { background: #eeeeee; color: #5e5e5e; }
.sg-badge.is-season { background: #eeeeee; color: #5e5e5e; }

/* @end */