/**
 * YUI 3-based nav + search/location box
 */

/* Top navigation + search box */

.TopBar .NavBar #search_header_button_td { vertical-align: bottom; text-align: left; padding: 0; }

#flickr_nav {
	padding: 0 0 1px 0;
}

#flickr_nav img {
	border: 0;
	margin: 0;
	outline: none;
}

#flickr_nav a:hover, 
#flickr_nav a:active {
	outline: none;
	background-color: inherit;
}

#flickr_nav .flickr_nav_menu {
	display: none;
	position: absolute;
	border-left: 1px solid #f0f0f0;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;
	border-top: 0;
	width: auto;
	*width: 212px; /* "auto" fails in IE, screwy rendering on :hover. */
	z-index: 5000;
	background-color: #fff;
	background-color: rgba(255,255,255,0.97);
	*background-color: #fff;
	text-align: left;
	margin-left:-1px;
	margin-top:1px;
	padding:1px;
}

#flickr_nav .flickr_nav_menu a,
#flickr_nav .flickr_nav_menu a:link {
	display: block;
	position: relative;
	width: 200px;
	color: #0063dc;
	margin: 0px;
	padding: 3px 6px;
	font-size: 12px !important; /* firefox 3.6 WTF on "for a location" */
	line-height: 18px;
	text-decoration: none;
	font-weight: normal;
}

#flickr_nav .flickr_nav_menu a:hover,
#flickr_nav .flickr_nav_menu a:active {
	color: #0063dc;
	background: #fff;
	text-decoration: none;
	border: none;
	padding:0px;
}

#flickr_nav li.no_menu_li a:hover {
	/* top-level links should stay the same color, etc. */
	color: #0063dc;
	background-color: #fff;
}

#flickr_nav .flickr_nav_menu a.menu_item_line_above {
	margin-top: 10px;
	padding-top: 8px;
	border-top: 1px solid #e5e5e5;
}

#flickr_nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

#flickr_nav ul li {
	float: left;
	font-size: 13px;
	line-height: 13px;
	position: relative;
	z-index: 1001;
	border: 1px solid #fff;
	border-bottom: 1px solid #fff;
} /* IntlRef: sea.css */

#flickr_nav ul li.menu_li {
	margin-right: 3px;
}

#flickr_nav ul li.no_menu_li {
	margin-right: 16px;
	*margin-top: 2px; /* IE 6/7 vertical tweaks for "home" */
}  /* IntlRef: de-de.css */

#flickr_nav ul li.last_item {
	margin-right: 0px;
}

#flickr_nav ul li span {
	padding: 4px 2px 4px 6px;
	display: block;
	border-right: 1px solid #fff;
	white-space: nowrap;
	cursor: pointer;
	_cursor: hand;
}

#flickr_nav ul li span.beta-flag {
	position: relative;
	display: inline-block;
	height: 0;
	width: 0;
	overflow: visible;
}

body.quirks #flickr_nav ul li span.beta-flag {
	/* special hack for IE 9 and below - don't show "new" flag on quirksmode pages */
	display: none\9;
}

#flickr_nav ul li span.beta-flag span {
	position: absolute;
	left: 3px;
	bottom: -1px;
	height: 0;
	line-height: 0;
	padding: 0 3px 0 0;
	border: 6px solid #FF0084 !important;
	border-right-color: transparent !important;
	border-left-width: 2px !important;
	color: white;
	font-size: 10px;
	font-weight: bold;
	text-shadow: 0 1px 0 rgba(0,0,0, 0.4); 
	-webkit-font-smoothing: antialiased;
}

#Topbar #headersearchform.nav-selecta {
	/* legacy case: YUI 3 nav + search header included from inc_head.txt */
	padding-right: 1px;
}

#TopBar #nav-selecta-field {
	/* legacy case: YUI 3 nav + search header included from inc_head.txt */
	padding-bottom: 0px;
}

#Topbar #nav-selecta-search-button {
	/* legacy case: YUI 3 nav + search header included from inc_head.txt */
	padding-left: 0px;
}

#TopBar #head-nav-bar {
	/* legacy case: YUI 3 nav included from inc_head.txt */
	padding-top: 3px;
}

#TopBar #flickr_nav ul li:first-child span {
	/* legacy case: YUI 3 nav included from inc_head.txt */
	/* the first item (eg. home) needs hardly any left padding to align with pure zeus navigation. */
	padding-left: 1px;
}

#flickr_nav ul li a.nav_more:active {
	background-color: transparent;
	outline: none;
}

#flickr_nav ul li img {
	vertical-align: top;
	margin-left: 0px;
}

