/*----------------------------------------------
	RESTAURANTS.CSS
	Author:		Engage Interactive
	Requires:	reset.css
				global.css
----------------------------------------------*/

/*-------------------------------
	SUPER AWESOME SEARCH
-------------------------------*/

#restaurant_finder {
	position:relative;
	height:290px;
	background:url(/assets/giraffe/images/restaurants/search_background.gif) 0 0 no-repeat;
	z-index:60;
}

div.column_wrapper {
	overflow:visible;
}

#help {
	display:none;
	position:absolute;
	right:22px;
	top:10px;
	width:196px;
	height:239px;
	background:url(/assets/giraffe/images/restaurants/help_bubble.gif);
	text-indent:-5000px;
	z-index:20;
}


/*---------------------
	DROPDOWN
---------------------*/

#search {
	position:relative;
	width:384px;
	padding:95px 0 0 15px;
	z-index:300;
}

#search input.top {
	display:block;
	width:369px;
	height:39px;
	padding:11px 0 0 15px;
	border:none;
	margin:0;
	background:#FFF url(/assets/giraffe/images/restaurants/dropdown_top.gif) 0 0 no-repeat;
	color:#137675;
	font-style:italic;
	font-size:22px;
	cursor:pointer;
	z-index:310;
}

#search input.top:hover {
	background-position:0 -50px;
	color:#055655;
}

#search.active input.top {
	background-position:0 -100px;
	color:#055655;
	cursor:text;
}

#search button.go {
	display:none;
	position:absolute;
	right:5px;
	top:100px;
	width:40px;
	height:40px;
	border:none;
	margin:0;
	padding:0;
	background:url(/assets/giraffe/images/restaurants/go.gif) 0 0;
	text-indent:-5000px;
	z-index:320;
}

#search button.go:hover {
	background-position:0 -40px;
	cursor:pointer;
}

span.spinner {
	display:none;
	position:absolute;
	right:5px;
	top:100px;
	width:40px;
	height:40px;
	background:url(/assets/giraffe/images/restaurants/search_loading.gif) 0 0;
	z-index:330;
}

.loading span.spinner {
	display:block;
}


/*---------------------
	LIST
*/

#dropdown {
	display:none;
	position:absolute;
	left:15px;
	top:145px;
	width:384px;
	height:0;
	background:#FFF url(/assets/giraffe/images/restaurants/dropdown_top.gif) 0 -150px no-repeat;
	overflow:hidden;
	z-index:100;
	
	-moz-border-radius-bottomleft:8px;
	-webkit-border-bottom-left-radius:8px;
	-moz-border-radius-bottomright:8px;
	-webkit-border-bottom-right-radius:8px;
}

#dropdown ul.primary {
	position:absolute;
	left:10px;
	bottom:5px;
	width:365px;
	height:220px;
	margin-bottom:5px;
	overflow:hidden;
}

#dropdown ul.primary li {
	width:165px;
}

#dropdown ul.primary li a,
#dropdown ul.primary li span {
	display:block;
	padding:4px;
	font-size:15px;
	color:#055655;
}

#dropdown ul.primary li a:hover {
	background:#d6f0f0;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}


/*---------------------
	LONDON
*/

#dropdown li.london {
	position:absolute;
	left:172px;
	top:0;
	width:160px;
	padding-left:5px;
	border-left:dotted 1px #00A2A2;
}

#dropdown li.london span {
	font-size:18px;
	font-weight:bold;
	font-style:italic;
}

#dropdown li.london ul{
	position:relative;
	left:0;
	top:0;
	width:160px;
	height:auto;
}


/*---------------------
	SEARCH RESULTS
---------------------*/

#results_title {
	margin:8px 0 5px 15px;
	color:#C2EFEF;
	font-size:28px;
}

#search_results {
	overflow:hidden;
	margin:0 0 15px 15px;
	z-index:10;
}

#search_results li {
	display:block;
	position:relative;
	float:left;
	width:260px;
	height:42px;
	margin-right:5px;
	background:url(/assets/giraffe/images/restaurants/results_icons.gif) 0 -84px no-repeat;
}

#search_results li.popular {
	background-position:0 0;
}

#search_results li.predefined {
	background-position:0 -42px;
}

#search_results li a {
	display:block;
	height:38px;
	padding:4px 0 0 42px;
	font-weight:bold;
	font-size:15px;
	color:#FFF;
	white-space:nowrap;
	overflow:hidden;
}

#search_results li a em {
	font-weight:normal;
	font-style:italic;
	font-size:11px;
	display:block;
}

#search_results li a:hover {
	background:url(/assets/giraffe/images/restaurants/results_hover.gif);
}


/*---------------------
	ERROR MESSAGES
---------------------*/

