@charset "utf-8";
/*** all styles for all pages ***/

/* -----------------------------------
		Text style
	----------------------------------- */
h1, h2 {
	color: #F43C1A;	
}

.medTitle {
	color: #819187;	/* color:#413A34 ; */
	border-bottom: 1px #999 solid;
	
}

.light{
	color: #666;	
}

.lighter{
	color: #999;	
}
.bold{
	font-weight: bold;	
}

.inline{
	display: inline;	
}
/* -----------------------------------
		misc. classes
	----------------------------------- */
#officialInfoBg{
	background-color: #F9F4E1;
	border-top: #819187 1px dashed;
	border-bottom: #819187 1px dashed;
	padding: 5px 0px 10px 0px;

	min-height: 80px;
}

#officialInfoBg.darker{ /*now this is used on comment search page */
	background-color: #E9D7C4;
}

.tmp{
	height: 100px;
	background:#999;
}

.tmp2{
	background:#666;
}


/* ====================
					page styles
					
					styles applied to specific region on each page (using id of the region)
	==================== */
	
	
	
/* ---------------------------------------
			view_rest  page
	---------------------------------------- */
	
/*-- official info --*/	
#bigTitleHeader{
	padding-bottom: 5px;
}
	#bigTitleHeader .building,  #bigTitleHeader .restChain, #bigTitleHeader .rest  {
        padding-left: 50px;
     min-height: 40px; 
	  /*  line-height: 40px; */
        vertical-align: bottom;
    }
    #bigTitleHeader .building {
        background: url('../img/web/markers/ico_marker_bld.png') no-repeat bottom left;
    }
	#bigTitleHeader .restChain {
        background: url('../img/web/markers/ico_marker_restChain2.png') no-repeat bottom left;
    }
	#bigTitleHeader .rest {
        background: url('../img/web/markers/ico_marker_rest_bigger.png') no-repeat bottom left;
    }
	/** for link in the rest name big title **/
    #bigTitleHeader a{
        color: #F43C1A;	/** same orangeRed color, but add underline **/
        text-decoration: underline;
    }
	#bigTitleHeader a:hover{
		color: #005493;	 /** same blue when hovered of normal link **/
		text-decoration: underline;
	}

#allRestCats { color: #4f493b; }
#allRestCats .numRests, #allRestCats .branchOf { margin: 0 0 12px 0; }
	#allRestCats .numRests, #allRestCats .branchOf a{ font-weight:bold; }
	#allRestCats .numRests, #allRestCats .branchOf  .logo	/* for rest page */
	 { margin: 5px 0 10px; }

#allRestCats .editLink { margin: 0 0 1em 0; }

#allRestCats .tagContainer { clear: both; font-size: 11px; padding: 0.5em 0; }
#allRestCats .tagContainer .label { color: #F4341A;  font-weight: bold;}
#allRestCats .tagContainer .tag { margin-bottom: 5px; }

#restAddedBy{
	font-size: 11px;
	color: #999;
}

#officialInfoBg .label{
	color: #F4341A;
	font-weight: bold;
}

#officialInfoBg .contactInfo .phone {
    background: url('../img/web/ico_phone.gif') no-repeat top left;
    line-height: 25px;
    padding-left: 20px; margin-bottom: 0.5em;
    font-size: 1.5em;
}

#officialInfoBg .contactInfo .address {
    
    margin-bottom: 1em;
    color: #777;
}
	
#officialInfoBg  .bld{
	margin-top: 5px;
	margin-bottom: 10px;	
	color: #000;
}
	#officialInfoBg  .st_addr{
		margin-left: 18px;
	}
	
	
#officialInfoBg .contactInfo .website { clear: both; line-height: 1.3em;  margin-bottom: 5px;}

/*#officialInfoBg .contactInfo .website .label { float: left; width: 90px; } 
#officialInfoBg .contactInfo .website .link { float: left; }*/

#officialInfoBg .openHour { padding: 1em 0; }
/* #officialInfoBg .openHour .label { font-weight: bold; }
#officialInfoBg .openHour .openhouritem { padding-left: 1em; } */

#officialInfoBg .logo.big {	/*chain page */	
	margin-bottom: 10px;	
}
	#officialInfoBg .logo.big img{
		max-width: 210px;	
		max-height: 120px;	
		padding: 3px;
		border: 1px solid #AAA;
		background: #FFF;
	}

#allRatings_wrapper{
	-moz-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.4);
	-webkit-box-shadow:  0px 0px 9px rgba(0, 0, 0, 0.4);
	box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.4);
}
	#allRatings{
		border: #819187 1px solid;
		background: #fff;
		padding: 10px;
		color: #666;
		
	}
	#ratingsOfChain{
		font-size: 11px;
		color: #999;
		margin: 5px 0;
	}
	