#flickr_nav ul li a,
#flickr_nav ul li a:visited {
	text-decoration:none;
	font-weight:bold;
	color:#0063DC;
} /* IntlRef: sea.css */

#flickr_nav ul li a:hover {
	border:none;
	*background-color: transparent;
	_color: #0063DC; /* IE 6 forgets color, arg. */
}

#flickr_nav ul li div.flickr_nav_menu {
	left:-1px;
}

#flickr_nav ul li div.flickr_nav_menu a {
	font-weight:normal;
}

/* CSS-only "Flickr nav" is #flickr_nav {} */

#headersearchform {
	float:left;
	display:inline;
	padding-right:1px;
}

#headersearchform #header_search_q {
	width: 200px;
}

#search_header_container,
#search_header_button_td {
	float:right;
	display:inline;
}

/* first-child selectors for good browsers */
#flickr_nav>ul>li:hover {
	border: 1px solid #f0f0f0;
	border-bottom: 1px solid #fff;
	border-right-color: #9f9f9f;
}

/* redefine separately for god damn IE 6 and others in quirks mode since they skip rules with > in them */
#flickr_nav ul li.menu_li.js_hover,
#flickr_nav ul li.menu_li.nav_open,
#flickr_nav ul li.menu_li.nav_clicked_open {
	border: 1px solid #f0f0f0;
	border-bottom: 1px solid #fff;
	border-right-color: #9f9f9f;
}

/* exclude hover effect when no drop-down is present */
#flickr_nav ul li.no_menu_li:hover,
#flickr_nav ul li.no_menu_li:hover span {
	border-color: transparent;
}

/* quirks-mode IE and others */
#flickr_nav ul li.no_menu_li,
#flickr_nav ul li.no_menu_li span,
#flickr_nav ul li.last_item,
#flickr_nav ul li.last_item span {
	border-color: transparent;
}

#flickr_nav>ul>li:hover>span,
#flickr_nav li.nav_open span {
	border-right: 1px solid #f0f0f0;
}

#flickr_nav.no_js ul>li:hover ul.flickr_nav_menu, /* Good CSS, no JS case */
#flickr_nav.nav_enabled ul>li:hover ul.flickr_nav_menu, /* Hover for N msec, nav_enabled has been added via JS */
#flickr_nav.nav_enabled ul li.nav_open ul.flickr_nav_menu, /* JS appended class */
#flickr_nav ul li.nav_clicked_open ul.flickr_nav_menu,
#flickr_nav ul li.nav_open .flickr_nav_menu {
	/* When a menu has been opened */
	display: block !important;
}

#flickr_nav ul li.nav_clicked_open ul.flickr_nav_menu {
	/* IE 6 won't pick up above rules, so we redefine them here. */
	display: block !important;
}

body #flickr_nav.no_js ul>li:hover ul.flickr_nav_menu {
	/* Good CSS, .js has not yet been appended to body */
	display: block !important;
}

body.js #flickr_nav.no_js ul>li:hover ul.flickr_nav_menu {
	/* Good CSS, .js *has* been appended to body - so don't do native hover */
	display: none !important;
}

div.nav_closed #flickr_nav ul>li:hover div.flickr_nav_menu, /* Good CSS case */
div.nav_closed #flickr_nav ul li.nav_open div.flickr_nav_menu, /* JS appended class */
div.nav_closed #flickr_nav li.nav_open .flickr_nav_menu {
	/* Disallow menus to open when div.nav_closed */
	display: none;
}

/* search nav */

#search_header_container {
	float:right;
	display:inline;
}

#search_header_container #search_header_button_td {
	/* IE layout hax, 6 + 7 */
	/* maybe just apply to everyone? */
	float:left;
	display:inline;
}

body.js #search_header_container #headersearchbutton1 {
	/* hide native button when JS is enabled */
	display:none;
}

#search_header_container,
#search_header_container * {
	vertical-align: middle;
}

#flickr_nav ul li li {
	/* drop-down line items */
	float:none;
	display:block;
	border:none;
	margin:0px;
	padding:0px;
}

/* caret items */

#head-nav-bar #flickr_nav .nav_button_caret,
#head-nav-bar #flickr_nav .nav_more:hover nav_button_caret,
#head-nav-bar #flickr_nav li.nav_open .nav_button_caret, /* JS appended class */
#head-nav-bar #flickr_nav li.nav_clicked_open .nav_button_caret {
	background: transparent url(../../../pw/images/flickr-sprite.png) no-repeat -171px -13px;
}

#head-nav-bar #flickr_nav.no_js ul>li:hover .nav_button_caret { /* Good CSS case */
	background: transparent url(../../../pw/images/flickr-sprite.png) no-repeat -171px -13px;
}

