/*----------------------------------------------
	MENUS.CSS
	Author:		Engage Interactive
	Requires:	reset.css
				global.css
----------------------------------------------*/

h2.title_menus {
	position:relative;
	display:block;
	width:613px;
	height:106px;
	text-indent:-5000px;
	background:url(/assets/giraffe/images/menus/menus_title_new.gif);
}

h2.title_menus a {
	display:block;
	position:absolute; left:261px; top:97px;
	width:98px;
	height:26px;
}

.big_note {
	padding:5px 10px;
	margin:0 18px 10px 0;
	background:#D71451;
	color:#FFF;
	text-shadow:1px 1px 0 #c70860;
}

.big_note h3 {
	color:#FFF;
	font-size:28px;
	margin-bottom:4px;
}

.big_note p.intro {
	font-size:14px;
	line-height:18px;
	margin-bottom:5px;
}

.big_note p.intro a {
	background:#f6dae7;
	color:#D71451;
	text-decoration:none;
	text-shadow:none;
	padding:0 2px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
}

.big_note p.intro a:hover {
	background:#FFF;
	color:#D71451;
	margin:0;
	text-decoration:none;
	text-shadow:none;
}

/*h2.title_menus {
	display:block;
	width:613px;
	height:112px;
	text-indent:-5000px;
	background:url(/assets/giraffe/images/menus/menus_title.gif);
}*/

#tips {
	padding:10px 10px 1px 10px;
	background:#FFF;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	font-style:italic;
	margin:0 20px 15px 0;
}

#tips strong {
	display:block;
	margin-bottom:4px;
}

#menu_list p.note {
	margin-right:18px;
}

/*-------------------------------
	MENUS NAVIGATION
-------------------------------*/

#menu_categories {
	margin-bottom:0;
}

#menu_categories h2 {
	width:215px;
	height:58px;
	margin:0;
	background:#ACBD03 url(/assets/giraffe/images/menus/categories_background.gif) 0 -8px no-repeat;
}

#menu_categories h2 a {
	display:block;
	width:215px;
	height:58px;
	background:url(/assets/giraffe/images/menus/categories_home.gif);
	text-indent:-5000px;
}

#menu_categories h2 a:hover,
#menu_categories h2 a.on {
	background-position:0 100%;
}

#menu_categories ul.page_nav {
	height:195px;
	padding:0 8px;
	background:#ACBD03 url(/assets/giraffe/images/menus/categories_background.gif) 0 -66px no-repeat;
	overflow:hidden;
}

#menu_categories span.categories_footer {
	display:block;
	height:8px;
	margin-bottom:5px;
	background:#ACBD03 url(/assets/giraffe/images/menus/categories_background.gif) 0 0 no-repeat;
}

#menu_categories ul.page_nav li {
	margin-bottom:3px;
}

#menu_categories ul.page_nav li.last {
	margin-bottom:0;
}

#menu_categories ul.page_nav li a {
	display:block;
	width:179px;
	height:27px;
	padding:3px 10px 0;
	color:#e4ff01;
	font-size:25px;
	text-transform:uppercase;
	line-height:10px;
}
#menu_categories ul.page_nav li a:hover,
#menu_categories ul.page_nav li a.on {
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	background:#224401;
	text-decoration:none;
}

#menu_categories ul.extras {
	padding:8px 0 0 8px;
	height:70px;
	background:#ACBD03;
}

#menu_categories ul.extras li {
	display:block;
	height:38px;
	float:left;
}

#menu_categories ul.extras li a {
	display:block;
	text-indent:-5000px;
	background-image:url(/assets/giraffe/images/menus/extras_nav.gif);
}

#btn_kids a {
	width:78px;
	height:32px;
	margin:0 6px 6px 0;
	background-position:0 0;
}

#btn_kids a:hover,
#btn_kids a.on {
	background-position:0 -32px;
}

#btn_specials a {
	width:115px;
	height:32px;
	margin-bottom:6px;
	background-position:-78px 0;
}

#btn_specials a:hover,
#btn_specials a.on {
	background-position:-78px -32px;
}

#menu_categories ul.extras #btn_lunch4less {
	clear:both;
	float:none;
	padding-right:8px;
	display:block;
}

#btn_lunch4less a {
	width:167px;
	height:32px;
	margin:auto;
	background-position:-193px 0;
}

#btn_lunch4less a:hover,
#btn_lunch4less a.on {
	background-position:-193px -32px;
}


/*-------------------------------
	MENU ITEMS
-------------------------------*/

