@charset "utf-8";
/************* CSS for all the standard elements used throughout the site  *****************/



/* -----------------------------------------
		 pagination paging 
	----------------------------------------- */
div.paging {
	background:#fff;
	color: #ccc;

	clear:both;
}
div.paging span {
	
	
	display: inline-block;

	text-align: center;
	font-size: 13px;
}


div.paging span.disabled {
	color: #BBB;
	padding: 5px 8px 6px 8px;
	display: inline-block;
	
	border: 1px solid #D4D4D4;
	border-radius: 4px;
	-moz-border-radius: 4px;
}
div.paging span.current {
	color: #FFF;
	background-color: #F4341A;
	border: 1px solid #722116;
	border-radius: 4px;
	-moz-border-radius: 4px;
	
	padding: 5px 8px 6px 8px;
	
	
}
div.paging span a {
	
	padding: 4px 8px 4px 8px;
	border: 1px #CCC solid;
	
	border-radius: 4px;
	-moz-border-radius: 4px;
	
	color:#333;

}
div.paging span a:hover {
	background: #F9DFD8;
	border-color: #E9AAAA; 
	
	text-decoration:none;
}
div.paging span a:active {
	background: #E9AAAA;
	border-color: #E9AAAA; 
	
	text-decoration:none;
}


div.paging span a.wording {
	
	padding: 4px 6px 4px 6px;
	
	
	
}
div.paging span a.wording:hover {
	
	
}


	/*  for all the counter (showing... of...)  */
div.pagingCounter{
	color: #666;	
	padding-top: 5px;	/* so it will align with the pagination links when on the same line (using same padding-top+1px border) */
}
div.pagingCounter .emp{
	color: #000;	
	font-weight: bold;
	
}

/* -------------------------------
		Sortby showing 
	------------------------------- */		
	

	.sortBy .title{
		font-weight: bold;
		display:inline-block;
	}
	.sortBy ul{
		list-style: none;
		display:inline-block;
	}
	.sortBy ul li{
		display:inline-block;
	}
	.sortBy ul li a{
		text-align:center;
		float: left;
		margin-left: 20px;
		text-decoration: underline;
		color:#999;
		cursor:pointer;
	}
	
	.sortBy ul li a:hover {
		text-align:center;
		float: left;
		text-decoration: underline;
		color: #F15943;
		
	}
	
	.sortBy ul li.selected a{
		color: #DA2B10;
		font-weight: bold;
		text-decoration: none;
		background: url(../img/web/ico_arrow_up_red.png) no-repeat 0px 4px;
		padding-left: 10px;		
	}
		/*arrow up for desc sorting */
		.sortBy ul li.selected.desc a{
			background: url(../img/web/ico_arrow_down_red.png) no-repeat 0px 4px;
		}
	.sortBy ul li.selected a:hover{
		text-decoration: underline;
	}
	

	


/*	========================
			Element classes
			
			classes applied to reusable elements
	======================== */


/* -----------------------------------------
			Comment display element
	----------------------------------------- */