#actionPod_wrapper{
	position:relative; /*so we can make actionPod abs pos so it wont push the pics/stars section  down too much */
}
	#actionPod{
		border: #819187 1px solid;
		background: #FFF;
		position:absolute;
	}	
		#actionPod .header{
			background: #819187;
			color: #FFF;
			font-size: 15px;
			
			padding: 10px;
		}
			#actionPod .header.inner{

				border: #B4D6C1 solid 1px;
				border-left: none;
				border-right: none;
				
				background: #BCC4BF;
	
				padding: 5px;
				color: #818187;
	
				padding-bottom: 1px;
				margin-top: 5px;
			}
			
			#actionPod .header.light{
				border-top: #819187 solid 1px;
				border-bottom: #819187 solid 1px;
				background: #A6B2AB;
			}
				#actionPod .header .icon{
					right: 1px;
				}
					#actionPod .header .icon.thisPage{
						background: url(../img/web/ico_arrow_down_greenGrey.png) no-repeat ;	
					}
					#actionPod .header .icon.newPage{
						background: url(../img/web/ico_arrow_right_greenGrey.png) no-repeat ;	
					}
					#actionPod .header .icon.share{
						background: url(../img/web/ico_share_greenGrey.png) no-repeat ;	
					}
				
				#actionPod .icon{					
					width: 30px;
					height: 30px;
					position:absolute;
				}
				
					
		#actionPod ul{
			margin-bottom: 5px; 	
		}
		#actionPod li{
			padding: 8px 3px 8px 27px;
			margin: 2px;
			border: 1px solid #FFF;
			
			color: #819187;			
			cursor: pointer;
			
			position: relative;
		}	
			#actionPod li:hover{
				
				background:#E8E8E9;
				text-decoration: none;
				border: 1px solid #C4C4C4;
			}
		#actionPod a:hover{
			text-decoration:none;
		}
		
			/* for open new page item, we make it more like a link */
			#actionPod ul.newPage li{	
				color: inherit;
			}
				#actionPod ul.newPage li:hover{	
					color: inherit;
					text-decoration:inherit;
				}
				#actionPod ul.newPage a:hover{	
					text-decoration: underline;
				}
			
				#actionPod  li .icon{					
					left:1px;
				}
					#actionPod .icon.map{
						background: url(../img/web/ico_map_bw.png) no-repeat;
						left: -1px;	
					}
					#actionPod .icon.commentRate{
						background: url(../img/web/ico_commentRate_bw.png) no-repeat;	
						top: -2px; /*coz this icon is pretty tall */
					}
				#actionPod .icon.viewComments{
					background: url(../img/web/ico_commentBubble_bw.png) no-repeat ;	
				}
				#actionPod .icon.viewPics{
					background: url(../img/web/ico_pics_bw.png) no-repeat ;	
				}
				#actionPod .icon.bookmark{
					background: url(../img/web/ico_bookmark_bw.png) no-repeat ;						
				}
					#actionPod .icon.bookmark.color{
						background: url(../img/web/ico_bookmark_c.png) no-repeat ;						
					}
				#actionPod .icon.listRests{
					background: url(../img/web/ico_listRests_bw.png) no-repeat ;	
					top: 0px;
				}
				#actionPod .icon.addRest{
					background: url(../img/web/ico_addRest_bw.png) no-repeat ;	
					top: 2px;
				}
				#actionPod .icon.print{
					background: url(../img/web/ico_printer_bw.png) no-repeat ;	
					top: 2px;
					
				}
		
		#actionPod li.notLink{ /*if the item is not a link (like already bookmarked */
			padding: 8px 3px 8px 27px;
			margin: 2px;
			border: 1px solid #FFF;
			
			color:  #819187;			
			cursor: default;
		}
			#actionPod li.notLink:hover{
				color:  #819187;	
				background-color: none;
				text-decoration: none;
				border: 1px solid #FFF;
			}
				
			
        #actionPod .socialShareList {
            padding: 8px;
        }
        #actionPod .socialShareList .item {
            margin-bottom: 8px;
        }

.description{
	padding: 10px 15px 15px;
	
	line-height: 1.4em;
	margin-bottom: 5px;
	background: #F7EABD;
	color: #555;
	font-size: 14px;
	
	border-radius: 10px;
	-moz-border-radius: 10px;
}
	.description .label{
		margin-bottom: 5px;	
	}
	.description p{
		margin: 0;
	}
	
.editInfo_wrapper{
	position:relative;	
	height: 15px;
}
.editInfo{
	position:absolute;
	top: -8px;
	right: 0px;
}
	.btn_editInfo{
		font-size: 11px;
		color: #666;
	}

.officialTextInfo{
	line-height: 1.3em;
	color: #333;
}
.belowSection .editLink { margin: 0.5em 0; }
.relatedChain .list { padding-left: 2em; }

 /*-- deals section --*/