#menu_items {
	margin:0;
}
#menu_items .featured {
	width:184px;
	height:193px;
	padding:10px 7px 7px 10px;
	background:#FF9700 url(/assets/giraffe/images/menus/menu_background.gif);
}

#menu_items .promotion {
	width:201px;
	height:210px;
	padding:0;
}

#menu_items .column .menu_item {
	position:relative;
	width:181px;
	height:161px;
	margin-bottom:3px;
	overflow:hidden;
	cursor:pointer;
}

#menu_items img {
	margin-bottom: 0;
}


/*---------------------
	CLEVER STUFF
*/

#menu_items a.more_info {
	position:relative;
	display:block;
	float:right;
	width:79px;
	height:22px;
	margin-top:7px;
	overflow:hidden;
}

#menu_items a.more_info span.corners {
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:79px;
	height:22px;
	background:url(/assets/giraffe/images/menus/corners.png);
	z-index:20;
}

#menu_items a.more_info span.bg {
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:138px;
	height:22px;
	background:url(/assets/giraffe/images/menus/button_more.gif) 0 0;
	text-indent:-5000px;
	z-index:10;
}

#menu_items a.more_info:hover span.bg {
	background-position:0 -22px;
}

#menu_items a.view_section {
	position:relative;
	display:block;
	float:right;
	width:144px;
	height:22px;
	margin-top:7px;
	background:url(/assets/giraffe/images/menus/button_category.gif) 0 0;
	text-indent:-5000px;
}

#menu_items a.view_section:hover {
	background-position:0 100%;
}


#menu_items .column .menu_item h3,
#menu_items .column .menu_item p {
	position:absolute;
	left:0;
	margin-bottom:0;
	background:url(/assets/giraffe/images/menus/black.png);
	color:#FFF;
}

#menu_items .column .menu_item h3 {
	position:absolute;
	bottom:-161px; /*-- Keep it out the way for now --*/
	width:165px;
	padding:6px 8px 8px;
	text-transform:uppercase;
	font-size:26px;
	line-height:0;
}

#menu_items .show_title .menu_item h3 {
	bottom:0;
}

#menu_items .column .menu_item p {
	position:absolute;
	left:0;
	top:-161px;
	width:157px;
	height:149px;
	padding:12px 12px 0;
	font-size:12px;
	font-style:italic;
}


/*-------------------------------
	MENU LIST
-------------------------------*/

#menu_list {
	padding-right:0;
	margin-right:5px;
	clear:both;
}

#menu_list .column {
	padding-right:12px;
	margin-bottom:0;
}
#menu_list .two_columns .column {
	width:390px;
}
#menu_list .three_columns .column {
	width:254px;
}

#menu_list .two_columns .column div {
	padding-bottom:8px;
}

#menu_list dl {
	position:relative;
	padding:10px 50px 10px 10px;
	margin-bottom:5px;
	border:solid 1px #DFDBD1;
	background:#e6e2d8;
	
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}
#menu_list dl.featured {
	min-height:50px;
	padding:9px 49px 9px 34px;
	background-position:left center;
	background-repeat:no-repeat;
}

#menu_list dl dt {
	font-size:1.4em;
	font-weight:bold;
}

.cufon-active #menu_list dl dt {
	font-size:20px;
	line-height:0;
}

#menu_list dl dt img {
	display:inline-block;
	padding-left:2px;
	margin-bottom:1px;
}

#menu_list dl dt span {
	position:absolute;
	right:10px;
	top:10px;
}

#menu_list dl dd {
	margin-top:2px;
	font-size:1.3em;
}

#menu_list dl dd p  {
	margin-bottom:0;
}

#menu_list dl dd.small {
	padding-top:4px;
	font-style:italic;
	font-size:1.1em;
	color:#83644e;
}

#menu_list dl .extra {
	padding-top:8px;
}


/*---------------------
	ERROR BANNER
*/

#menu_list dl dd.limited {
	position:absolute;
	right:-1px;
	bottom:-1px;
	width:50px;
	height:50px;
	margin:0;
}

#menu_list dl.featured dd.limited {
	right:-2px;
	bottom:-2px;
}

#menu_list dl dd.limited span {
	display:block;
	width:50px;
	height:50px;
	background:url(/assets/giraffe/images/menus/limited.gif);
	text-indent:-5000px;
}


/*-------------------------------
	COLOURS
-------------------------------*/

/*---------------------
	GREEN
*/

h3.green,
.cufon-active #menu_list .green h3 {
	color:#5A9F3A;
}