.commentDisplay_wrapper {

	position:relative;
}
		
		.commentDisplay_wrapper .rest {
			
			font-size: 15px;	
			font-weight: bold;
						
		}
			/* the real comment box with border and light bg */
		.commentDisplay {
			background: #F5F5F6; /* #FFF url(../img/web/bg_post.png) repeat-x; */
			border: #AAA 1px solid;	
			padding: 10px 15px 10px 15px;
			margin-top: 5px;
			position: relative;
		
		}
					.commentDisplay .triangle {
						position: absolute; 
						top: 50px; 
						left: -19px;
					}
							
							
				/****** minimize/maximize btns **************/			
					.commentDisplay .minMaxBtn{
						position:absolute;
						right: 3px;
						top: 5px;
							
						height: 30px;	
						
						z-index: 2;
					}
						.commentDisplay .minMaxBtn .btn{
							border: 1px solid #BBB;
						
							width: 20px;
							height: 17px;
							float: left;
							margin-right: 3px;
							cursor: pointer;
						}
							.commentDisplay .minMaxBtn .btn:hover{
								border-color: #555;
								
								-moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.4);
								-webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.4);
								box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.4);
							}
							
							.commentDisplay .minMaxBtn .btn.minimize{
								border-color: #BBB;
								background: url(../img/web/ico_minimize_dark.png) no-repeat 4px 12px ;	
							}
							 .commentDisplay .minMaxBtn .btn.minimize:active{
									background-color: #999;
								}
							.commentDisplay .minMaxBtn .btn.maximize{																
								/* normal view means its maximize - so darken it */
								border-color: #555; 
								background: #888 url(../img/web/ico_maximize_white.png) no-repeat 4px 3px ;	
															
							}
								.commentDisplay .minMaxBtn .btn.maximize:active{
									background-color: #999;
								}
								
									 /* compact */
									 .compact .minMaxBtn .btn.minimize{
										 /* compact view means its minimize - so darken it */
										border-color: #555; 
										background: #888 url(../img/web/ico_minimize_white.png) no-repeat 4px 12px ;
										
									 }
									
									 
									 .compact .minMaxBtn .btn.maximize{
										 border-color: #BBB;	
										 background: url(../img/web/ico_maximize_dark.png) no-repeat 4px 3px ;
														 		
									 }
							
							
							
							
							
										
						.commentDisplay .noOfComment{
							font-weight: bold;
							font-size: 18px;

						}
					.commentDisplay .commentNo {
						font-weight: bold;
						font-size: 13px;
						color: #666;
						
						display: inline-block;
						margin-bottom: 5px;
					}	
					.commentDisplay .date {
						font-size: 11px;
						color: #999;
						
						display: inline-block;
					}
					
					.commentDisplay .subject {
						font-size: 17px;
						font-weight: bold;
						color: #EE3B24;
						
						padding:8px;
						padding-left: 15px;
						margin-bottom: 10px;
						
						
						margin-right: -20px;
						
					}
							.compact .commentDisplay .subject{
								font-size: 15px;
								margin-bottom: 5px;	
							}
							
					
						.commentDisplay .subject:before, .commentDisplay .subject:after{
							color: #DDCDC5;
							
							font-size: 160%;
							font-family:Georgia, "Times New Roman", Times, serif;
							
						}
						.commentDisplay .subject:before{
							content: '\201C';
							height: 0;
							margin-left: -20px;
													
						}
							.commentDisplay .subject:after {
							content: '\201D';
							
							
							}
					
					.commentDisplay p {
						font-size: 14px;
						color: #333;
						line-height: 1.5em;
						margin-top: 15px;
						margin-bottom: 0px;
							padding-left: 10px;
					}				
						.compact .commentDisplay p {
							font-size: 13px;	
						}
							.commentDisplay .viewMoreP { /* for summary truncate js to add for truncating p */
								padding-left: 10px;											
							}
							
					
					
					/* translation stuff */
					.translateComment{
						text-align: right;
						font-size: 11px;	
					}
						.translateComment.translated{
							text-align: inherit;
							font-size: 13px;
							margin-top: 20px;
							color: #999;
						}
		
		
		/* this is the hover effect of css of the socialObj actions to show when hover. needs to add all the parents the element will b in here */
		.commentDisplay_wrapper:hover > .socialObj_actions, .picDisplay_wrapper:hover> .socialObj_actions, #mainPicBig_wrapper:hover > .socialObj_actions, .commentReply_wrapper:hover > .socialObj_actions {
			display: block;	
			min-height: 120px;
		}
						/*comment reply needs to be smaller */
					.commentReply_wrapper:hover > .socialObj_actions {
						min-height: 0px;	
					}
					.commentReply_wrapper .socialObj_actions{
						top: 10px;
					}
					
		 .socialObj_actions{
			display:none;
			width: 35px;
		/*	height: 120px; */
			padding: 2px;
			
			position: absolute;
			right: -39px; /*width+paddingl+paddingr*/		
			top: 100px;
			z-index: 2;
			
			border: 1px #999 solid;
		
			background: #DEDEDE;
			
			border-top-right-radius: 5px;
			-moz-border-radius-topright: 5px; 
			
			border-bottom-right-radius: 5px;
			-moz-border-radius-bottomright: 5px;
			
			-moz-box-shadow: 1px 1px 2px  rgba(100,100 ,100 ,0.4);
			-webkit-box-shadow: 1px 1px 2pxrgba(100,100 ,100 ,0.4);
			box-shadow: 1px 1px 2px rgba(100,100 ,100 ,0.4);
		}
					
					
			 .socialObj_actions .item{
				border-bottom: 1px solid #FFF;
				padding: 5px;
				background: none;
			}
				.socialObj_actions .item.bigger{ /*less padding on left */
					padding-left: 2px;
				}
			.socialObj_actions .item:last{
				padding-bottom:10px;
			}
			.socialObj_actions .item:hover{
				
			}

				/* for pic in comment compact view, top is not too far below */
				.compact .picDisplay_wrapper .socialObj_actions{
					top: 10px;	
				}
	
	
	/*----- compact style -----*/
	
	