.deals_wrapper{
	border-top: 1px dashed #FFCC66;
	border-bottom: 1px dashed #FFCC66;
	
	background: #FFFFCC;
	
}
	.deals_wrapper .dealSectionTitle{
		padding: 5px 15px 5px 35px;
		background: #E23018;
		display: inline-block;
		color: #FFF;
		position: relative;
	}
		.deals_wrapper .dealSectionTitle .ngiDeal{
			position: absolute;
			top: -17px;
			left: -10px; 
		}
		
	.deals_wrapper .deal{
		padding: 10px 0;		
		position: relative;
		
		border-bottom: 1px dashed #FFCC66;
		min-height: 70px; /* so the bow fits in here even if info is too short */
	}
		.deals_wrapper .deal .logoCol{
			float: left;
			margin-left: 5px; 
			width: 130px;
		}
			.deals_wrapper .deal .logoCol .logo{
				max-width: 120px;
			}
			
		.deals_wrapper .deal .midCol{
			float: left;
			margin-left: 5px; 
			width: 550px;
		}	
			.deals_wrapper .deal .midCol .subject{
				font-size: 17px; 
			}
			
			.deals_wrapper .deal .midCol .date{
				font-size: 11px;
				color: #999;
			}
			
			.deals_wrapper .deal .midCol .url{
				font-size: 11px;
				margin-top: 2px;
			}
			
			.deals_wrapper .deal .midCol .fullPrice{
				font-size: 11px;
				text-decoration:line-through;
			}
			.deals_wrapper .deal .midCol .dealPrice{
				font-size: 15px;
				font-weight: bold;
				color: #E23018;
			}
			
			.deals_wrapper .deal .midCol .description{
				margin-top: 15px;
			}
			
			.deals_wrapper .deal .promo_bg{
				background: url(../img/web/bg_bowDeal.png);
				position: absolute;
				
				right: 5px; 
				
				width: 74px;
				height: 74px;
				text-align: center;
				
				
			}
				.deals_wrapper .deal .promo_text{
					width: 50px;
					height: 65px;
					margin-top: 23px;
					margin-left: auto;
					margin-right: auto;
					color: #FFF;
					font-weight: bold;
					
				}
			
 /*-- map section --*/
 #mapLocationSection{
		 
 }
 	
	
 	 #addrSection{
		margin-left: 20px; 	
	}
	#addrSection label{
		color: #F4341A;			
		margin-right: 10px;
		
		display: block;
		margin-bottom: 5px;
		font-weight: bold;
	}

	
	#addrSection .addr{
		
	}
	#addrSection .st_addr{
		color: #666;	
		margin-left: 18px;
	}




	#addrSection .bld{
		margin-bottom: 10px;	
		padding-left: 18px;
		background: url(../img/web/ico_bld_mini.png) no-repeat ;
	}
		#addrSection .bld a{
			font-weight:bold;	
		}
		
		
	#addrSection .btsMrt{
		line-height: 1.5em;
		font-weight:bold;
		
	}
	#addrSection .direction{
		color: #666;	
		line-height: 1.3em;
	}
	
	
	#addrSection #show_findDirection{
		margin-top: 5px;
		display: inline-block;
		font-size: 14px;
		font-weight: bold;
		border: 1px solid #BBB;
		padding: 4px;
		
		
		background: #C6C6C6;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#F8F8F8),to(#ECECEC));
		background-image: -webkit-linear-gradient(top,#F8F8F8,#ECECEC);
		background-image: -moz-linear-gradient(top,#F8F8F8,#ECECEC);
		background-image: -ms-linear-gradient(top,#F8F8F8,#ECECEC);
		background-image: -o-linear-gradient(top,#F8F8F8,#ECECEC);
		background-image: linear-gradient(top,#F8F8F8,#ECECEC);

		color: #555;
		
		border-radius: 5px;
		-moz-border-radius: 5px;
	}
		#addrSection #show_findDirection:hover{
			text-decoration:none;
			background-image: -webkit-gradient(linear,left top,left bottom,from(#FFF),to(#CECECE));
			background-image: -webkit-linear-gradient(top, #FFF,#CECECE);
			background-image: -webkit-linear-gradient(top,#FFF,#CECECE);
			background-image: -moz-linear-gradient(top, #FFF,#CECECE);
			background-image: -ms-linear-gradient(top, #FFF,#CECECE);
			background-image: -o-linear-gradient(top, #FFF,#CECECE);
			background-image: linear-gradient(top,#FFF,#CECECE);
		}
		#addrSection #show_findDirection:active{
			text-decoration:none;
			background-image: -webkit-gradient(linear,left top,left bottom,from(#999),to(#CECECE));
			background-image: -webkit-linear-gradient(top, #999,#CECECE);
			background-image: -webkit-linear-gradient(top,#999,#CECECE);
			background-image: -moz-linear-gradient(top, #999,#CECECE);
			background-image: -ms-linear-gradient(top,#999,#CECECE);
			background-image: -o-linear-gradient(top,#999,#CECECE);
			background-image: linear-gradient(top,#999,#CECECE);
		}
	
	#addrSection #findDirectionSection{
		display:none;	
		padding: 10px;
		border: #BBB solid 1px;
		margin-top: 5px;
		position:relative;
	}
		
		#addrSection #findDirectionSection .btn_closeDirection{
			position: absolute;
			right: 3px;
			top: 3px;
			border: 1px solid #CCC;
			padding: 1px 4px 3px;
			color: #999;	
			cursor: pointer;
		}
		#addrSection #findDirectionSection .btn_closeDirection:hover{
			border: 1px solid #999;
			padding: 1px 4px 3px;
			color: #666;	
			background: #CCC;
		}
		
		
				#addrSection #findDirectionSection .direction_typing, #addrSection #findDirectionSection .direction_marker{
					margin-top: 5px;
				}
				
	
 
 #addrMap_wrapper{
	padding: 2px;
	border: 1px solid #999;
	float: left;
	position:relative;
 }
 	#addrMap{
	width: 220px;
	 height: 220px;
	}
 
 #btn_expandCollapseMap{
	width: 33px;
	height: 32px;
	position:absolute;
	right: -33px;
	bottom: -3px;
	background: url(../img/web/ico_mapExpand4.png) no-repeat;
	cursor:pointer;
 }
 #btn_expandCollapseMap:hover{
		background: url(../img/web/ico_mapExpand4_ov.png) no-repeat; 
 }
		 #btn_expandCollapseMap.collapse{
			background: url(../img/web/ico_mapCollapse4.png) no-repeat; 
 		}
		#btn_expandCollapseMap.collapse:hover{
			background: url(../img/web/ico_mapCollapse4_ov.png) no-repeat; 
 		}

	#btn_expandCollapseMap:active{
		bottom: -5px;	
	}

#geocode_suggests_wrapper{
	border-top: 1px dotted #999;
	margin: 10px 5px;
	display: none;	
}
	#geocode_suggests_wrapper .title{
			color: #F4341A;
			font-weight: bold;
			margin-top: 5px;
	}
#geocode_suggests{
	margin-top: 10px;
	
	
}
	#geocode_suggests .geocodeItem{
		margin: 15px 5px;
		
	}



#officialDirectory{
	margin: 10px 0px 0px 10px;
	color: #999;
}


/*** map for chain page ***/
#chainMap_wrapper{
		height: 400px;
		margin: auto;
		position: relative;
 }
 #chainMap_border{
	 padding: 2px;
	border: 1px solid #999;
	background: #FFF;
	position:relative;
	width: 300px;
	height: 400px;
	padding: 1px;
 }

#chainMap{
		margin: 2px;
		width: 296px; /*4 grids width -2px margin on left+right */
	 	height: 396px;
}

#chainFacetItems{
	margin: 10px;	
}
	#chainFacetItems .facetItemLink{
		float: left;
		margin: 10px;
	}


						 

 /*-- review section --*/
#reviewSection_wrapper {

}