#error {
	display:none;
	position:absolute;
	left:15px;
	bottom:14px;
	width:264px;
	height:80px;
	padding:6px 0 0 120px;
	background:#00A2A2 url(/assets/giraffe/images/restaurants/error.gif) 9px 50% no-repeat;
}

#error p {
	color:#FFF;
	font-size:13px;
	line-height:18px;
	padding-right:10px;
}

#error p acronym {
	font-weight:bold;
	border-bottom:dotted 1px #6FDFDF;
	cursor:help;
}


/*-------------------------------
	LAYOUT
-------------------------------*/

#restaurant_container {
	position:relative;
	height:100px;
	clear:both;
	overflow:hidden;
	z-index:10;
}

.initial {
	background:url(/assets/giraffe/images/restaurants/restaurant_empty.gif) center bottom no-repeat;
}

#restaurant {
	overflow:hidden;
}

#restaurant .column_wrapper .big_column {
	width:397px;
}

#restaurant .column_wrapper .small_column {
	width:220px;
	margin-right:0;
}

#restaurant .content .intro {
	padding-right:0;
}

ul.split { /* Sets a width for the 'more information' split list */
	width:336px;
}


/*-------------------------------
	LOADING SPINNER
-------------------------------*/

div#loading {
	display:none;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#e2ddcf url(/assets/giraffe/images/template/background.jpg) 0 -458px no-repeat;
	z-index:50;
}

div#loading p {
	display:block;
	position:absolute;
	left:50%;
	top:50%;
	width:120px;
	height:56px;
	margin:-28px 0 0 -60px;
	background:url(/assets/giraffe/images/restaurants/restaurant_loading.gif) center top no-repeat;
	text-indent:-5000px;
}


/*-------------------------------
	STUFF WE LOVE
-------------------------------*/

#stuff {
	padding-top:75px;
	background:#d71451 url(/assets/giraffe/images/restaurants/stuff_background.gif) left top no-repeat;
	color:#FFF;
}

#stuff dl {
	padding:0 10px 6px;
	background:url(/assets/giraffe/images/restaurants/stuff_bottom.gif) left bottom no-repeat;
}

#stuff dl dt {
	font-size:26px;
	line-height:0;
	color:#170208;
	padding-top:8px;
	margin:8px 0 4px;
	background:url(/assets/giraffe/images/restaurants/stuff_dots.gif) center top no-repeat;
	text-transform:uppercase;
}

#stuff dl dd {
	padding:0 0 4px;
	font-size:12px;
	line-height:16px;
}

#stuff dl dd a {
	display:inline-block;
	padding:1px 4px 1px 8px;
	margin:8px 0 0;
	background:#590b23 url(/assets/giraffe/images/restaurants/stuff_arrow.gif) left center no-repeat;
	color:#d71451;
	font-weight:bold;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
}

#stuff dl dd a:hover {
	background-color:#FFF;
	color:#d71451;
}


/*-------------------------------
	CONTACT AND OPENING TIMES
-------------------------------*/

.address {
	padding-left:22px;
	background:url(/assets/giraffe/images/restaurants/icon_home.gif) left top no-repeat;
}

.phone {
	padding-left:22px;
	background:url(/assets/giraffe/images/restaurants/icon_phone.gif) left center no-repeat;
	font-size:15px;
	font-weight:bold;
}


/*---------------------
	OPENING TIMES
---------------------*/

#opening_times p {
	display:block;
	padding:0 0 2px 22px;
	margin-bottom:6px;
	font-size:12px;
	font-style:italic;
	background:url(/assets/giraffe/images/restaurants/icon_time.gif) left top no-repeat;
}

#opening_times p strong {
	font-weight:bold;
	font-size:13px;
	font-style:normal;
}


/*-------------------------------
	MENU BUTTONS
-------------------------------*/

#menu_buttons {
	display: block;
	width: 356px;
	height: 44px;
	overflow:hidden;
	margin-bottom:10px;
	background: url(/assets/giraffe/images/restaurants/menu_buttons.gif) left top no-repeat;
}

#menu_buttons li {
	display: block;
	float: left;
	margin-right:4px;
}

#menu_buttons li.drinks {
	margin-right:0;
}

#menu_buttons li a {
	display: block;
	height:44px;
	text-indent:-9999px;
}

#menu_buttons li a:hover,
#menu_buttons li a.on {
	margin:0;
	padding:0;
	background-image: url(/assets/giraffe/images/restaurants/menu_buttons.gif);
}

#menu_buttons li.brekkie a {
	width:116px;
	background-position:-0px -44px;
}

#menu_buttons li.main a {
	width:116px;
	background-position:-120px -44px;
}

#menu_buttons li.drinks a {
	width:116px;
	background-position:-240px -44px;
}