/* -----------------------------------------
			pic element
			
			.compact class - applied from comment level down into .pic element
	----------------------------------------- */
.picDisplay_wrapper{
	position:relative;
	float: left;
	margin-bottom: 10px;
	clear: both;
	width: 100%;
}
 	.picDisplay_wrapper.compact{
		position: relative;
		width: 163px;
		
		margin-right: 5px;	
		margin-bottom: 5px;		
		clear: none;
		
	}
	.grid_6 .picDisplay_wrapper.compact{ /* for mycomments page, narrower layout, so make the pic smaller to fit 3 pics a row */
		width: 135px;
	}

		.picDisplay_wrapper .rest {
			
			font-size: 15px;	
			font-weight: bold;
			margin-bottom: 5px;
						
		}
		.picDisplay_wrapper .date {
			
			font-size: 11px;
			margin-bottom: 2px;
			color: #666;			
		}

.picDisplay {
	
		background-color: #A6B2AB;
	border: 1px  #819187 solid;
	
			-moz-box-shadow: 2px 2px 2px #BBB;
			-webkit-box-shadow:2px 2px 2px #BBB;
			box-shadow: 2px 2px 2px #BBB;
	padding: 5px 10px 5px 10px;
 
}
	.picDisplay_wrapper.compact .picDisplay{
			padding: 3px;
			height: 130px; /* so even landscp pic horiz align with portrt pic */
	}

	.picDisplay .picDiv{
			text-align: center;
	}
	.picDisplay .picWrapper{
		border: 1px solid #666;
		background: #FFF;
		padding: 4px;
		display: inline-block;
	}
	
	.picDisplay .pic{

	}
		.picDisplay_wrapper.compact .picDisplay .pic{
			max-width: 140px;
			max-height: 120px;
		}
		.grid_6 .picDisplay_wrapper.compact .picDisplay .pic{
			max-width: 118px;
		}	
		
	.picDisplay .caption{
		margin-top: 5px;
		color:#333;
	}
		.compact .picDisplay .caption{
			display:none;
		}
		
	.picDisplay .picType{
		margin-top: 10px;
		color:#666;		
		margin-bottom: 10px;
	}
		.picDisplay_wrapper.compact .picDisplay .picType{
			display:none;
		}
		
	.picDisplay .ks-like-button{
		color: #666;		
	}
		.picDisplay_wrapper.compact .picDisplay .ks-like-button{
			display:none;
		}

/* ----------------------------------------
		Comments Minimize/Maximize all buttons 
	----------------------------------------*/
		
	 .minMaxAllBtn{

	}
		 .minMaxAllBtn .btn{
			border: 1px solid #BBB;
		
			width: 25px;
			height: 25px;
			float: left;
			
			cursor: pointer;
		}
			 .minMaxAllBtn .btn:hover{
				border-color: #666;
				
				-moz-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4);
				-webkit-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4);
				box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.4);
			}
			
			 .minMaxAllBtn .btn.minimizeAll{
				border-color: #BBB;
				background: url(../img/web/ico_minimizeAll_dark.png) no-repeat 5px 12px ;	
				
				border-radius: 3px 0 0 3px;
				-moz-border-radius:3px 0 0 3px;
			}
			 .minMaxAllBtn .btn.minimizeAll:active{
					background-color: #999;
				}
			.minMaxAllBtn .btn.maximizeAll{																
				/* normal view means its maximize - so darken it */
				border-color: #666; 
				background: #888 url(../img/web/ico_maximizeAll_white.png) no-repeat 5px 5px ;	
				
				border-radius: 0 3px 3px 0;
				-moz-border-radius: 0 3px 3px 0;							
			}
				 .minMaxAllBtn .btn.maximizeAll:active{
					background-color: #999;
				}

				 /* compact */
					  .minMaxAllBtn.compact .btn.minimizeAll{
						 /* compact view means its minimize - so darken it */
						border-color: #666; 
						background: #888 url(../img/web/ico_minimizeAll_white.png) no-repeat 5px 12px ;
						
					 }
					
					 
					  .minMaxAllBtn.compact .btn.maximizeAll{
						 border-color: #BBB;	
						 background: url(../img/web/ico_maximizeAll_dark.png) no-repeat 5px 5px ;
												
					 }			