#reviewSection_wrapper {
	margin-top: 1px;
	border: #999 1px solid; 
}

#reviewSection #starRatings{
	margin-top: 10px;	
}

#reviewSection #darkRedTabSection{
	margin: 0px 10px 0px 10px;

}

				#reviewSection #darkRedTabSection ul{
					list-style: none;
				}
				#reviewSection #darkRedTabSection li{
					color: #FFF;
					font-size: 14px;
					
					height: 23px;
		
					text-align: center;
					display: block;
					float: left;
					padding: 7px 20px 0px 20px;
					margin-right: 5px;
					
					border-top-left-radius : 5px;
					-moz-border-radius-topleft : 5px;
					
					border-top-right-radius : 5px;
					-moz-border-radius-topright: 5px;
				}
				#reviewSection #darkRedTabSection .selected{
					
					background: #AD3417;
		
				}
				#reviewSection #darkRedTabSection .unselected{
					
					background: #E66342;
					height: 22px;
					margin-bottom: 1px;
					cursor: pointer;
				}
				#reviewSection #darkRedTabSection .unselected:hover{
					height: 22px;
					margin-bottom: 1px;
					background: #D5411C;
					cursor: pointer;
				}
				
				#reviewSection #darkRedTabSection #darkRedTabAcross{
						height: 4px;
						background-color: #AD3417;
				}
		
		
		/* ----  b/c we add extra padding to the left already by the outer divs,so we need this margin left class to b able to use grid still --- */		
		#reviewSection .inner {
				margin-left: 20px;			
		}

