/* --- t r i n c h . c o m ---
web  -> http://www.trinch.com
mail -> info@trinch.com
------------------------------ */

/* --- standard --- */
body {
	background: #e7e7db url(../img/body.gif) repeat-x;
	font: 12px Arial, Verdana, Helvetica, sans-serif;
	color: #fff;
	margin: 0;
	padding: 0;
	}
img {
	border: none;
	}
a {
	outline: none;
	color: #000;
	text-decoration: underline;
	}
a:hover {
	text-decoration: none;
	}

/* --- layout --- */
#page {
	width: 776px;
	margin: 0 auto;
	}
#header {
	width: 100%;
	height: 150px;
	background: url(../img/header.gif) repeat-x;
	}
	#header .wrap {
		overflow: hidden;
		width: 100%;
		}
		#header .wrap ul {
			float: right;
			list-style: none;
			margin: 0;
			padding: 0 19px 0 0;
			}
		#header .wrap li {
			float: left;
			width: 25px;
			background: #141617;
			font-size: 10px;
			text-align: center;
			line-height: 20px;
			margin-right: 1px;
			}
		#header .wrap a {
			color: #fff;
			text-decoration: none;
			}
		#header .wrap a:hover {
			color: #ff9;
			}
.logo {
	display: block;
	overflow: hidden;
	width: 285px;
	height: 40px;
	background: url(../img/logo.gif) no-repeat;
	text-indent: -9999em;
	margin: 13px auto 0 auto;
	}
#container {
	width: 100%;
	padding: 20px 0 0;
	}
.gallery {
	position: relative;
	z-index: 1;
	overflow: hidden;
	width: 695px;
	height: 195px;
	margin: 0 auto;
	}
	.gallery ul {
		list-style: none;
		width: 1000px;
		margin: 0;
		padding: 0;
		}
.gallery-list li {
	float: left;
	overflow: hidden;
	background: #40413b;
	border: 1px solid #ff9;
	margin-right: 55px;
	padding: 10px;
	}
	.gallery-list li a img {
		border: 3px solid #fff;
		text-decoration: none;
		}
	.gallery-list li a:hover img {
		border: 3px solid #ff9;
		}
.navigation li {
	position: absolute;
	z-index: 5;
	top: 0;
	}
	.navigation li a {
		position: relative;
		display: block;
		cursor: pointer;
		width: 195px;
		height: 195px;
		background: url(../img/arrow-bg.png) repeat;
		text-decoration: none;
		}
	.navigation li a:hover {
		background: url(../img/arrow-bg-hover.png) repeat;
		}
	.navigation li span {
		position: relative;
		display: block;
		width: 195px;
		height: 195px;
		text-indent: -999px;
		}
	.navigation .left {
		left: 0;
		}
		.navigation .left a span {
			background: url(../img/arrow-left.gif) no-repeat 50% 50%;
			}
		.navigation .left a:hover span {
			background: url(../img/arrow-left-hover.gif) no-repeat 50% 50%;
			}
	.navigation .right {
		left: 500px;
		}
		.navigation .right a span {
			background: url(../img/arrow-right.gif) no-repeat 50% 50%;
			}
		.navigation .right a:hover span {
			background: url(../img/arrow-right-hover.gif) no-repeat 50% 50%;
			}
h2 {
	width: 691px;
	background: url(../img/bg.png) repeat-y;
	font-size: 11px;
	font-weight: normal;
	color: #40413b;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 2px;
	margin: 10px auto 19px auto;
	padding: 6px 0 7px 0;
	}
.box {
	overflow: hidden;
	width: 716px;
	background: #a9a9a0 url(../img/bg-box.gif) repeat-x 0 100%;
	padding: 20px 30px 5px;
	}
.text {
	float: left;
	width: 455px;
	line-height: 16px;
	padding-bottom: 24px;
	}
	.text h3 {
		font-size: 14px;
		font-weight: normal;
		color: #000;
		letter-spacing: 1px;
		text-transform: uppercase;
		margin: 0;
		padding-top: 10px;
		}
	.text p {
		margin: 0 0 5px 0;
		padding-top: 10px;
		}
	.text .list {
		list-style: none;
		line-height: 18px;
		margin: 0;
		padding: 5px 0 0 0;
		}
		.text .list li {
			background: url(../img/marker.gif) no-repeat 0 13px;
			padding-left: 10px;
			}
			.text .list li strong {
				font-size: 18px;
				font-weight: normal;
				color: #000;
				line-height: 24px;
				}
	.text div.list {
		background: url(../img/marker.gif) no-repeat 0 13px;
		padding-left: 10px;
		}
		.text div.list strong {
			font-size: 18px;
			font-weight: normal;
			color: #000;
			line-height: 24px;
			}
	.text .projects {
		list-style: none;
		margin: 15px 0 0 0;
		padding: 0;
		}
		.text .projects li {
			float: left;
			width: 440px;
			background: #babab0;
			padding: 10px;
			margin-bottom: 5px;
			}
		.text .projects li.first {
			border-top: none;
			}
		.text .projects li.active {
			background: #ccccc5;
			}
			.text .projects li a img {
				float: left;
				display: block;
				overflow: hidden;
				width: 50px;
				height: 50px;
				border: 5px solid #fff;
				margin: 0;
				padding: 0;
				}
			.text .projects li a:hover img {
				border: 5px solid #ff9;
				}
			.text .projects li span {
				float: right;
				width: 365px;
				}
				.text .projects li span a {
					font-size: 14px;
					font-weight: bold;
					color: #000;
					text-decoration: none;
					margin: 0;
					padding: 0;
					}
				.text .projects li span a:hover {
					color: #ff9;
					}
				.text .projects li span h4 {
					font-size: 12px;
					color: #000;
					margin: 0;
					padding: 0 0 10px 0;
					}