/* -----------------------------------------
			Comment reply element
	----------------------------------------- */
.commentReply_wrapper{
	margin-top: 2px;

	
	padding: 5px 0 2px;
	border-top: 1px solid #CCC; 
	border-bottom: 1px solid #CCC;
	background: #EEE;	
	
	position: relative; /* for social obj to hover */
}

.commentReply{
		
}
	.commentReply .date{
		font-size:11px;
		color: #BBB;
	}
	.commentReply .reply{
		padding: 10px 0;
		color: #666;
		font-size: 12px;
		line-height: 1.2em;	
	}


	
/* replying box*/	
.commentReplying_wrapper {
	border: #CFCFCF 1px solid;
	margin-top: 3px; 
	background-color: #E5E5E5;
	position: relative;
}

.commentReplying{
	padding: 0 10px 5px;	
}
	.commentReplying .title{
		margin: 5px 0 1px;
		color: #819187;
		font-weight: bold;
	}
	.commentReplying textarea{
		vertical-align: bottom;	
		min-height: 1.6em;
	}


/* -----------------------------------------
			Rating element
	----------------------------------------- */
.ratingsDisplay{
	background: #FFF;
	border: #CFCFCF 1px solid;	
	padding: 5px 0px 10px 10px;
	margin: 0px 0;
	font-size: 10px;
	color:#333;
	position: relative;
}

		.ratingsDisplay .overallRating{
			margin-top: 2px;
			
		}
		.ratingsDisplay .overallStar{
		
		}
		.ratingsDisplay .distribGraphArea{	/* not used for this style */
			width: 0px;
			height: 0px;
			display: none;
		}
		.ratingsDisplay .distribGraphArea .distribGraphs{	/* not used for this style */

			
		}
		
		.ratingsDisplay .subcats{	/* wrapper for all subcats */
			margin-top: 10px;
			
		}
		.ratingsDisplay .subcatRating{
			margin-top: 2px;
			
		}
		.ratingsDisplay .subcatRating .subcatNumRatings{
			display: inline;
			color: #999;
			
		}
		.ratingsDisplay .subcatStar{
			vertical-align: middle;
		}

.ratingsDisplay.large{
	border: none; /* no border for this large style - used on restPage overall stars */	
	padding-left: 0px;
}

/** another rating style - for hidden subcats that shown when hover **/
.ratingsDisplay_subcatsHidden{
	/* background: #F9F4E1; */
	background: none;
	border: none;
	padding: 0px;
	margin: 0px 0px 0px 0px; /* -5px; if in the future want extra space to add 4 figure num of vote, can use this -5px to move leftward for more room */
	font-size: 10px;
	color:#333;
	position: relative;
	height: 20px;
	
	padding-left: 14px;
			background: url(../img/web/ico_arrow_moreRatings.png) 1px no-repeat;
}

		.ratingsDisplay_subcatsHidden .overallRating{
			margin-top: 2px;
			float: left;
			margin-left: 1px;
			float: right;
			
		}
		.ratingsDisplay_subcatsHidden:hover{
				background: url(../img/web/ico_arrow_moreRatings_ov.png) 1px no-repeat;
				outline: #999 1px dotted;
		}
		.ratingsDisplay_subcatsHidden .overallStar{
			vertical-align: -2px;
		}
		.ratingsDisplay_subcatsHidden .numOverallRating{
			float: left;
			position: relative;
			top: 5px;	/* move the text down a bit coz default its too high */
			margin-left: 5px;
		}
		
		/***** distrib graph is not yet available in this version ****
		.ratingsDisplay_subcatsHidden .distribGraphArea{
			width: 30px;
			height: 17px;
			display: inline-block;
			background: transparent url(../img/web/ico_graphDistrib.png) right  no-repeat;
		}
				.ratingsDisplay_subcatsHidden .distribGraphArea:hover{
					
					background: transparent url(../img/web/ico_graphDistrib_ov.png) right  no-repeat;
				}
				.ratingsDisplay_subcatsHidden .distribGraphArea:hover .distribGraphs, .ratingsDisplay_subcatsHidden .distribGraphArea .distribGraphs:hover{
					
					display: block;
				}
				.ratingsDisplay_subcatsHidden .distribGraphArea .distribGraphs{	
		
					display: none;
					position: absolute;
					top: 20px;
					left: 50px;
					width: 150px;
					height: 100px;
					padding: 5px;
					border: 2px #333 solid; 
					background: #FFF;
					z-index: 2;
					
				}
				END distribGraph */
		
		.ratingsDisplay_subcatsHidden .subcats{	/* wrapper for all subcats */
			margin-top: 0px;
			padding: 5px;
			border: #333 2px solid;
			background: #FFF;
			position: absolute;
			top: 18px;
			left: 5px;
			width: 140px;
			display: none;
			z-index: 50;
			
			/**drop shadow **/
			-moz-box-shadow: 2px 2px 2px  rgba(100,100 ,100 ,0.5);
			-webkit-box-shadow: 2px 2px 2pxrgba(100,100 ,100 ,0.5);
			box-shadow: 2px 2px 2px rgba(100,100 ,100 ,0.5);

					
		}
		.ratingsDisplay_subcatsHidden:hover .subcats, .ratingsDisplay_subcatsHidden.subcats:hover {  
			display: block; 
		}
		
		.ratingsDisplay_subcatsHidden .subcatRating{
			margin-top: 2px;
			
		}
		.ratingsDisplay_subcatsHidden .subcatRating .subcatNumRatings{
			display:inline;
			color: #999;
			
		}
		
		.ratingsDisplay_subcatsHidden .subcatStar{
			vertical-align: middle;
		}