#menu_list .green dl.featured {
	border:solid 2px #5A9F3A;
	background-image:url(/assets/giraffe/images/menus/featured_green.gif);
}


/*---------------------
	BLUE
*/

h3.blue,
.cufon-active #menu_list .blue h3 {
	color:#1594CF;
}

#menu_list .blue dl.featured {
	border:solid 2px #1594CF;
	background-image:url(/assets/giraffe/images/menus/featured_blue.gif);
}


/*---------------------
	PURPLE
*/

h3.purple,
.cufon-active #menu_list .purple h3 {
	color:#9200b9;
}

#menu_list .purple dl.featured {
	border:solid 2px #9200b9;
	background-image:url(/assets/giraffe/images/menus/featured_purple.gif);
}


/*---------------------
	PINK
*/

h3.pink,
.cufon-active #menu_list .pink h3 {
	color:#d71451;
}

#menu_list .pink dl.featured {
	border:solid 2px #d71451;
	background-image:url(/assets/giraffe/images/menus/featured_pink.gif);
}


/*---------------------
	ORANGE
*/

h3.orange,
.cufon-active #menu_list .orange h3 {
	color:#ff8400;
}

#menu_list .orange dl.featured {
	border:solid 2px #ff8400;
	background-image:url(/assets/giraffe/images/menus/featured_orange.gif);
}


/*-------------------------------
	TOOLTIP
-------------------------------*/

#tooltip {
	display:none;
	position:absolute;
	width:181px;
	height:170px;
	padding:6px;
	background:url(/assets/giraffe/images/menus/tooltip.png);
	z-index: 3000;
}

#tooltip span.loading {
	display:block;
	padding-top:94px;
	background:url(/assets/giraffe/images/menus/loading.gif) 50% 69px no-repeat;
}
#tooltip img {
	position:absolute;
	left:6px;
	top:6px;
}

#msg_tooltip {
	display:none;
	position:absolute;
	width:161px;
	padding:10px;
	background:#e11c1c;
	font-size:12px;
	color:#FFF;
	z-index: 3000;
	
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
}


/*-------------------------------
	KEY
-------------------------------*/

#key {
	clear:both;
	margin-right:18px;
	padding-top:24px;
	background:url(/assets/giraffe/images/template/dotted_line.gif) 0 4px repeat-x;
}

#key span {
	display:inline-block;
	padding:2px 0 2px 20px;
	background-position:left center;
	background-repeat:no-repeat;
}


/*---------------------
	ICONS
*/

.vegi {
	background-image:url(/assets/giraffe/images/menus/icon_vegi.gif);
}
.nuts {
	background-image:url(/assets/giraffe/images/menus/icon_nuts.gif);
}
.fav {
	background-image:url(/assets/giraffe/images/menus/icon_fav.gif);
}
.photo {
	background-image:url(/assets/giraffe/images/menus/icon_photo.gif);
}
.bb {
	background-image:url(/assets/giraffe/images/menus/icon_bb.gif);
}
.giraffetime {
	background-image:url(/assets/giraffe/images/menus/icon_giraffetime.gif);
}
.alert {
	background-image:url(/assets/giraffe/images/menus/icon_alert.gif);
}


/*-------------------------------
	BACK TO TOP
-------------------------------*/

a#backtotop {
	display:none;
	position:absolute;
	left:48px;
	bottom:62px;
	width:42px;
	height:49px;
	background:url(/assets/giraffe/images/menus/backtotop.gif) left top;
	text-indent:-5000px;
}

a#backtotop:hover {
	background-position:left bottom;
}


/*-------------------------------
	OPENING TIME
-------------------------------*/

#available_time {
	position:absolute;
	left:18px;
	top:406px;
	width:72px;
	height:98px;
}

.now {
	background:url(/assets/giraffe/images/menus/times/serving_now.gif) 0 100% no-repeat;
}

#available_time div {
	width:72px;
	height:98px;
	background:url(/assets/giraffe/images/menus/times/time_background.png);
	text-indent:-5000px;
}

#available_time div span {
	position:absolute;
	display:block;
	width:72px;
	height:27px;
	top:68px;
	text-indent:-5000px;
}


/*---------------------
	TIMES
*/

.t_12-4 span {
	background:url(/assets/giraffe/images/menus/times/12-4.gif);
}

.t_9-12 span {
	background:url(/assets/giraffe/images/menus/times/9-12.gif);
}

.t_12-late span {
	background:url(/assets/giraffe/images/menus/times/12-late.gif);
}