.inner-box {
	float: right;
	width: 232px;
	min-height: 211px;
	background: url(../img/inner-box-bg.gif) repeat-x;
	}
* html .inner-box {
	height: 211px;
	}
	.inner-box .inner {
		background: url(../img/inner-box-top.gif) no-repeat;
		padding: 15px 20px 20px 20px;
		}
	.inner-box h3 {
		background: url(../img/dot.gif) repeat-x 0 100%;
		font-size: 12px;
		font-weight: normal;
		letter-spacing: 2px;
		text-transform: uppercase;
		margin: 0 0 18px 0;
		padding-bottom: 8px;
		}
	.inner-box p {
		margin: 0 0 16px 0;
		}
	.inner-box strong {
		display: block;
		color: #ff9;
		}
	.inner-box a {
		color: #ff9;
		}
	.inner-box p {
		display: block;
		font-style: normal;
		line-height: 14px;
		}
#footer {
	width: 776px;
	margin: 0 auto;
	padding: 0 0 10px 0;
	}
	#footer .right a {
		display: block;
		width: 56px;
		height: 20px;
		background: url(../img/trinch.gif) no-repeat left top;
		text-indent: -99999px;
		text-decoration: none;
		margin: 0;
		padding: 0;
		}
	#footer .right a:hover {
		background: url(../img/trinch.gif) no-repeat left bottom;
		text-decoration: none;
		}

/* --- menu --- */
#menu {
	list-style: none;
	width: 753px;
	text-align: center;
	margin: 46px auto 0 auto;
	padding: 0;
	}
	#menu li {
		float: left;
		display: inline;
		list-style: none;
		}
		#menu li a {
			float: left;
			width: 123px;
			border-right: 3px solid #000;
			font-size: 10px;
			color: #fff;
			text-align: center;
			text-transform: uppercase;
			text-decoration: none;
			padding: 5px 0 12px 0;
			}
		#menu li a.active {
			background: #000;
			}
		#menu li.last a {
			border-right: none;
			}
	#menu li.hover,
	#menu li:hover {
		position: relative;
		z-index: 200;
		}
		#menu li.hover a,
		#menu li:hover a {
			background: #000;
			color: #ff9;
			}
		#menu li.hover ul,
		#menu li:hover ul {
			display: block;
			}
	#menu ul {
		position: absolute;
		z-index: 300;
		display: none;
		top: 30px;
		left: 0;
		width: 125px;
		margin: 0;
		padding: 0;
		}
		#menu ul li a {
			width: 113px;
			background: #000 url(../img/menu-line.gif) no-repeat 50% 0 !important;
			border-right: none;
			color: #fff !important;
			text-transform: none;
			letter-spacing: 1px;
			padding: 5px;
			}
		#menu ul li.first a {
			background: #000 !important;
			}
		#menu ul li a:hover {
			color: #ff9 !important;
			}

/* --- form --- */
form, fieldset {
	outline: none;
	border: none;
	margin: 0;
	padding: 0;
	}
fieldset { 
	clear: left;
	float: left;
	display: block;
	width: 450px;
	border: none;
	}
label.txtfield {
	position: relative;
	float: left;
	display: block;
	width: 225px;
	font-size: 10px;
	color: #000;
	text-transform: uppercase;
	margin-bottom: 5px;
	}
	label.full {
		width: 100%;
		}
	label em, 
	label.full em {
		font-style: normal;
		color: #f00;
		}
label.txtfield input, 
label.txtfield textarea {
	outline: none;
	width: 200px;
	background: #fff url(../img/bg-form.gif) repeat-x 0 0;
	border: 1px solid #999;
	font: 12px Arial, Verdana, Helvetica, sans-serif;
	color: #000;
	padding: 3px;
	}
input.txtfield {
	outline: none;
	width: 200px;
	background: #fff url(../img/bg-form.gif) repeat-x 0 0;
	border: 1px solid #999;
	font: 12px Arial, Verdana, Helvetica, sans-serif;
	color: #000;
	padding: 3px;
	}
label.txtfield textarea {
	width: 425px;
	height: 75px;
	}
.btn {
	clear: both;
	float: left;
	width: 450px;
	margin: 0;
	padding: 0;
	}
	.btn em {
		font-size: 11px;
		font-style: normal;
		color: #f00;
		line-height: 20px;
		padding-left: 10px;
		}

/* --- miscellaneous --- */
.clear {
	clear: both;
	height: 0;
	font-size: 1px;
	line-height: 0px;
	}
.left { float: left !important; }
.right { float: right !important; }