/* -----------------------------------------
			Rest result element
	----------------------------------------- */
.restResult{
	background: #F5F5F6;
	border: #C4C4C4 1px solid;
	position: relative;
}
.restResult:hover{
	
	border: #666 1px solid;

}
		/** ---- generic classes to apply to wide items --- */	
			/** colume lef, mid right **/
			.restResult .left{
				margin-left: 10px;
				float: left;
				width: 348px; 	/* this one is for max left column (header and footer) - main left column (main pic) will b smaller overridden bellow */
			}
			.restResult .center{
				margin-left: 10px;
				float: left;
				width: 254px;	/* only used for the main row for now */
			}
			.restResult .right{
				margin-right: 10px;
				float: right;
				text-align: right;
				width: 140px;
			}

			/** row, header, main, footer **/
			.restResult .header, .restResult .footer{
				margin-top: 10px;
				
			}
			.restResult .main{
				margin-top: 5px;	
			}
			.restResult .header_wrapper{
				
			}
			
			.restResult .main_wrapper{
				
				position: relative;
			}
			.restResult .footer_wrapper{
				
				position: relative;
			}
			
			.restResult  .greyerBg{	 /* for bld header and footer */
				background-color: #E8E8E9;
				padding-bottom: 5px;
			}
			
			
			/**** overriding for specific column ***/
			.restResult .header.left{
				margin-left: 30px;	/*extra space for the left column of the header row, to avoid the marker on the left */
				width: 348px; 	/*bc there's the extra margin left on the left header column, gotta shrink the width down 20 more px */
			}
			.restResult .main.left{
				width: 100px; /** for main pic display **/
			}
			
			.restResult .footer.right{ /** for bld footer, it will be wider than normal **/
				width: 394px;
			}
			.restResult .footer.left{ /** for bld footer, it will be wider than normal **/
				width: 100px;
			}
			
			/******* special narrower restResult layout (minus 80 px (60px for grid and 20px for margin)) ************/
				.restResult_wrapper.grid_6 .header.left{
					width: 268px;	
				}
				.restResult_wrapper.grid_6 .center{
					width: 174px;	
				}
				.restResult_wrapper.grid_6 .footer.right{
					width: 314px;	
				}
			
			/******* end special narrower restResult ************/
			
			
				/** line to seperate each restaurants in a bld **/
			.restResult .line{
				border-bottom: 1px #C4C4C4 solid;
				margin: 0px 10px 0px 10px;
			}
			
			
			/**** each info piece ****/
			.restResult .markerNo, .restResult .markerNo_default{ /* markerNo_default is for Jquery template */
				position: absolute;
				top: -7px;
				left: -15px;
				width: 37px;
				z-index: 2;
			}
			
			.restResult .bldName{
				font-size: 16px;
				font-weight: bold;					
			}
			.restResult .numRestsInBld{
				font-size: 11px;
				color:#999;
				margin-top: 5px;

			}
			.restResult .bldAddr, .restResult .btsMrtName{
				font-size: 13px;
				color:#666;
				margin-bottom: 5px;
				
			}
			.restResult .restName{
				font-size: 16px;
				font-weight: bold;	
				float: left;
			}
			.restResult  .restTypes{
				float: left;
				clear: left;
				font-size: 12px;
				color:#333;
			}
			.restResult  .restChainName{
				float: left;
				clear: left;
				font-size: 12px;
				color:#999;
				padding-top: 5px;
			}
				.restResult .restChainName a{	
					background: url(../img/web/ico_chain_tiny2.png) no-repeat;
					min-height: 12px;
					padding-left: 15px;
					display: inline-block;
					font-weight: bold;
				}
			.restResult  .priceRange{
				float: left;
				clear: left;
				font-size: 12px;
				color:#666;
				margin-top: 10px;
				background: url(../img/web/ico_priceRange_c.png) no-repeat;
				min-height: 13px;
				padding-left: 19px;
				
			}
			
			.restResult .ratings{				
				text-align: left;
			}
			
			.restResult .numPics, .restResult .numComments{				
				display:inline-block;
			}			
			.restResult .numPicsComments{				
				font-size: 12px;
				color:#333;
			}
			
			.restResult .inBldAddr {				
				
				/* margin-top: 20px; */
				font-size: 12px;
				color:#666;
				
			}
			
			.restResult .restAddr_wrapper{
				margin-top: 20px;
			}
			.restResult .restBldName{				
				font-size: 12px;
				color:#666;
		
			}
				.restResult .restBldName a{	
					background: url(../img/web/ico_bld_mini.png) no-repeat;
					min-height: 14px;
					padding-left: 15px;
					font-weight: bold;
				}
				
			.restResult .restAddr{	
				margin-top: 5px;			
				font-size: 11px;
				color:#666;
				
			}
			 .restResult .restTel{				
				font-size: 13px;
				color:#666;				
			}
			
			
			.restResult .moreRests{
				font-size: 11px;
				color:#999;

			}
			

			
			
			.restResult .headerInfo{
				float: left;
				clear: left;
				
				margin: 10px 10px 0px 10px;
				width: 280px;
				
			}

			.restResult{
				
				
			}
			.restResult .headerInfo .name{
				font-size: 14px;
				font-weight: bold;
				float: left;
				clear: left;
				margin-left: 20px;
			}

			
			.restResult .ratings.forBld{				
				position: absolute;
				right: 10px;
				top: 0px;
			}
			
			.restResult .ratings.forBld{				
				position: absolute;
				right: 10px;
				top: 40px;
			}
			.restResult .ratings.forRest{				
				position: absolute;
				right: 10px;
				top: 0px;
			}
			
			.restResult .numPicsComments.forBld{				
				position: absolute;
				right: 10px;
				top: 70px;
				
				font-size: 10px;
				color:#666;
			}
			.restResult .numPicsComments.forRest{				
				position: absolute;
				right: 10px;
				top: 30px;
				
				font-size: 10px;
				color:#666;
			}
			
			
			.restResult .restPic, .restResult .restPic_default{	/* restPic_default is for Jquery template */
				float: left;
				clear: left;
				
				width: 100px;
				

			}
				/* span to cover img  */
			.restResult  .imgWrapper {
					border: 	1px #999 solid;
					display: inline-block;
					background: #FFF;
					padding: 2px;
				}
				.restResult  .imgWrapper img{
					max-width: 90px;
					max-height: 90px;
				}
				.restResult .restPic .multiple {	/** special class to add extra imgs to give image stack look - as an affordance if there're hidden imgs to show when hover */
					border-bottom: 4px #666 double;
					border-right: 4px #999  double;
				}
			
			.restResult .midInfo{
				float: left;
				margin: 10px 0px 0px 10px;
				
				font-size: 10px;
				color:#666;
	
			}
			
		
			
			
			/* can't do this one bottom align unless doing absolute position */
			.restResult .rightInfo{
				text-align: right;
				color:#999;
				font-size: 10px;
				width: 140px;
				position: absolute;
				bottom: 20px;
				right: 10px;
					
			}
					.restResult .rightInfo .tel{
						font-size: 13px;
					}
					
	/* -----------------------------------------
			rest result for ggMap Infowin 
	----------------------------------------- */		
	#globalGMapsInfoWindow {
		width: 280px;	
		
		padding-bottom: 10px;
	}
	
			#globalGMapsInfoWindow  .header{
				position: relative;
				padding: 10px;
				padding-left: 20px; /* for markerNo icon on the left */
			}
			
			#globalGMapsInfoWindow .rests{ /* wrap around all rests - will have scrollbar if too tall */
				overflow:auto;
				max-height: 230px;
			}
			
			#globalGMapsInfoWindow  .left{
				width: 100px;
				float: left;
				padding-left: 5px;
				
			}
			#globalGMapsInfoWindow  .right{
				width: 130px;
				float: left;
				padding-right: 5px;
			}
	
	
	#globalGMapsInfoWindow .markerNo{
		position: absolute	;
		top:-10px;
		left: -10px;
	}
	#globalGMapsInfoWindow .header_wrapper{
		margin-left: 30px;	
	}
		#globalGMapsInfoWindow .restName{
			font-size: 15px;
			font-weight: bold;
		}
		#globalGMapsInfoWindow .ratings{
			
		}
		#globalGMapsInfoWindow .imgWrapper img{
			padding: 2px;
			border: 1px solid #AAA;
		}
		#globalGMapsInfoWindow .main.left{
			float: left;
			margin-right: 5px;	
		}
		
		#globalGMapsInfoWindow .restTypes{
			margin-bottom: 5px;
			color: #999;
			font-size: 11px;
		}
		#globalGMapsInfoWindow .restChainName{
			margin-top: 5px;
			color: #999;
			font-size: 11px;
		}
		#globalGMapsInfoWindow .priceRange{

				font-size: 11px;
				color:#666;
				margin-top: 10px;
				background: url(../img/web/ico_priceRange_c.png) no-repeat;
				min-height: 13px;
				padding-left: 19px;
				
				
			}
		#globalGMapsInfoWindow .numPicsComments{
			margin-top: 5px;	
			clear: both;
		}
		#globalGMapsInfoWindow .restAddr_wrapper{
			margin-top: 15px;	
		}
		#globalGMapsInfoWindow .restAddr{
			color: #999;
			font-size: 11px;
		}
		#globalGMapsInfoWindow .bldAddr, #globalGMapsInfoWindow .btsMrtName{
				font-size: 13px;
				color: #666;
				margin-top: 5px;
				margin-bottom: 5px;
				
		}
		#globalGMapsInfoWindow .restAddr{
				font-size: 11px;
				color: #999;
				margin-top: 10px;
				margin-bottom: 5px;	
				text-align: right;			
		}
		
		#globalGMapsInfoWindow .restTel {
			font-size: 11px;
			color: #666;
			text-align: right;	
		}
		
		
		#globalGMapsInfoWindow .restBldName{
				font-size: 15px;
				font-weight: bold;		
				margin-bottom: 5px;
		}

		/* ---- for bld ---- */
		#globalGMapsInfoWindow .bld .header{
			
			border-bottom: 1px solid #BBB;
			background: #E8E8E9;	
			padding-left: 25px; /* for markerNo icon on the left */
		}
		#globalGMapsInfoWindow .bld .restAddr{
			
			font-size: 11px;
			text-align: left;
			margin-bottom: 0;
			margin-top: 3px;
			color: #888;
		}
		#globalGMapsInfoWindow .bld .markerNo{
			left: -18px;
		}
		#globalGMapsInfoWindow .bld .aRest{
			padding: 3px 0;
			
				border-bottom: 1px dashed #CCC;
		}
		#globalGMapsInfoWindow .bld .left{
			width: 75px;
		}
		#globalGMapsInfoWindow .bld .right{
			width: 175px;
		}
			
		#globalGMapsInfoWindow .bld .restName{
			font-size: 13px;
		}
		#globalGMapsInfoWindow  .bld .imgWrapper img{
			padding: 2px;
			border: 1px solid #AAA;
			max-width: 60px;
		}
		#globalGMapsInfoWindow .bld .inBldAddr{
				font-size: 11px;
				color: #999;
				margin-top: 10px;
				margin-bottom: 5px;	
				text-align: right;			
		}
		