#commentingSection_wrapper {
	border: #8B6E5A 1px solid;
	margin-top: 15px;

	background-color: #E9D7C4;
	position:relative; /*for icon to hover over box in absolute pos */
	
	/*drop shadow */
			-moz-box-shadow: 2px 2px 5px  rgba(100,100 ,100 ,0.5);
			-webkit-box-shadow: 2px 2px 5px rgba(100,100 ,100 ,0.5);
			box-shadow: 2px 2px 5px rgba(100,100 ,100 ,0.5);
						
}
	#commentingSection {
		padding: 20px;
		position: relative;
	}
	
		#commentingSection #commentingSecion_mask{
			background: #FFF;
			opacity:0.7;
			filter:alpha(opacity=70); /* For IE8 and earlier */
			
			width: 100%;
			
			position:absolute;
			left: 0px;
			top: 40px;
			
			z-index: 100;
		}
			#commentingSection #commentingSecion_mask .text{
				text-align: center;
				font-size: 15px;
				
			}
				#commentingSection #commentingSecion_mask .text a{
					font-weight: bold;
				}
		
	/*** for showing error msg from permission commenting **/
	#commentingSection .errorPermission{
	
		font-weight: normal;
	}
		
		
		
		/** jQuery validation classes **/
		#commentingSection#commentingSection input[type="text"].error, #commentingSection textarea.error,
		#commentingSection#commentingSection input[type="text"].error:focus, #commentingSection textarea.error:focus{
			border: 1px #F00 solid;  !important /*to override the normal form's black border when focus */
		}
		
		#commentingSection  label.error{
			color: #F00; 
			font-weight: normal;
		
			display: block;
			background: #E7BBBB;
			padding: 3px 5px;
			border-radius: 0 0 3px 3px;
			width: 500px;
			font-size: 13px;	
		}
		#commentingSection  label.error:after{
			content: ''; !important /*to override the normal form's '*' form server code */
		}		
		/** for wordcounter js */
		.wordcount-counter{
		
			color: #C60;
			font-weight: bold;
		}
		
		/*** for non member - initially hide stuff **/
		#nonmemberCommentForm #showAfterFocus{
			display: none;	
		}
		#nonmemberCommentForm #txt_nonmember_name{
			width: 220px;	
		}
		
		/* new login or signup link */
		#commentingSection .loginOrSignupNgi{
			font-size: 14px;
			background: rgba(0, 0, 0, 0.2) url(../img/web/ico_ngi_commentPicStar_s.png) 7px 10px no-repeat;
			padding: 5px 5px 30px 80px;
			margin-top: 10px;
			
			
			border-radius: 0 5px 0px 0;
			-moz-border-radius: 0 5px 0px 0;
			border: 1px dashed #777 ;
			border-left: none;
			border-bottom: none;
			
			width: 250px;
			
			position: relative;
			top: 20px;
			left: -20px;
			
		}
		#commentingSection .loginOrSignupNgi.expanded{ /* after we show the hidden part of the form, modify this position abit */
				position: absolute;
				top:auto;
				bottom: 0px;
				left: 0px;
		}
		
			#commentingSection .loginOrSignupNgi a{
					font-size: 17px;	
					font-weight: bold;
					text-decoration: underline;
			}
			#commentingSection .loginOrSignupNgi .text{
					font-size: 13px;
					color: #444;
					margin-top: 10px;
			}
			#commentingSection .loginOrSignupNgi .numComments{
					font-size: 11px;
					color: #333;
					margin-top: 10px;
					line-height: 1.2em;
					position:absolute;
					left: 8px;					
			}
					#commentingSection .loginOrSignupNgi .numComments .emp{
						color: #AD3417;
						font-weight: bold;
					}
				
				
				
		#commentingSection .sectionIcon{
			position:absolute;
			top: -7px;
			left:  5px;
		}
		
		#commentingSection .title{
			font-size: 18px;
			color: #E51E18;
			font-weight: bold;
			margin-left: 40px;
		}
			#commentingSection .title.link{
				color: #0F6FB7;			
				cursor: pointer;
				text-decoration: underline;
			}
				#commentingSection .title.link:hover{
				color:#005493;
				text-decoration: underline;
				
			}
			
		
		#commentingSection #commentingAutosaveRemains{
			background: #FF6;
			border-bottom: 1px dashed #666;
			padding: 10px;	
			
			font-size: 15px;
			color: #333;
		}
			#commentingSection #commentingAutosaveRemains .buttons{
				margin-top: 10px;
				text-align: right;
				font-size: 11px;	
			}
			
		#commentingSection .subSectionTitle{
			font-size: 15px;
			font-weight:bold;
			color: #333;
			
		}
		
		#commentingSection .subSubSectionTitle{
			margin: 5px 0 2px;
			font-size: 15px;
			color: #999;
		}
		
		#commentingSection .byWhom{
			font-size: 15px;
			font-weight: normal;	
			margin-top: 5px;
			color: #333;
		}
			#commentingSection .by, #commentingSection .miniProfile{
				float: left;
			}
		
		/*-- star widgets --*/
		#commentingSection .starBox{
			border: 1px solid #AD9584;
			background:#FFF;
			padding: 5px;
			width: 350px;
			font-size: 15px;
		}
				#commentingSection .starBox #starsOverall{
					cursor: pointer;	
				}
				
		#commentingSection .starBox.subCats{
				border-top: none;
				display: none;
		}
			#commentingSection .starBox .label, #commentingSection .starBox .stars, 
			#commentingSection .starBox .numStars, #commentingSection .starBox .btn_cancel{
				display: inline-block;
			}
			#commentingSection .starBox .label{
				width: 60px;
				text-align: right;
				padding-right: 0px;
				color: #666;
			}
			#commentingSection .starBox .stars{
				vertical-align: middle;
			}
			#commentingSection .starBox .numStars{
				font-size: 13px;
			}
			#commentingSection .starBox .btn_cancel{
				vertical-align: middle;	
				background: url(../img/web/ico_minus_big_bw.png) no-repeat;
				width: 24px;
				height: 24px;
				cursor: pointer
			}
				#commentingSection .starBox .btn_cancel:hover{
					background: url(../img/web/ico_minus_big_c.png) no-repeat;
				}
			
			#commentingSection .starBox .subCat{ 	/* each row of subcat stars */
				margin-top: 10px;
			}
			
			#commentingSection input[type=text], #commentingSection textarea{
				border: #AD9584 1px solid;
				border-top-color: #5C5047;
			}
				#commentingSection input[type=text]{
					padding: 3px;
					font-size: 15px;	
				}
				#commentingSection input[type=text]:focus, #commentingSection textarea:focus{
					border-color: #378AC2;
					
				}
			
			#commentingSection input[type=file] {
				color: #999;
				font-style: italic;
			}
				#commentingSection input[type=file].choosing { /* for when selecting a file */
					font-weight: bold;
					color: #FFF;
					font-style: normal;
					text-transform: uppercase;
					background: #DD5F24;
					
					border-radius: 3px;
					-moz-border-radius: 3px;
					border: 1px solid #F8CDAB;
					width: 380px;
				}
				
			#commentingSection #txt_subject{				
				width: 500px;				
			}
			#commentingSection #txt_subject:focus{
				background-color:#FFF;	/* override defualt style b/c our bg is slight color already */
			}
			
			/* comment box initial styles */
			#commentingSection #txtarea_comment{
				padding: 3px;
				width: 500px;
				font-size: 13px;
				min-height: 40px;
			}
			#commentingSection #txtarea_comment:focus{
				background-color:#FFF;	/* override defualt style b/c our bg is slight color already */
			}
			
			
		
		
		#commentingSection .txt_commenting{
			width: 100%;
			border: #000 1px solid;
		}
			#commentingSection .txt_commenting:focus{
				background: #FFF;
			}
		
		#commentingSection #lbl_autosaving{
			color: #AAA;
			font-size: 11px;
			font-style: italic;
			text-align: right;
			width: 500px;
			height: 15px;
		}
		
		
		#commentingSection .btn_postPic{
			border: 1px #AD9584 solid;
			padding: 10px 5px 10px;
			padding-left: 40px;
			background: #FFF url(../img/web/ico_addPic_bw.png) no-repeat 8px 7px; 
			cursor: pointer;
			

			display: inline-block;
			width: 90px;
			height: 20px;
		}
			#commentingSection .btn_postPic:hover{			
				border: 1px  #AD9584 solid;
				background: #FFF url(../img/web/ico_addPic_c.png) no-repeat 8px 7px; 
			
				display:inline-block;
		}
		
			#commentingSection .btn_postPic.showing{			
				border: 1px  #AD9584 solid;
				background: #FFF url(../img/web/ico_addPic_c.png) no-repeat 8px 7px; 
				border-bottom: none;
			}
				#commentingSection .btn_postPic.showing:hover{			
					
				}
				
			

			#commentingSection .postPicArea_wrapper{
				display: none;
				border: 1px  #AD9584 solid;
				border-top: none;
				width: 100%;
				
				background: #FFF;
			} 
					#commentingSection .postPicArea_wrapper.show{ /* for edit page */
						display:inline;	
					}
			
				#commentingSection .postPicArea_wrapper .topLine{
					margin-left: 135px;
					border-top: 1px solid  #AD9584;
					height: 1px;
				}
				
			#commentingSection .postPicArea{
				padding: 20px 10px 20px 10px;
			}
			#commentingSection .postPicArea .header{
				position: relative;	
		/*		height: 40px; */
			}
				#commentingSection .postPicArea .left{
					position: absolute;
					bottom: 0;
					left: 0;
				}
					#commentingSection .postPicArea .left .btn_uploadify{ /* just a placeholder graphic - to be removed */
						display: inline-block;
						background: url(../img/web/btns_upload.png) no-repeat;
						width: 96px;
						height: 30px;
					}
				#commentingSection .postPicArea .right{
					color: #999;
					position: absolute;
					bottom: 0;
					right: 0;
				}
				
				#commentingSection .postPicArea .line{
					border-bottom: 1px #CCC solid;
					margin-top: 5px;
				}

	#commentingSection .postFb{
		text-align: right;	
		padding: 10px 0;
		color: #06C;
	
	}
	
	#commentingSection .terms{
		text-align: right;
		font-size: 11px;
			
	}
	#commentingSection .btn_previewPost{
		text-align: right;	
	
	}
		#commentingSection .btn_previewPost div{
				margin-left: 20px;
		}

		

	/*edit page */
	#commentingSection .deletePic{
			background-color: #CCC;
			border: 1px #AAA dashed;
			padding: 5px 2px;
			display:inline-block;
			
	}
		#commentingSection  .deletePic input[type="checkbox"]:checked + label {
			color: #C00;
			font-weight: bold;
		}

