@charset "utf-8";



/* 	Sync Interactive
	
	-------------------------------------------------- */



/*	CONTENT

	01.	Global
	02.	Page
	03.	Header
	04. Home
	05. Main
	06. Footer
	07. Form
	
	-------------------------------------------------- */



/*	01. CLOBAL
	-------------------------------------------------- */
	
	* {
		margin: 0;
		padding: 0;
		}
	
	a {
		-moz-outline-style:none;
		}	
			
	a:link {
		color: #FA8F26;
		text-decoration: none;
		}
	a:visited {	
		color: #FA8F26;
		text-decoration: none;
		}
	a:hover {
		color: #FA8F26;
		text-decoration: none;
		}
		.arrow {
			background:  url(../images/arrow.png) no-repeat;
			padding-right: 11px;
			}
		
	a img {
		border: none;
		}	
	
	.error {
		color: red;
	}
	
/*	02. PAGE
	-------------------------------------------------- */
	
	html {
		overflow: -moz-scrollbars-vertical;
		}

	body {
		background:  url(../images/page-bg.png);
		color: #717171;
		font-family: Arial, Helvetica, sans-serif;
		}
	
	.outer {
		margin: 0 auto;
		padding-bottom: 16px;
		overflow: hidden;
		width: 799px;
		}
	
	.header, .last-work, .main, .footer {
		background: #FFF;
		border-bottom: 1px solid #D1D1D1;
		float: left;
		overflow: hidden;
		width: 799px;
		}
		
			
	
/*	03. HEADER
	-------------------------------------------------- */
	
	.header {
		margin-top: 16px;
		padding-bottom: 13px;
		}		
		.logo {
			float: left;
			margin: 17px 0 0 15px;
			}			
		.nav {
			float: right;
			margin: 26px 11px 0 0;	
			}
			.nav li {
				float: left;
				list-style: none;
				margin-left: 20px;
				}
				.nav li a {				
					color: #664421 !important;
					font-size: 0.8em;
					}
				
				

/*	03. HOME
	-------------------------------------------------- */
	
	
	/* ----- last work ----- */
	
	.last-work {
		margin-top: 9px;
		}
		.last-work img {
			border-bottom: 1px solid #D1D1D1;
			margin: 3px 0 0 3px;
			}
		.last-work p {
			color: #502901;
			font-size: 10px;
			padding: 3px 0 3px 11px;
			text-transform:uppercase;
			}
			.last-work p .arrow {
				background-position: 100% 3px;
				font-size: 10px;
				}
			
	
	/* ----- about us ----- */
	.top-header {
		text-align: center;
		font-size: 9px;		
		
		}
	
	/* ----- about us ----- */
	
	.about-us {
		float: left;
		font-size: 11px;		
		width: 395px;
		}
		.about-us h1 {
			background: #FFF;
			border-bottom: 1px solid #D1D1D1;
			margin-top: 9px;
			padding: 9px 0 9px 12px;
			}
		.about-us .wrap {
			background: #FFF;
			margin-top: 3px;
			padding: 5px 12px 20px;
			line-height: 19px;
			min-height: 177px;
			overflow: hidden;
			}
			.about-us .wrap .arrow {
				background-position: 100% 3px;
				font-size: 10px;
				}
	
	
	/* ----- our service ----- */
	
	.our-services {
		float: left;
		font-size: 11px;		
		width: 395px;
		}
		.our-services h1 {
			background: #FFF;
			border-bottom: 1px solid #D1D1D1;
			margin-top: 9px;
			padding: 9px 0 9px 12px;
			}
		.our-services .wrap {
			background: #FFF;
			margin-top: 3px;
			padding: 5px 0 20px 12px;
			line-height: 19px;
			min-height: 142px;
			overflow: hidden;
			}
			.our-services .wrap ul {
				overflow: hidden;		
				}
				.our-services .wrap ul li {		
					background:  url(../images/bullet.png) no-repeat 0 7px;
					float: left;
					list-style: none;
					padding-left: 10px;
					width: 181px;
					}
			.our-services .wrap p {
				margin-top: 5px;
				}
				.our-services .wrap p .arrow {
					background-position: 100% 3px;
					font-size: 10px;
					}
	
	
	/* ----- case studies ----- */
	
	.case-studies {
		float: right;
		font-size: 11px;		
		width: 395px;
		}
		.case-studies h1 {
			background: #FFF;
			border-bottom: 1px solid #D1D1D1;
			margin-top: 9px;
			padding: 9px 0 9px 12px;
			}
		.case-studies .wrap {
			background: #FFF;
			margin-top: 3px;
			padding: 0px 12px 10px 12px;
			line-height: 18px;
			overflow: hidden;
			}
			.case-studies .wrap .work {
				background: #F3F3E9 url(../images/work-bg.png) no-repeat;
				border: 1px solid #E2E2D9;
				margin-top: 10px;
				overflow: hidden;
				}
				.case-studies .wrap .work dt {
					float: left;
					height: 93px;
					overflow: hidden;
					width: 130px;				
					}
				.case-studies .wrap .work dd {
					background:  url(../images/work-dot.png) repeat-y 0 0;
					float: left;
					height: 69px;
					padding: 8px 15px 12px;
					width: 207px;
					}
					.case-studies .wrap .work dd h3 {
						font-size: 12px;
						font-weight: bold;
						}
					.case-studies .wrap .work dd .arrow {
						background-position: 100% 5px;
						}
	
	
	/* ----- talk to us ----- */
	
	.talk-to-us {
		background: #FFF;
		border-bottom: 1px solid #D1D1D1;
		float: right;
		font-size: 11px;
		line-height: 18px;
		margin-top: 9px;
		min-height: 59px;
		padding: 12px 12px 12px;
		overflow: hidden;
		width: 370px;
		}	
		.talk-to-us h2 {
			margin-bottom: 4px;
			}
		.talk-to-us .arrow {
			background-position: 100% 3px;
			font-size: 10px;
			}
				

		