#head-nav-bar #flickr_nav .caret_hover,
#head-nav-bar #flickr_nav .nav_more:hover .nav_button_caret {
	background-position: -171px -53px;
}

#head-nav-bar #flickr_nav li.nav_clicked_open .caret_hover,
#head-nav-bar #flickr_nav li.nav_open .nav_button_caret, /* JS appended class */
#head-nav-bar #flickr_nav li.nav_clicked_open .nav_button_caret {
	background-position: -171px -93px;
}

#head-nav-bar #flickr_nav.no_js ul>li:hover .nav_button_caret {
	/* Good CSS case */
	background-position: -171px -93px;
}

/* Drop-down styling, reused from #options-menu {} */

#flickr_nav ul ul {
	position: relative;
	z-index: 1002; /* 1 step higher than the arrow mask */
}

#flickr_nav ul ul li hr {
	border:none;
	border-top:1px solid #eee;
	background:transparent;
	height:1px;
	margin-top:4px;
	margin-bottom:4px;
	*display:none; /* utterly broken in IE for now - margins refuse to collapse. */
	
}

#flickr_nav .flickr_nav_menu a {
	/* all links in drop-downs should have normal weight */
	font-weight: normal !important;
}

#flickr_nav .flickr_nav_menu a:hover,
#flickr_nav .flickr_nav_menu a:active {
	/* Drop-down links */
	/* Note: !important only to make non-photo.gne views work, stupid CSS conflict somewhere in flickr.css. TODO: Remove these when flickr.css is toast. */
	color: #fff !important;
	background-color: #0063dc !important; /* important for IE 8 :hover when YUI 3 nav is on site-wide */
	background-image: -moz-linear-gradient(top, #468EE6, #0063DC) !important;
	background-image: -webkit-linear-gradient(top, #468EE6 0%, #0063DC 100%) !important;
	background-image: linear-gradient(to bottom, #468EE6 0%, #0063DC 100%) !important;
	text-decoration:none !important;
	padding: 3px 6px;
	border:none !important;
} /* Implements the .chunk style */

#flickr_nav .menu_li span a:active {
	/* when top-level item links are focused (ie., "You" has been clicked), make sure they have a transparent background color. */
	background-color: transparent;
}

#flickr_nav.quirks_mode .flickr_nav_menu a {
	/* IE in quirks mode DTD */
	width: 100% !important;
}

/* -------------------------------------------------------------------------------- */
/* Location search (from search input) */
/* -------------------------------------------------------------------------------- */

#search_location_box {
	position:absolute;
	background:#F7F7F7;
	z-index:5001;
	display:none;
	border:1px solid #CECECE;
	color:#434343;
}

#search_location_box .Pulser_gray { 
	margin-top: 3px; 
	background: transparent url(../../../pw/images/progress/balls-24x12-grey.gif) no-repeat 0px 0px; 
}
	
#search_location_box .Confirm_small,
#search_location_box .Problem_small {
	margin-bottom: 11px; 
	margin-top: 4px; 
	margin-left: 4px; 
	padding: 3px 0 7px 38px; 
	background: url(../../../pw/images/icon_check_small.png) no-repeat left top; 
 	font-size: 14px;
	text-align: left; 
	vertical-align: middle; 
	width: 100%; 
	color: #000; 
}

#search_location_box .Problem_small {
	padding: 5px 0 10px 38px; 
	background: url(../../../pw/images/icon_alert.png) no-repeat left top; 
	margin-top: 1px; 
}

#search_location_box .Alert_small { 
	padding: 0 0 14px 35px; 
	background: url(../../../pw/images/icon_alert.png) no-repeat left top;
}

/* -------------------------------------------------------------------------------- */
/* Header search bar, used for the Nav Selecta. */
/* -------------------------------------------------------------------------------- */

#headersearchform.nav-selecta	{ width: 325px; padding-right: 12px; text-align: right; *z-index: 999; /* IE7 puts the autocomplete result list below everything else. */ }
#nav-selecta-field		{ width: 220px; margin-top: 1px; margin-left: -16px\9; margin-left: 0\0/; *margin-left: 0; *margin-right: -20px; *padding: 1px; padding: 1px\9; -webkit-appearance: textfield; }
#nav-selecta-search-button	{ height: 20px; margin-left: -16px\9; margin-left: 0\0/; *margin-left: 20px; background: transparent; border: 0; color: #0063dc; font-size: 13px; font-weight: bold; }
#nav-selecta-search-button:hover{ cursor: pointer; }

@media screen and (-webkit-min-device-pixel-ratio:0) { 
	#nav-selecta-field	{ height: 18px; }
	#nav-selecta-search-button { margin-left: 3px; }
}

#search_header_container #headersearchform.nav-selecta * { vertical-align: baseline; }