/* -----------------------------------------
			Like element - probly obsolete
	----------------------------------------- */
/* old one - obsolete */	
.like{
	margin-top: 5px;
	color: #666;	
}
	.like .iconLike{
		vertical-align: -2px;	/* align the like icon with the text */
	}
	
/* new one by komsit */
.ks-like-button{
	font-size: 11px;	
	color: #666;
}
	


/* -----------------------------------------
			mini profile
	----------------------------------------- */	
.miniProfile
{
	
}
	.miniProfile a{
		border: none; /*prevent weird blue border chrome bug */	
	}
	.miniProfile .picWrapper{
		border: 1px #BBB solid;
		padding: 2px;
		background: #FFF;
		display: inline-block;
	}
		.miniProfile .picWrapper.member{
			border-color: #999;
		}
		.miniProfile .picWrapper.member:hover{
			border-color: #333;
		}
		.miniProfile .picWrapper.nonmember{
			border-style: dashed;
		}
		
	.miniProfile .username{
		
		font-size: 11px;
		text-align:center;
		line-height: 1.5em;
	}
	.miniProfile .nonmember_name{
		
		font-size: 11px;
		color: #666;	
		text-align:center;
	}
	.miniProfile .nonmember{
		font-size: 10px;
		color: #AAA;	
	}