/*	03. MAIN
	-------------------------------------------------- */
	
	.main {
		margin-top: 9px;
		}
		.main h1 {
				border-top: 2px solid #FA8F26;
				color: #664421;
				font-size: 16px;
				margin: 22px 9px 0;
				padding-top: 17px;
				}
			.main h1 span {
				color: #fa8f26;
				}
		
		/* ----- header ----- */
		
		.main div.header-img {
			background:  url(../images/header-dot.png) repeat-x 100% 20px;
			float:left;
			margin-left: 9px;
			padding-top: 32px;
			}
			.main div.header-img div {
				background:  url(../images/header-dot.png) repeat-x 100% 0px;
				height:1px;
				margin-top:8px;
				}
		.main div.short-width {
			width: 502px;
			}
		.main div.long-width {
			width: 778px;
			}

		/* ----- nav-2 ----- */
		
		.main div.nav-2 {
			background:  url(../images/header-dot.png) repeat-x 100% 20px;
			float: right;
			margin-left: 25px;
			margin-right: 9px;
			padding-top: 47px;
			width: 253px;
			}
			.main div.nav-2 ul {
				margin: 0 0 25px 0;
				}
				.main div.nav-2 ul li {		
					background:  url(../images/bullet-2.png) no-repeat 0 6px;
					font-size: 13px;
					list-style: none;
					padding-left: 16px;
					padding-bottom: 12px;
					}
					.main div.nav-2 ul li a.active {		
						text-decoration:underline;
						}
			.main div.nav-2 div {
				background:  url(../images/header-dot.png) repeat-x 100% 0px;
				height:1px;
				}
				
		/* ----- nav-3 ----- */
		.main div.nav-3 {
			overflow: hidden;
			margin-left: 9px;
			background:  url(../images/header-dot.png) repeat-x 100% 100%;
			}
			.main div.nav-3 ul {
				float: right;
				margin: 0 0 10px 0;
				padding-right: 143px;
				}
				.main div.nav-3 ul li {		
					font-size: 11px;
					list-style: none;
					padding-bottom: 15px;
					}
					.main div.nav-3 ul li a {		
						color: #664421;
						}
						
					.main div.nav-3 ul li a.active {		
						color: #FA8F26;
						}
				
		/* ----- left-col ----- */
		
		.main div.left-col {
			/*background: url(../img/header-dot.png) repeat-x 100% 100%;*/
			float:left;
			margin-left: 11px;
			padding-top: 10px;
			float: left;
			width: 500px;
			overflow: hidden;
			}
			.main div.left-col p {
				font-size:12px;
				line-height: 17px;
				padding-bottom: 16px;
				}
			.main div.left-col p.first {
				font-size:18px;
				line-height: 25px;
				padding-bottom: 18px;
				}
			.main div.left-col p ul {
				margin: 0 0 25px 0;
				}
				.main div.left-col ul li {		
					background:  url(../images/bullet-2.png) no-repeat 0 6px;
					list-style: none;
					padding-left: 20px;
					font-size:12px;
					line-height: 17px;
					padding-bottom: 2px;
					}
			.main div.left-col img.work-preview {
				margin-top: 15px;
				}
			.main div.left-col h3.project-name {
				color: #FA8F26 !important;
				font-size: 18px;
				padding-top: 15px;
				padding-bottom: 10px;
				}
				.main div.left-col h3.project-name span {
					color: #A2A2A2 !important;
					font-size: 12px;
					font-weight:normal;
					}
			.main div.left-col  a.arrow {
				background-position: 100% 5px;
				font-size: 12px;
				}
			
		
		.main div.left-col-2 {
			float:left;
			margin-left: 11px;
			padding-bottom: 30px;
			float: left;
			width: 500px;
			}
			.main div.left-col-2 h3 {
				color: #FA8F26 !important;
				font-size: 12px;
				font-weight: bold;
				padding-bottom: 10px;
				}
		/* ----- right-col ----- */		
		
		.main div.right-col {
			/*background: url(../img/header-dot.png) repeat-x 100% 100%;*/
			float: right;
			font-size: 11px;
			margin-left: 25px;
			margin-right: 9px;
			line-height: 18px;
			padding-top: 16px;
			width: 253px;
			}
			.main div.right-col h2 {
				margin-bottom: 8px;
				}
			.main div.right-col p {
				padding-left: 3px;
				width: 230px;
				padding-bottom: 4px;
				}
			.main div.right-col .arrow {
				background-position: 100% 3px;
				font-size: 10px;
				}
			.main p.citation {
				color: #664421 !important;
				font-size: 16px;
				font-weight: bold;
				line-height: 28px;
				margin-top: -10px;
				margin-bottom: 10px;
				}
			.main p.citation-author {
				color: #FA8F26 !important;
				font-size: 10px;
				}
			.main div.right-col ul {
				list-style: none;
				padding-top: 10px;
				}
				.main div.right-col ul li{
					float: left;
					padding-left: 20px;
					padding-bottom: 10px;
					}

		/* ----- right-col ----- */		
		
		.main div.right-col-up {
			background:  url(../images/header-dot.png) repeat-x 100% 20px;
			float: right;
			margin-left: 25px;
			margin-right: 9px;
			padding-top: 47px;
			width: 253px;
			}
		
		/* ----- bottom-line ----- */
		.main div.bottom-line {
			margin-left: 9px;
			}
		.main div.bottom-line-left {
			
			height:1px;
			background:  url(../images/header-dot.png) repeat-x 100% 0%;
			/*margin-left: 9px;*/
			padding-bottom: 10px;
			float: left;
			}
		.main div.bottom-line-right {
			height:1px;
			background:  url(../images/header-dot.png) repeat-x 100% 0%;
			float: right;
			margin-left: 25px;
			margin-right: 9px;
			padding-bottom: 31px;
			width: 253px;
			}
		
