/* ==|== primary styles =====================================================
Project: Angry Bear LLC
Author: j.Bernard
Date: January 2012
========================================================================== */

@import url("reset.css");


/* ==|== type =============================================================== */

@font-face {
    font-family: 'HaymakerRegular';
    src: url('../type/haymaker-webfont.eot');
    src: url('../type/haymaker-webfont.eot#iefix') format('embedded-opentype'),
         url('../type/haymaker-webfont.woff') format('woff'),
         url('../type/haymaker-webfont.ttf') format('truetype'),
         url('../type/haymaker-webfont.svg#HaymakerRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'EnemySubRegular';
    src: url('../type/enemy_sub-webfont.eot');
    src: url('../type/enemy_sub-webfont.eot#iefix') format('embedded-opentype'),
         url('../type/enemy_sub-webfont.woff') format('woff'),
         url('../type/enemy_sub-webfont.ttf') format('truetype'),
         url('../type/enemy_sub-webfont.svg#EnemySubRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}



/* ========================================================================== */

body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 11px;
	line-height: 11px;
	background-color: #D2D3D1;
	margin:0px;padding:0px;
}


/* --- Container
-------------------------------------------------------*/

#container {
	width: 100%;
	min-width: 1200px;
	height: 100%;
}
	
	/* --- Footer Nav
	-------------------------------------------------------*/
	
	#footer_nav {
		display: block;
		position: fixed;
		left: 0px;
		bottom: 0px;
		z-index: 9999;
		width: 100%;
		height: 66px;
		border-top-style:none;
		border-top-width: 3px;
		border-top-color: #131f23;
		border-bottom-style: solid;
		border-bottom-width: 3px;
		border-bottom-color: #131f23;
		background-color: #080f10;
	}
	
		#footer_nav #footer_nav_logo {
			display: block;
			position: relative;
			width: 95px;
			height: 66px;
			float: left;
			background: url('../img/footer_nav_logo.png') no-repeat 0 0;
		}
		
		
		/* --- Footer Nav Buttons
		-------------------------------------------------------*/
		
		#footer_nav #footer_nav_buttons {
			display: block;
			position: relative;
			float: left;
			width: 721px;
			height: 66px;
		}
		
			#footer_nav_buttons ul {
				list-style: none;
				margin: 0px;
				clear: both;
			}
			
				#footer_nav_buttons ul li {
					overflow: hidden;
					text-indent: -9999px;
					float: left;
					height: 66px;
				}
				
					#footer_nav_buttons ul li a {
						display: block;
						height: 66px;
						background: url('../img/footer_nav_btns.png') no-repeat 0 0;
					}

				/* --- Nav Items
				-------------------------------------------------------*/
				
				#footer_nav_buttons ul li.about { left: 0px; width: 140px; }
				#footer_nav_buttons ul li.work { left: 0px; width: 161px; }
				#footer_nav_buttons ul li.accolades { left: 0px; width: 120px; }
				#footer_nav_buttons ul li.contact { left: 0px; width: 164px; }
				#footer_nav_buttons ul li.blog { left: 0px; width: 136px; }
				
				
				/* --- Nav Items - Static States
				-------------------------------------------------------*/
				
				#footer_nav_buttons ul li.about a { background-position: 0px 0px; }
				#footer_nav_buttons ul li.work a { background-position: -140px 0px; }
				#footer_nav_buttons ul li.accolades a { background-position: -301px 0px; }
				#footer_nav_buttons ul li.contact a { background-position: -421px 0px; }
				#footer_nav_buttons ul li.blog a { background-position: -585px 0px; }
							
				
				/* --- Nav Items - Over States
				-------------------------------------------------------*/
				
				#footer_nav_buttons ul li.about a:hover { background-position: 0px -66px; }
				#footer_nav_buttons ul li.work a:hover { background-position: -140px -66px; }
				#footer_nav_buttons ul li.accolades a:hover { background-position: -301px -66px; }
				#footer_nav_buttons ul li.contact a:hover { background-position: -421px -66px; }
				#footer_nav_buttons ul li.blog a:hover { background-position: -585px -66px; }
				
				
				/* --- Nav Items - Active States
				-------------------------------------------------------*/
				
				#footer_nav_buttons ul li.about a.active { background-position: 0px -132px; }
				#footer_nav_buttons ul li.work a.active { background-position: -140px -132px; }
				#footer_nav_buttons ul li.accolades a.active { background-position: -301px -132px; }
				#footer_nav_buttons ul li.contact a.active { background-position: -421px -132px; }
				#footer_nav_buttons ul li.blog a.active { background-position: -585px -132px; }
		
		
		/* --- Footer Nav Social Buttons
		-------------------------------------------------------*/
		
		#footer_nav #footer_nav_social {
			display: block;
			position: relative;
			float: right;
			width: 120px;
			height: 66px;
			margin-top: 19px;
			margin-right: 15px;
		}
		
			#footer_nav_social ul {
				list-style: none;
				margin: 0px;
				clear: both;
			}
			
				#footer_nav_social ul li {
					overflow: hidden;
					text-indent: -9999px;
					float: left;
					height: 33px;
				}
				
					#footer_nav_social ul li a {
						display: block;
						height: 33px;
						background: url('../img/footer_nav_social_btns.png') no-repeat 0 0;
					}
				
				
				/* --- Nav Items
				-------------------------------------------------------*/
				
				#footer_nav_social ul li.facebook_btn { left: 0px; width: 22px; }
				#footer_nav_social ul li.twitter_btn { left: 0px; width: 38px; }						
				#footer_nav_social ul li.vimeo_btn { left: 0px; width: 28px; }
				#footer_nav_social ul li.linkedin_btn { left: 0px; width: 32px; }
				
				
				/* --- Nav Items - Static States
				-------------------------------------------------------*/
				
				#footer_nav_social ul li.facebook_btn a { background-position: 0px 0px; }
				#footer_nav_social ul li.twitter_btn a { background-position: -22px 0px; }
				#footer_nav_social ul li.vimeo_btn a { background-position: -60px 0px; }
				#footer_nav_social ul li.linkedin_btn a { background-position: -88px 0px; }
							
				
				/* --- Nav Items - Over States
				-------------------------------------------------------*/
				
				#footer_nav_social ul li.facebook_btn a:hover { background-position: 0px -33px; }
				#footer_nav_social ul li.twitter_btn a:hover { background-position: -22px -33px; }
				#footer_nav_social ul li.vimeo_btn a:hover { background-position: -60px -33px; }
				#footer_nav_social ul li.linkedin_btn a:hover { background-position: -88px -33px; }
	
	
	
	/* --- Side Nav
	-------------------------------------------------------*/
	
	#container #side_nav {
		display: block;
		position: fixed;
		top: 165px;
		left: -150px;
		z-index: 9999;
		width: 244px;
		height: 453px;
	}
	
	
		/* --- Side Nav Tab
		-------------------------------------------------------*/
	
		#side_nav #nav_tab {
			display: block;
			position: relative;
			top: 0px;
			left: 0px;
			width: 249px;
			height: 80px;
			text-indent: -9999px;
			cursor: pointer;
			background-image: url('../img/nav_tab.png');
		}
		
			#side_nav #nav_tab #nav_tab_title {
				display: block;
				position: absolute;
				top: 9px;
				left: 40px;
				width: 137px;
				height: 56px;
				background-image: url('../img/nav_tab_title.png');
			}
			
			#side_nav #nav_tab #nav_tab_logo {
				display: block;
				position: absolute;
				top: 9px;
				left: 177px;
				width: 53px;
				height: 56px;
				background-image: url('../img/nav_tab_logo.png');
			}
		
		
		/* --- Side Nav Banner
		-------------------------------------------------------*/
		
		#container #side_nav #nav_banner {
			display: block;
			position: absolute;
			top: 76px;
			left: 24px;
			width: 177px;
			height: 377px;
			background-image: url('../img/nav_banner.png');
		}

			
			
			/* --- Side Nav Buttons
			-------------------------------------------------------*/
			
			#side_nav #nav_banner #nav_btns {
				display: block;
				position: absolute;
				top: 26px;
				left: 6px;
				width: 164px;
				height: 156px;
			}
			
				#nav_btns ul {
					list-style: none;
					margin: 0px;
				}
				
					#nav_btns ul li {
						position: absolute;
						overflow: hidden;
						text-indent: -9999px;
						top: 0px;
						height: 35px;
						width: 164px;
					}
					
						#nav_btns ul li a {
							display: block;
							height: 35px;
							width: 164px;
							background-image: url('../img/side_nav_btns.png');
							margin-bottom: 4px;
						}
					
					
					/* --- Nav Items
					-------------------------------------------------------*/
					
					#nav_btns ul li.about { top: 0px; width: 122px; }
					#nav_btns ul li.work { top: 39px; width: 122px; }						
					#nav_btns ul li.accolades { top: 78px; width: 122px; }
					#nav_btns ul li.contact { top: 117px; width: 122px; }
					
					
					/* --- Nav Items - Static States
					-------------------------------------------------------*/
					
					#nav_btns ul li.about a { background-position: 0px 0px; }
					#nav_btns ul li.work a { background-position: 0px -39px; }
					#nav_btns ul li.accolades a { background-position: 0px -78px; }
					#nav_btns ul li.contact a { background-position: 0px -117px; }
								
	
					/* --- Nav Items - Over States
					-------------------------------------------------------*/
					
					#nav_btns ul li.about a:hover { background-position: -164px 0px; }
					#nav_btns ul li.work a:hover { background-position: -164px -39px; }
					#nav_btns ul li.accolades a:hover { background-position: -164px -78px; }
					#nav_btns ul li.contact a:hover { background-position: -164px -117px; }
			
					
					/* --- Nav Items - Active States
					-------------------------------------------------------*/
					
					#nav_btns ul li.about a.active { background-position: -164px 0px; }
					#nav_btns ul li.work a.active { background-position: -164px -39px; }
					#nav_btns ul li.accolades a.active { background-position: -164px -78px; }
					#nav_btns ul li.contact a.active { background-position: -164px -117px; }
			

			/* --- Side Nav Social Buttons
			-------------------------------------------------------*/
			
			#container #side_nav #nav_banner #social_btns {
				display: block;
				position: absolute;
				top: 208px;
				left: 6px;
				width: 165px;
				height: 33px;
				
			}
			
				#social_btns ul {
					list-style: none;
					margin: 0px;
				}
				
					#social_btns ul li {
						position: absolute;
						overflow: hidden;
						text-indent: -9999px;
						top: 0px;
						height: 33px;
					}
					
						#social_btns ul li a {
							display: block;
							height: 33px;
							background-image: url('../img/nav_social_tab.png');
						}
					
					
					/* --- Nav Items
					-------------------------------------------------------*/
					
					#social_btns ul li.facebook_btn { left: 0px; width: 38px; }
					#social_btns ul li.twitter_btn { left: 38px; width: 45px; }						
					#social_btns ul li.vimeo_btn { left: 82px; width: 34px; }
					#social_btns ul li.linkedin_btn { left: 116px; width: 47px; }
					
					
					/* --- Nav Items - Static States
					-------------------------------------------------------*/
					
					#social_btns ul li.facebook_btn a { background-position: 0px 0px; }
					#social_btns ul li.twitter_btn a { background-position: -38px 0px; }
					#social_btns ul li.vimeo_btn a { background-position: -82px 0px; }
					#social_btns ul li.linkedin_btn a { background-position: -116px 0px; }
								
					
					/* --- Nav Items - Over States
					-------------------------------------------------------*/
					
					#social_btns ul li.facebook_btn a:hover { background-position: 0px -33px; }
					#social_btns ul li.twitter_btn a:hover { background-position: -38px -33px; }
					#social_btns ul li.vimeo_btn a:hover { background-position: -82px -33px; }
					#social_btns ul li.linkedin_btn a:hover { background-position: -116px -33px; }
					
			
			/* --- Side Nav Blog Button
			-------------------------------------------------------*/
			
			#container #side_nav #nav_banner #blog_btn a {
				position: absolute;
				display: block;
				text-indent: -9999px;
				top: 263px;
				left: 11px;
				height: 98px;
				width: 155px;
				background-image: url('../img/nav_blog_btn.png');
				background-position: 0px 0px;
			}
			

				#container #side_nav #nav_banner #blog_btn a:hover {
					background-position: 0px -98px;
				
				}
	
	
	/* --- Home
	-------------------------------------------------------*/
	
	#container #home {
		display: block;
		position:relative;
		width: 100%;
		height: 800px;
		margin: 0 auto;
		padding-left:10px;
		background: #68C49F url('../img/home_bg.jpg') no-repeat 0 0;
		background-position:center;
	}
	
		#home #home_title {
			display: block;
			position: relative;
			width: 767px;
			height: 130px;
			margin: 0 auto;
			top: 24px;
			background: url('../img/home_title.png') no-repeat 0 0;
		}
		
		#home #cliff_sign {
			display: block;
			position: relative;
			margin: 0 auto;
			top: 240px;
			left: 365px;
			width: 132px;
			height: 179px;
			background: url('../img/cliff_sign.png') no-repeat 0 0;
		}
	

	/* --- About
	-------------------------------------------------------*/
	
	#container #about_buffer {
		display: block;
		position: relative;
		width: 100%;
		height: 540px;
		margin: 0 auto;
		padding-left:20px;
		background: #FCC960 url('../img/about_buffer_bg.jpg') no-repeat 0 0;
		background-position: center;
	}

	#container #about {
		display: block;
		position: relative;
		width: 100%;
		height: 650px;
		margin: 0 auto;
		padding-left:10px;
		background: #7ED0A0 url('../img/about_bg.jpg') no-repeat 0 0;
		background-position: center;
	}

		#about #about_section {
			display: block;
			position: relative;
			margin: 0 auto;
			width: 1020px;
			height: 794px;
			background-color: #A3D802;
		}

			#about_section #about_title {
				display: block;
				position: relative;
				width: 977px;
				height: 90px;
				margin: 0 auto;
				top: 40px;
				background: url('../img/about_title.png') no-repeat 0 0;
			}
			
			#about_section #about_quote {
				display: block;
				position: relative;
				width: 977px;
				height: 117px;
				margin: 0 auto;
				top: 53px;
				background: url('../img/about_quote.png') no-repeat 0 0;
			}
				
				#about_section #about_content {
					color: #cec396;
					font-family: Helvetica, Arial, Sans-Serif;
					font-size: 12px;
					line-height: 16px;
				}
				
					#about_section #about_content .title {
						color: #68C49F;
						font-family:'΢ÈíÑźÚ';
						font-size: 18px;
						line-height: 20px;
						padding-bottom: 2px;
					}
				
					#about_section #about_content p {
						padding-bottom: 5px;
						color: #ffffff;
						line-height:30px;
						font-size:14px;
						font-family:'΢ÈíÑźÚ';
					}
					
					#about_section #about_content ul {
						border: 0px;
						padding: 0px;
						margin: 0px;
						list-style: none;
						color: #ffffff;
						font-family: '΢ÈíÑźÚ';
						font-size: 14px;
						line-height: 20px;
					}
					
						#about_section #about_content li {
							padding-bottom: 5px;
							text-indent: 18px;
							background: url('../img/bullet_star.png') no-repeat 0 0;
						}
					
					#about_section #about_content a {
						text-decoration: none;
						color: #803434;
					}
					
					#about_section #about_content a:hover {
						color: #cec396;
					}
					
						#about_content #about_column_one {
	display: block;
	position: absolute;
	width: 309px;
	top: 276px;
	left: 66px;
	height: 201px;
						}
						
						#about_content #about_column_two {
							display: block;
							position: absolute;
							width: 300px;
							top: 332px;
							left: 509px;
						}
						
						#about_content #about_column_three {
							display: block;
							position: absolute;
							width: 300px;
							top: 290px;
							left: 690px;
						}
			
			#about_section #about_footer {
				display: block;
				clear: both;
				position: absolute;
				top: 727px;
				left: 21px;
				width: 977px;
				height: 3px;
				background: url('../img/content_divider.png') no-repeat 0 0;
			}

	
	/* --- Work
	-------------------------------------------------------*/
	
	#container #work_buffer {
		display: block;
		width: 100%;
		height: 540px;
		margin: 0 auto;
		padding-left:20px;
		position: relative;
		background: #FCC960 url('../img/work_buffer_bg.jpg') no-repeat 0 0;
		background-position: center;
	}

	#container #work {
		display: block;
		width: 100%;
		height:auto;
		min-height:240px;
		margin: 0 auto;
		padding-left:10px;
		position: relative;
		background-color: #B9DF66;
	}

		#work #work_section {
			display: block;
			margin: 0 auto;
			width: 1020px;
		}
		
			#work_section #work_title {
				display: block;
				position: relative;
				width: 977px;
				height: 96px;
				margin: 0 auto;
				top: 40px;
				z-index: 99;
				background: url('../img/work_title.png') no-repeat 0 0;
			}			

			#work_section #work_nav {
				display: block;
				position: relative;
				width: 977px;
				height: 64px;
				margin: 0 auto;
				top: 40px;
				background: url('../img/work_nav_bg.png') no-repeat 0 0;
			}
				
				#work_section #work_nav #work_sort_btns {
					display: block;
					position: relative;
					height: 15px;
					width: 741px;
					top: 25px;
					left: 236px;
				}
				
					#work_sort_btns ul {
						position: relative;
						border: 0px;
						padding: 0px;
						margin: 0px;
						height: 15px;
					}
					
						#work_sort_btns ul li {
							list-style: none;
							display: inline-block;
							position: relative;
							border: 0px;
							padding: 0px;
							margin: 0px;
							height: 15px;
						}

							#work_sort_btns ul li a {
								display: block;
								border: 0px;
								padding: 5px;
								margin: 0px;
								text-indent: -9999px;
							}

								#work_sort_btns #all {
									position: absolute;
									display: block;
									top: 0px;
									left: 0px;
									width: 34px;
									height: 14px;
									background: url('../img/sort_all_bg.png') no-repeat 0 0;
								}

									#work_sort_btns #all:hover {
										background-position: 0px -28px;
									}

										#work_sort_btns #all.ui-selected {
											background-position: 0px -14px;
										}
								
								#work_sort_btns #design {
									position: absolute;
									display: block;
									top: 0px;
									left: 91px;
									width: 66px;
									height: 14px;
									background: url('../img/sort_design_bg.png') no-repeat 0 0;
								}

									#work_sort_btns #design:hover {
										background-position: 0px -28px;
									}

										#work_sort_btns #design.ui-selected {
											background-position: 0px -14px;
										}
								
								#work_sort_btns #interactive {
									position: absolute;
									display: block;
									top: 0px;
									left: 221px;
									width: 116px;
									height: 14px;
									background: url('../img/sort_interactive_bg.png') no-repeat 0 0;
								}

									#work_sort_btns #interactive:hover {
										background-position: 0px -28px;
									}
									
										#work_sort_btns #interactive.ui-selected {
											background-position: 0px -14px;
										}
								
								#work_sort_btns #mobile {
									position: absolute;
									display: block;
									top: 0px;
									left: 411px;
									width: 68px;
									height: 14px;
									background: url('../img/sort_mobile_bg.png') no-repeat 0 0;
								}

									#work_sort_btns #mobile:hover {
										background-position: 0px -28px;
									}

										#work_sort_btns #mobile.ui-selected {
											background-position: 0px -14px;
										}
								
								#work_sort_btns #installation {
									position: absolute;
									display: block;
									top: 0px;
									left: 551px;
									width: 131px;
									height: 14px;
									background: url('../img/sort_installation_bg.png') no-repeat 0 0;
								}

									#work_sort_btns #installation:hover {
										background-position: 0px -28px;
									}

										#work_sort_btns #installation.ui-selected {
											background-position: 0px -14px;
										}

			
			#work_section #work_view {
				display: block;
				clear: both;
				position: relative;
				overflow: hidden;
				padding: 0px;
				margin: 0px;
				border: 0px;
				width: 977px;
				height: 435px;
				top: 40px;
				left: 21px;
				margin-bottom: 25px;
			}
			
				#work_section .work_loading {
					display: block;
					width: 977px;
					height: 435px;
					background: url('../img/work_load.png') no-repeat center center;
				}
			
			#work_section #work_grid {
				display: block;
				clear: both;
				position: relative;
				overflow: hidden;
				padding: 0px;
				margin: 0px;
				border: 0px;
				width: 977px;
				top: 55px;
				left: 21px;
			}
				
				#work_grid ul {
					margin: 0px;
					border: 0px;
					padding: 0px;
				}

				#work_grid ul li {
					margin: 0px;
					border: 0px;
					padding: 0px;
					list-style: none;
				}

				#work_grid li.work {
					display: block;
					overflow: hidden;
					width: 146px;
					height: 260px;
					margin: 0px;
					border: 0px;
					padding: 0px;
					margin-bottom: 19px;
				}
					
					#work_grid li.work:hover {
						 
					}
				
				#work_grid li.feature {
					display: block;
					overflow: hidden;
					width: 312px;
					height: 443px;
					margin: 0px;
					border: 0px;
					padding: 0px;
					margin-bottom: 19px;
				}
				
					#work_grid li.feature:hover {
						 
					}
	
	
	/* --- Accolades
	-------------------------------------------------------*/
	
	#container #accolades_buffer {
		display: block;
		width: 100%;
		height: 540px;
		margin: 0 auto;
		padding-left:20px;
		position: relative;
		background: #FCC960 url('../img/accolades_buffer_bg.jpg') no-repeat 0 0;
		background-position: center;
	}

	#container #accolades {
		display: block;
		width: 100%;
		height: 560px;
		margin: 0 auto;
		padding-left:10px;
		position: relative;
		background: #7ED0A0 url('../img/about_bg.jpg') no-repeat 0 0;
		background-position: center;
	}

		#accolades #accolades_section {
			display: block;
			position: relative;
			margin: 0 auto;
			width: 1020px;
			height: 564px;
			background-color: #A3D802;
		}

			#accolades_section #accolades_title {
				display: block;
				position: relative;
				width: 977px;
				height: 90px;
				margin: 0 auto;
				top: 40px;
				background: url('../img/accolades_title.png') no-repeat 0 0;
			}
			
			#accolades_section #accolades_nav {
				display: block;
				position: absolute;
				top: 183px;
				left: 21px;
				height: 233px;
				width: 189px;
			}
				
				#accolades_nav li {
					text-indent: -9999px;
					cursor: pointer;
				}
								
				#accolades_nav #brands_tab {
					display: block;
					position: relative;
					width: 189px;
					height: 64px;
					background: url('../img/accolades_tab_brands.png') no-repeat 0 0;
				}
					
					#accolades_nav #brands_tab:hover {
						background-position: 0px -64px;
					}
					
					#accolades_nav #brands_tab.ui-selected {
						background-position: 0px -64px;
						cursor: default;
					}
				
				#accolades_nav #agencies_tab {
					display: block;
					position: relative;
					width: 189px;
					height: 64px;
					margin-top: 20px;
					background: url('../img/accolades_tab_agencies.png') no-repeat 0 0;
				}
				
					#accolades_nav #agencies_tab:hover {
						background-position: 0px -64px;
					}
					
					#accolades_nav #agencies_tab.ui-selected {
						background-position: 0px -64px;
						cursor: default;
					}
				
				#accolades_nav #awards_tab {
					display: block;
					position: relative;
					width: 189px;
					height: 64px;
					margin-top: 20px;
					background: url('../img/accolades_tab_awards.png') no-repeat 0 0;
				}
				
					#accolades_nav #awards_tab:hover {
						background-position: 0px -64px;
					}
					
					#accolades_nav #awards_tab.ui-selected {
						background-position: 0px -64px;
						cursor: default;
					}
			
			/* --- Accolades Content
			-------------------------------------------------------*/
			#accolades_section #accolades_content {
				display: block;
				position: absolute;
				top: 140px;
				left: 260px;
				height: 318px;
				width: 738px;
				color: #ffffff;
				font-family: Helvetica, Arial, Sans-Serif;
				font-size: 12px;
				line-height: 14px;
			}
			
				#accolades_content p {
					padding: 0px;
					border: 0px;
					margin: 0px;
					list-style: none;
					line-height:40px;
					font-family:'΢ÈíÑźÚ';
					font-size:20px;
				}
					
					#accolades_content p.left_column {
						display: block;
						width: 300px;
						height: 318px;
						float: left;
					}
	
					/*#accolades_content ul.right_column {
						display: block;
						width: 180px;
						height: 318px;
						float: right;
					}*/
				
				/* --- Brands Content
				-------------------------------------------------------*/
				#accolades_content #brands_content {
					display: block;
					position: absolute;
					top: 0px;
					left: 0px;
					height: 318px;
					width: 738px;
				}
				
					#brands_content #brands_callout {
						display: block;
						position: absolute;
						top: 0px;
						left: 0px;
						height: 299px;
						width: 299px;
						background: url('../img/brands_callout.png') no-repeat 0 0;
					}
					
					#brands_content #brands_listing {
						display: block;
						position: absolute;
						top: 0px;
						left: 355px;
						height: 318px;
						width: 383px;
					}
				
				
				/* --- Agencies Content
				-------------------------------------------------------*/
				#accolades_content #agencies_content {
					display: block;
					position: absolute;
					top: 0px;
					left: 0px;
					height: 318px;
					width: 738px;
				}
				
					#accolades_content #agencies_callout {
						display: block;
						position: absolute;
						top: 0px;
						left: 0px;
						height: 299px;
						width: 299px;
						background: url('../img/agencies_callout.png') no-repeat 0 0;
					}
					
					#accolades_content #agencies_listing {
						display: block;
						position: absolute;
						top: 0px;
						left: 355px;
						height: 318px;
						width: 383px;
					}
				
				
				/* --- Awards Content
				-------------------------------------------------------*/
				#accolades_content #awards_content {
					display: block;
					position: absolute;
					top: 0px;
					left: 0px;
					height: 318px;
					width: 738px;
				}
				
					#accolades_content #awards_callout {
						display: block;
						position: absolute;
						top: 0px;
						left: 0px;
						height: 299px;
						width: 299px;
						background: url('../img/awards_callout.png') no-repeat 0 0;
					}
					
					#accolades_content #awards_listing {
						display: block;
						position: absolute;
						top: 0px;
						left: 355px;
						height: 318px;
						width: 383px;
					}
			
			
			#accolades_section #accolades_footer {
				display: block;
				clear: both;
				position: absolute;
				top: 497px;
				left: 21px;
				width: 977px;
				height: 3px;
				background: url('../img/content_divider.png') no-repeat 0 0;
			}
	
	
	/* --- Contact
	-------------------------------------------------------*/
	
	#container #contact_buffer {
		display: block;
		width: 100%;
		height: 540px;
		margin: 0 auto;
		padding-left:20px;
		position: relative;
		background: #FCC960 url('../img/contact_buffer_bg.jpg') no-repeat 0 0;
		background-position: center;
	}

	#container #contact {
		display: block;
		width: 100%;
		height: 940px;
		margin: 0 auto;
		padding-left:10px;
		position: relative;
		background: #7ED0A0 url('../img/contact_bg.jpg') no-repeat 0 0;
		background-position: center;
	}

		#contact #contact_section {
			display: block;
			position: relative;
			margin: 0 auto;
			width: 1020px;
			height: 764px;
			background-color: #A3D802;
		}

			#contact_section #contact_title {
				display: block;
				position: relative;
				width: 977px;
				height: 90px;
				margin: 0 auto;
				top: 40px;
				background: url('../img/contact_title.png') no-repeat 0 0;
			}
			
			#contact_section #contact_quote {
				display: block;
				position: relative;
				width: 977px;
				height: 117px;
				margin: 0 auto;
				top: 53px;
				background: url('../img/contact_quote.png') no-repeat 0 0;
			}
			
			#contact_section #contact_content {
				color: #cec396;
				font-family: Helvetica, Arial, Sans-Serif;
				font-size: 12px;
				line-height: 16px;
			}
			
				#contact_section #contact_content .title {
					color: #68C49F;
					font-family:'΢ÈíÑźÚ';
					font-size: 18px;
					line-height: 22px;
					padding-bottom: 20px;
				}
			
				#contact_section #contact_content p {
					padding-bottom: 25px;
					color: #ffffff;
				}
				
				#contact_section #contact_content ul {
					border: 0px;
					padding: 0px;
					margin: 0px;
					list-style: none;
					color: #ffffff;
					font-family: 'HaymakerRegular', Helvetica, Arial, sans-serif;
					font-size: 14px;
					line-height: 16px;
				}
				
					#contact_section #contact_content li {
						padding-bottom: 5px;
						text-indent: 18px;
						background: url('../img/bullet_star.png') no-repeat 0 0;
					}
				
				#contact_section #contact_content a {
					text-decoration: none;
					color: #803434;
				}
				
				#contact_section #contact_content a:hover {
					color: #cec396;
				}
				
					#contact_content #contact_column_one {
						display: block;
						position: absolute;
						width: 240px;
						top: 250px;
						left: 25px;
					}
					
					#contact_content #contact_column_two {
						display: block;
						position: absolute;
						width: 650px;
						top: 250px;
						left: 325px;
					}
					
					#contact_column_two #contact_form {
						display: block;
						position: relative;
					}
					
						#contact_form input:focus {
							outline: none;
						}
						
						#contact_form textarea:focus {
							outline: none;
						}

						#contact_form .form_input {
						    background-color:#ffffff;
							/*background: url('../img/input_field.png') no-repeat 0 0;*/
						}

						#contact_form .form_textarea {
							background-color:#ffffff;
						}
						
						#contact_form #username {
							display: block;
							position: absolute;
							top: 7px;
							left: 0px;
							width: 208px;
							height: 28px;
							border: 0px;
							padding: 0px;
							margin: 0px;
							padding-left: 5px;
							padding-right: 5px;
							color: #597177;
							font-family: Helvetica, Arial, Sans-Serif;
							font-size: 12px;
							line-height: 16px;
						}
						
						#contact_form #phone {
							display: block;
							position: absolute;
							top: 7px;
							left: 226px;
							width: 208px;
							height: 28px;
							border: 0px;
							padding: 0px;
							margin: 0px;
							padding-left: 5px;
							padding-right: 5px;
							color: #597177;
							font-family: Helvetica, Arial, Sans-Serif;
							font-size: 12px;
							line-height: 16px;
						}
						
						#contact_form #email {
							display: block;
							position: absolute;
							top: 47px;
							left: 0px;
							width: 208px;
							height: 28px;
							border: 0px;
							padding: 0px;
							margin: 0px;
							padding-left: 5px;
							padding-right: 5px;
							color: #597177;
							font-family: Helvetica, Arial, Sans-Serif;
							font-size: 12px;
							line-height: 16px;
						}
						
						#contact_form #yingyong {
							display: block;
							position: absolute;
							top: 87px;
							left: 0px;
							width: 208px;
							height: 28px;
							border: 0px;
							padding: 0px;
							margin: 0px;
							padding-left: 5px;
							padding-right: 5px;
							color: #597177;
							font-family: Helvetica, Arial, Sans-Serif;
							font-size: 12px;
							line-height: 16px;
						}
						
						#contact_form #qq {
							display: block;
							position: absolute;
							top: 47px;
							left: 226px;
							width: 208px;
							height: 28px;
							border: 0px;
							padding: 0px;
							margin: 0px;
							padding-left: 5px;
							padding-right: 5px;
							color: #597177;
							font-family: Helvetica, Arial, Sans-Serif;
							font-size: 12px;
							line-height: 16px;
						}
						
						#contact_form #weixin {
							display: block;
							position: absolute;
							top: 87px;
							left: 226px;
							width: 208px;
							height: 28px;
							border: 0px;
							padding: 0px;
							margin: 0px;
							padding-left: 5px;
							padding-right: 5px;
							color: #597177;
							font-family: Helvetica, Arial, Sans-Serif;
							font-size: 12px;
							line-height: 16px;
						}
						#contact_form #miaoshu {
							display: block;
							position: absolute;
							top: 147px;
							left: 0px;
							width: 600px;
							height: 132px;
							border: 0px;
							padding: 0px;
							margin: 0px;
							padding-top: 5px;
							padding-left: 5px;
							padding-right: 5px;
							color: #597177;
							font-family: Helvetica, Arial, Sans-Serif;
							font-size: 12px;
							line-height: 16px;
							resize: none;
						}
						.form_submit {
							display: block;
							position: absolute;
							top: 300px;
							left: 460px;
							width: 140px;
							height: 42px;
							border: 0px;
							padding: 0px;
							margin: 0px;
							text-indent: -9999px;
							background: url('../img/submit_btn.png') no-repeat 0 0;
						}
						
							.form_submit:hover {
								cursor: pointer;
								background-position: 0px -50px;
				
							}
						
						
						#contact_form #response {
							display: block;
							position: absolute;
							top: 251px;
							left: 6px;
						}
			
			
			#contact_section #contact_footer {
				display: block;
				clear: both;
				position: absolute;
				top: 669px;
				left: 21px;
				width: 977px;
				height: 3px;
				background: url('../img/content_divider.png') no-repeat 0 0;
			}
	
	
	/* --- Media Queries
	-------------------------------------------------------*/
	@media only screen and ( max-width:1460px ) {
	
	}
	
	@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
		
		#footer_nav { position: relative; }
		
	}
	
	@media only screen and ( max-width:1024px ) {
		
		#footer_nav { position: relative; }
		
	}
	
	
	/* --- Clearfix
	-------------------------------------------------------*/
	
	.clearfix:before, .clearfix:after { content: ""; display: table; }
	.clearfix:after { clear: both; }
	.clearfix { zoom: 1; }


	/* --- Isotope - Work Section
	-------------------------------------------------------*/
	
	
	/**** Isotope Filtering ****/

	.isotope-item {
	  z-index: 2;
	}
	
	.isotope-hidden.isotope-item {
	  pointer-events: none;
	  z-index: 1;
	}
	
	
	/**** Isotope CSS3 transitions ****/
	
	.isotope,
	.isotope .isotope-item {
	  -webkit-transition-duration: 0.8s;
		 -moz-transition-duration: 0.8s;
		   -o-transition-duration: 0.8s;
			  transition-duration: 0.8s;
	}
	
	.isotope {
	  -webkit-transition-property: height, width;
		 -moz-transition-property: height, width;
		   -o-transition-property: height, width;
			  transition-property: height, width;
	}
	
	.isotope .isotope-item {
	  -webkit-transition-property: -webkit-transform, opacity;
		 -moz-transition-property:    -moz-transform, opacity;
		   -o-transition-property:         top, left, opacity;
			  transition-property:         transform, opacity;
	}
	
	
	/**** disabling Isotope CSS3 transitions ****/
	
	.isotope.no-transition,
	.isotope.no-transition .isotope-item,
	.isotope .isotope-item.no-transition {
	  -webkit-transition-duration: 0s;
		 -moz-transition-duration: 0s;
		   -o-transition-duration: 0s;
			  transition-duration: 0s;
	}