#numCommentsTitle{
	font-size: 15px;
	font-weight: bold;
	color: #333;
	margin-bottom: 5px;
}

#allComments {
	margin-top: 20px;
	
}


/* ad tall rectangle on the right - extra positioning styles  */
.rightAd{
	margin-left: 1px; /* so ad doesnt fall off the right edge (overriding the default grid margin-left */
	
}

/*	----- END Rest page -------------- */

/*  restList section - for bld and chain page */



.preloader.small{
	text-align: center;
}

#restCatList{
	margin: 0 5px;
	border-bottom: 1px solid #CCC;
}

.restListSection{
	margin-top: 2px;
	border: #CCC 1px solid;		
}



/* ---------------------------------------
				Search result page
	---------------------------------------- */
#span_find, #span_near{
	color: #DA2B10;
	font-weight: bold;
	
	cursor:pointer;
}
	#span_find:hover, #span_near:hover{
		color: #985307;
		text-decoration: underline;
	}
	
#resultFoundFacetItems{
	position: relative;	
	
}
	#facetShowHideWrapper{
		
	}
#facetShowHide{
	display:inline-block;

	position:absolute;
	left: 15px;
	bottom: -16px;

	font-size: 11px;
	
	padding: 5px 5px;
	cursor: pointer;
	color: #000;
	border: 1px solid #927555;
	background: #C99F74;
	border-bottom-color: #B37857;
	
	
	background: -moz-linear-gradient(top,  #E4C09A, #C99F74);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from( #E4C09A), to(#C99F74));
	background: -webkit-linear-gradient( #E4C09A, #C99F74);
	background: -o-linear-gradient(#E4C09A, #C99F74);
	
	border-top-left-radius : 5px;
	-moz-border-radius-topleft : 5px;
	border-top-right-radius : 5px;
	-moz-border-radius-topright : 5px;
	
	-moz-box-shadow:2px 0px 2px rgba(0,0,0,0.2);
	-webkit-box-shadow:  0px 2px 2px rgba(0,0,0,0.2);
	box-shadow: 2px 0px 2px rgba(0,0,0,0.2);
	
}
	#facetShowHide:hover{
	
		background:#FFD7AD;
		
		background: -moz-linear-gradient(top,   #FFD7AD, #C99F74);
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFD7AD), to(#C99F74));
		background: -webkit-linear-gradient( #FFD7AD, #C99F74);
		background: -o-linear-gradient( #FFD7AD, #C99F74);
	}
	#facetShowHide:active{
		background: #B89A7A;
		
	}
	
#facetSelected{
	margin: 0px 0 0;

	width: 780px;
}
	
.facetSelectedItem{
	float: left;
	border:1px #FC6 solid;
	background:  #FFFF6A url(../img/web/ico_x_facetItem.png) right 4px no-repeat;
	padding: 3px 15px 3px 5px;
	margin: 5px 0px 0px 5px;
	cursor: pointer;
	border-radius: 3px;
	-moz-border-radius: 3px;
}
.facetSelectedItem:hover{
	text-decoration:line-through;
	background:  #FC6 url(../img/web/ico_x_facetItem.png) right 4px no-repeat;
}

.facetClearAll{
	float: left;
	font-size: 11px;
	padding: 10px 10px 0px 10px;
}
	
.facetLabel{
	color: #A00;
	font-size: 15px;
	font-weight: bold;
	margin-right: 15px; /* for the rounded corner, move txt in a bit */
	
}
.facetLabel.right{
	text-align:right;
}
.facetBox_wrapper{
	background: #F3C594;
	border: 1px #927555 solid;
	border-radius: 5px;
	-moz-border-radius: 5px;
	
	margin-bottom: 10px;
	
	height: 195px;
	
	-moz-box-shadow:2px 2px 2px rgba(0,0,0,0.2);
	-webkit-box-shadow:  2px 2px 2px rgba(0,0,0,0.2);
	box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
}
.facetBox{
	margin: 10px 5px 10px 5px;	
	
	
}
	.facetBox  ul{
		margin-left:10px;	/* applies to all ul tag, to create indent hierarchy effect when it goes deeper in the level */
		
	}
	.facetBox .headerArea ul{
		margin-left:22px;  /* so the header area chkboxes will align with those in the innerBox */
		
	}
	
	
	.facetBox .innerBoxLabel{
		color: #A00;
		font-size: 11px;
		font-weight:bold;
		margin-bottom: 1px;
		
	}
	.facetBox .innerBox_wrapper{	/*white bg content box */
		background: #FFF;
		border: 1px #927555 solid;
		
		min-height: 163px;
		
		position: relative; /* for more link which is absolute and inside */
	}
		.facetBox .innerBox_wrapper.short{
				min-height: 140px;
				max-height: 140px;			
		}
		
	.facetBox .innerBox{
		margin: 5px 5px 3px 0px ;	
		
		line-height: 1.5em;
	}
	
	.facetBox .innerBox label{
		display: inline-block;
		cursor: pointer;
		padding: 1px 2px 1px 2px;
		
		
		margin: 1px; /* compensate for the border showing when hover */
		
		
		vertical-align: top;
		
		line-height: 1em;
	}
		/* specify diff max width for diff grid boxes */
		.facetBox.grid_2 .innerBox label{
			max-width: 95px;
		}
		.facetBox.grid_3 .innerBox label, .grid_3 .facetBox .innerBox label{
			max-width: 160px;
		}	
				
		.facetBox .innerBox label.small{ /* for too long text */
			font-size:11px;
		}
		
	.facetBox .innerBox label:hover{
		border: 1px dotted #CC0;
		 margin: 0px; 
	}
	.facetBox .innerBox input[type=checkbox]:checked + label{
		background:#FFFF6A;
	}
	
	.facetBox .innerBox ul{
		
		
	}
	.facetBox .innerBox ul ul{
	 		
		
	}
	
	.facetBox .innerBox li.parentUp{

	}
	.facetBox .innerBox span.arrow{
		width: 12px;
		height: 12px;
		
		display:inline-block;
	}
	.facetBox .innerBox span.parentUp{
		background: url(../img/web/ico_treeArrow_up.png)  no-repeat;		
		cursor:pointer;
	}
	.facetBox .innerBox span.parentUp:hover{
		background: url(../img/web/ico_treeArrow_up_ov.png)  no-repeat;
	}
	.facetBox .innerBox span.parentDown{
		background: url(../img/web/ico_treeArrow_down.png)  no-repeat;		
		cursor:pointer;
	}
	.facetBox .innerBox span.parentDown:hover{
		background: url(../img/web/ico_treeArrow_down_ov.png)  no-repeat;
	}
	
	
	.facetBox .innerBox li.parentDown{
		background: url(../img/web/ico_sortArrow_down.gif) 1px 4px no-repeat;
		padding-left: 5px;
	}
	
	.facetBox .innerBox li.lv1{
		font-weight: bold;
		color: #000;
		font-size: 14px;
	}
	.facetBox .innerBox ul.hidden{
		display: none;
	}
	.facetBox .innerBox ul.lv2{
		
	}
		.facetBox .innerBox ul.lv2 li{
			font-weight: normal;
			color: #000;
			font-size: 14px;
		}
	
	.facetBox .innerBox ul.lv3{
		display: none;
	}
		.facetBox .innerBox ul.lv3 li{
			color: #444;
			font-size: 12px;
		}
	
	.facetBox .innerBox ul .parentUp{
		
	}
	
	.facetBox .innerBox .more{
		position: absolute;
		bottom: 5px;
		right: 5px;
	}
		.facetBox .innerBox .moreLink{
			color: #0067B4;
			text-decoration:none;
			cursor: pointer;
		}
		.facetBox .innerBox .moreLink:hover {
			color: #005493;
			text-decoration:underline;		
		}
		
		
		.facetBox .innerBox .more .morePopup_wrapper{
			position: absolute;
			display: none;
			padding: 10px;
			padding-top: 20px;
			width: 250px;
			height: 250px;
			left: -150px;
			background:  #F3C594;
			border: #927555 2px solid;
			z-index:  9999999999999; /*to prevent ggMaps crazy z-index, this one needs to be higher than ggmaps*/	
		-moz-box-shadow: 3px  3px 3px rgba(0,0,0,0.3);
-webkit-box-shadow:3px 3px 3px rgba(0,0,0,0.3);
box-shadow: 3px  3px 3px rgba(0,0,0,0.3);
			
		}
			.facetBox .innerBox .more .morePopup_wrapper .closeBtn{
				position: absolute;
				top: -16px;
				right: 10px;
				background: url(../img/web/btn_close_morePopup.png) no-repeat;
				cursor: pointer;
				width: 33px;
				height: 33px;

			
			}
			.facetBox .innerBox .more .morePopup_wrapper .closeBtn:hover{
				background: url(../img/web/btn_close_morePopup_ov.png) no-repeat;
			}
		
			.facetBox .innerBox .more .morePopup_wrapper .morePopup{
				padding: 10px 10px 0px 10px;
				background:  #FFF;
				 border: 1px #927555 solid;
				overflow: scroll;
				overflow-x: hidden;
				-ms-overflow-x: hidden; 
				height: 200px;
				
			}
#sortByShowing{
	margin-top: 20px;		
	color: #999;
	font-size: 12px;
	
}
	
	#sortByShowing #showing{
		text-align: right;	
	}
	
	
	/* sortByShowing Ajax */
	
	