/* -----------------------------------------
			backToTop element
	----------------------------------------- */
.backToTop 
{
	float: right;
	clear: right;
	
}
		.backToTop a{
			color:#BBB;
			border-bottom: dotted 1px #BBB;
			text-decoration:none;
		}
		.backToTop a:hover{
			color:#666;
			border-bottom: dotted 1px #666;	
			text-decoration:none;
		}
		
		
/* -----------------------------------------
			ngi Feedback
			- floating on all pages
	----------------------------------------- */
	
#ngiFeedbackTab{
	position:fixed;
	cursor: pointer;
	top: 130px;
	right: -30px;
	z-index: 999999;
}
	#ngiFeedbackTab:hover{
		right: -16px;
	}
	#ngiFeedbackTab:active{
		top: 135px;	
	}
	
#ngiFeedbackPopup{
	width: 500px;
	height: 550px;
	padding: 5px 10px;
	position: absolute;
	top: 150px;
	right: 200px;
	z-index: 99999;
	
	display:none;
	border: 6px #333 solid;
	background: #E3E3E3;
	
	-moz-box-shadow: 3px 3px 2px  rgba(100,100 ,100 ,0.4);
	-webkit-box-shadow: 3px 3px 2px rgba(100,100 ,100 ,0.4);
	box-shadow: 3px 3px 2px rgba(100,100 ,100 ,0.4);
	

}


	#ngiFeedbackPopup .header_wrapper{
		background: #F4341A;
		
		position: relative;
	}
	#ngiFeedbackPopup .header{
		padding: 5px 15px;
		color:#FFF;
		font-size: 19px;
	}
	
	#ngiFeedbackPopup #closeBtn_ngiFeedbackPopup{
					position: absolute;
				top: -15px;
				right: -10px;
				background: url(../img/web/btn_close_ngiFeedback.png) no-repeat;
				cursor: pointer;
				width: 37px;
				height: 37px;
				
				
	}
	
	#ngiFeedbackPopup .bodyHeader {
		color: #999;
		margin: 10px 0;
		padding: 0px 10px;
		line-height: 1.3em;
	}
	
	#ngiFeedbackPopup #closeBtn_ngiFeedbackPopup:hover{
				background: url(../img/web/btn_close_ngiFeedback_ov.png) no-repeat;
	}
	
	#ngiFeedbackPopup .body{
		line-height: 1.3em;
		
		border: 1px solid #BBB;
		background: #FFF url(../img/web/bg_ngiFeedback.png) right 95px no-repeat;
		padding: 0px 10px 10px;
		margin-top: 5px;
		
		height: 430px;
		overflow: scroll;
		
	}
			
					
			#ngiFeedbackPopup .body#bodyDone{
				line-height: 2em;
				background: none;
				padding-top: 20px;
			}
	
	#ngiFeedbackPopup .body label{
		display: block;
		margin-top: 15px;
	}
		#ngiFeedbackPopup .body label.required{
			font-weight: bold;
		}
				#ngiFeedbackPopup .body label.required:after{
						content: '*';
						color:#F4341A;
				}
	
	#ngiFeedbackPopup .body label.labelForChkbox{
		font-weight: bold;
		color:#F4341A;
		font-size: 13px;
		display: inline;
	}
	
	#ngiFeedbackPopup .body input[type=text], #ngiFeedbackPopup .body textarea{
		width: 350px;
	}
	
	#ngiFeedbackPopup .ngiFeedback_preloader{
		display:none;	
	}