/*	04. FOOTER
	-------------------------------------------------- */
	
	.footer {
		margin-top: 9px;
		padding: 29px 0 28px 0;
		}
		.copyright {
			float: left;
			font-size: 11px;
			margin-left: 12px;
			}
		.footer ul {
			float: right;
			margin-right: 9px;
			font-size: 11px;
			
			_display: inline;
			}
			.footer ul li {
				float: left;
				list-style: none;
				margin-left: 16px;
				}
				.footer ul li a {
					color: #FA8F26;
					}

/*	07. FORM
	-------------------------------------------------- */
	
	label {
		/*		font-size: 12px;*/
		}
		label.block {
			display: block;
			float: left;
			width: 120px;
		}
	
	label span {
		color: #FF0000;
		}
	
	
	.textfield,
	select,
	textarea {
		border: 1px solid #CCC;
		//font: italic 15px Arial, sans-serif;
		font: 15px Arial, sans-serif;
		/*padding: 3px;*/
		}		
	.textfield {
		//background: #FFF url(../images/input_bg.png) repeat-x top left;
		height: 19px;
		width: 350px;
		padding-top: 2px;
		}
	textarea.contact {
		//background: #FFF url(../images/textarea_bg.png) repeat top left;
		//width: 470px;
		width: 350px;
		height: 73px;
		}
/*
	select {
		width: 170px;
		}
	textarea {
		}
	
	.button {
		font: 14px Arial, sans-serif;
		padding: 4px 6px;
		}
*/