#resultsFound{
	color: #333;
	font-size: 17px;
	
}
	#resultsFound span.empRed{
	color:  #DA2B10; 
	font-weight: bold;

	}
	#resultsFound span.empBlack{
	color:  #333; 
	font-weight: bold;

	}



#resultsWrapper{
	position: relative;
}

#resultMask{
	background: white;
	opacity: 0.7;
	filter: alpha(opacity=70);
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 100;
	height: 100%;
}
	/* for matched search words - override the common style declared in kinnshare_main */
	#restResults .highlight{
		color:#DA2B10;
		background: none;
	}

	
/* resultMap */
	#resultMap_wrapper{
		position: relative;	
		height: 400px;
		margin: auto;
	}
	#resultMap_border{ /*border wrapping the map */
		border: 1px #999 solid; 
		background: #FFF;
		padding: 1px;
		position: absolute; /*this will be changed in js code for the scrolling */
		
		/* ggmap size */
		width: 380px;
		height: 400px; 
		
	}
	#resultMap{	
		margin: 2px;
		width: 376px;
		height: 396px; 
		
	}
	#lbl_enableScrollWheel
	{
		padding: 2px;
		font-size: 11px;
		color: #666;
		float:right;	
		cursor: pointer;
	}
		#lbl_enableScrollWheel:hover{
			color: #000;
		}
		
		
		
#showResultsHere{
	/*set minheight to the same as map to prevent map jump around when reloading new page */
	min-height: 400px;
}

.resultNotFound{
	text-align:center;
	font-size: 15px;
	
	display:none;
}
.preloadContainer{
	
}
.preloader.big{
	border: 7px solid #000;
	border-radius: 20px;
	-moz-border-radius: 5px;
	
	-moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.5); /* Firefox 3.6 and earlier */
    -webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.5); /* Safari and Chrome */
    box-shadow: 3px 3px 3px rgba(0,0,0,0.5);
	
	position:absolute; 
	top: -50px; 
	margin-left: 300px;
	

	/*display:none; */
	z-index: 9999999;
	width: 200px;
	height: 170px;
	background: #FFF url(../img/web/preloader_markers2.gif) no-repeat;
}

.preloader.big.sticky{
	position: fixed;
	top: 30px;	
	
}

	

/*	----- END search result page -------------- */


/* --------------------------------------

		gallery page
		
	--------------------------------------- */
	
	
		
		
	
#mainPicBig_wrapper{
	background: #A69A8E url(../img/web/bg_mainPic_viewAllPics.jpg) repeat-x;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;
	
	-moz-box-shadow:  3px 2px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow:  3px 2px 3px rgba(0,0,0,0.3);
	box-shadow: 3px 2px 3px rgba(0,0,0,0.3);
	
	position:relative; /*for socialobj actions element (more styles in kinnshare_stdElements */
}
	#mainPicBig{
		padding: 20px;
	
		
	}
		
			
			#mainPicBig .picArea, #mainPicBig .left, #mainPicBig .center{
				float: left;
			}
			#mainPicBig .picArea
			{
			 	width: 100%;
					text-align: center;
			}
				#mainPicBig .picWrapper{
					display: inline-block; 
					border: 1px #666 solid; 
					padding: 3px; 
					background: #FFF;	
					
					max-width: 735px;
					
				}
			
			#mainPicBig .left
			{
				width: 130px;
				margin-right: 15px;
				font-size: 11px;
			}
				#mainPicBig .left .date
				{
					color: #666;
				
				}
				#mainPicBig .left .memberName
				{	
					margin-top: 10px;
				}
			#mainPicBig .center
			{
			
				width: 590px;
				font-size: 15px; 
			}
	
	
	/* for bld gallery, 2 modes */
	#galleryTypeTabs_wrapper{
		position:relative;
		top: 2px;
	}
	#galleryTypeTabs{
		font-size: 15px;		
		
	}
			#galleryTypeTabs .tab {
				float: left;		
				margin-right: 5px;
				background: #ADA098;
				
				
				border-top-left-radius : 5px;
				-moz-border-radius-topleft : 5px;
				
				border-top-right-radius : 5px;
				-moz-border-radius-topright: 5px;
				
				cursor:pointer;
			}
				#galleryTypeTabs .tab a{
					text-decoration: underline;
					display: block;
					padding: 8px 15px 10px;
				
				}
			#galleryTypeTabs .tab:hover{
				background: #A29589;
			}
			
			#galleryTypeTabs .tab.current{
					background: #968678;
					color: #FFF;
					font-weight: bold;
					
					padding-bottom: 2px; /* so the current tab looks like it connects from below area */
					
					cursor: default;
					
					position:relative;
					z-index:5;
			}
            #galleryTypeTabs .tab.current a {
                text-decoration: none;
                color: #fff;

            }
			
	
	
	#btnBackNextArea{
		text-align: right;	
		font-size: 15px;
	}
	.btn_backNext{
		background: url(../img/web/bg_btnBackNext_picPage.png) no-repeat;
		width: 75px;
		height: 30px;
		color:#fff;
		display: inline-block;
		margin-bottom: 5px;
		text-align: center;
		font-weight: bold;
		line-height: 2em; /* for vertical align */
		
		cursor:pointer;
	}
		.btn_backNext:hover {
			background: url(../img/web/bg_btnBackNext_picPage_ov.png) no-repeat;
            text-decoration: none;
            color:#fff;
		}
		.btn_backNext.disabled {
			background: url(../img/web/bg_btnBackNext_picPage_disabled.png) no-repeat;
			cursor: default;
		}
		.btn_backNext.disabled:hover{
			background: url(../img/web/bg_btnBackNext_picPage_disabled.png) no-repeat;
		}
		
	
	.thumb_wrapper{
		border: 1px #CCC solid;
		width: 190px;
		height: 280px;
		float: left;
		margin-left: 1px; 
		margin-right: 2px;
		margin-top: 10px;
	}
		.thumb{
			padding: 15px;
			
		}
	
	.thumb_wrapper:hover{
		border: 1px #B7B7B7 solid;
		background:#DEDEE0;
		width: 190px;
		height: 280px;
		
		
		
	}
	.thumb_wrapper.current{
		border: 1px #86776A solid;
		background:#A6998E;
		
	}
	
		
			.thumb .picWrapper{
						display: inline-block; 
						border: 1px #999 solid; 
						padding: 2px; 
						background: #FFF;		
						
						cursor: pointer;
			}
			
			.thumb .thumbArea, .thumb .thumbInfo{
				float: left;	
			}
			
			.thumb .thumbArea{
				width: 100%;
				text-align: center;
			}
			
			.thumb .thumbInfo{
				margin-top: 10px;				
			}
				.thumb .thumbInfo .memberName{
					font-size: 11px;
                    padding: 0.2em 0;
				}
                .thumb .thumbInfo .caption{
					padding-bottom: 5px;
				}
			


/* -----------------------
		 
		 comment search page 
		 
	-----------------------------------*/
#commentSearchFilters{
	
	
}
	#commentSearchFilters .colLeft, #commentSearchFilters .colRight{
		float: left;
		margin-right: 10px; 		
	}
	#commentSearchFilters{
		
		
	}
	#commentSearchFilters .btsMrt{
			float: left;
			margin-right: 15px; 
	}
	#commentSearchFilters .label{
	
		color: #F43C1A;		
		line-height: 1.5em;
	}
	#commentSearchFilters .commentSearchBox{
		height: 25px;
		font-size: 15px;
	}