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

/* --- standard --- */
body {
	background: url(../img/bg.png) repeat-x;
	font: 12px Arial, Verdana, sans-serif;
	color: #333;
	margin: 0;
	padding: 0;
	}
img {
	border: none;
	}
a:focus {
	outline: none;
	}
form {
	margin: 0;
	padding: 0;
	}

/* --- layout --- */
#main {
	position: relative;
	overflow: hidden;
	width: 880px;
	margin: 0 auto;
	}
.container-bottom-holder {
	float: left;
	width: 880px;
	background: url(../img/left-col-bottom.gif) no-repeat 55px 100%;
	padding: 0 0 14px;
	}
.container {
	position: relative;
	float: left;
	overflow: hidden;
	width: 880px;
	}
.left-col {
	float: left;
	display: inline;
	overflow: hidden;
	width: 208px;
	background: url(../img/left-col-shadow.png) repeat-y;
	margin: 0 0 -9999px 55px;
	padding: 0 0 9999px;
	}
.left-col-bg-holder {
	float: left;
	display: inline;
	width: 200px;
	background: url(../img/left-col-grad.png) repeat-x;
	margin: 0 0 -9999px 4px;
	padding: 0 0 9999px;
	}
#header {
	position: relative;
	float: right;
	display: inline;
	width: 575px;
	margin: 0 1px 0 0;
	}
	#header span {
		position: absolute;
		overflow: hidden;
		top: 58px;
		left: 12px;
		width: 194px;
		height: 37px;
		background: url(../img/phone.gif) no-repeat;
		text-indent: -9999px;
		}
.photo {
	position: absolute;
	top: 19px;
	left: 0;
	width: 292px;
	height: 188px;
	background: url(../img/photo.png) no-repeat;
	}
.logo {
	position: absolute;
	overflow: hidden;
	top: 21px;
	left: 254px;
	width: 322px;
	height: 78px;
	background: url(../img/logo.gif) no-repeat;
	text-indent: -9999px;
	}
.left-col ul {
	float: right;
	width: 180px;
	font: 12px Arial, Verdana, sans-serif;
	margin: 233px 0 0;
	padding: 0;
	}
	.left-col ul li {
		float: left;
		list-style: none;
		width: 100%;
		padding: 0 0 10px;
		}
		.left-col ul li a {
			display: block;
			background: url(../img/dotted-line-4.gif) repeat-x 0 100%;
			color: #fff;
			text-transform: uppercase;
			text-decoration: none;
			padding: 0 0 5px;
			}
		.left-col ul li.item-home a {
			background: url(../img/dotted-line-1.gif) repeat-x 0 100%;
			}
		.left-col ul li.item-prod a {
			background: url(../img/dotted-line-2.gif) repeat-x 0 100%;
			}
		.left-col ul li.item-links a {
			background: url(../img/dotted-line-3.gif) repeat-x 0 100%;
			}
		.left-col ul li a:hover,
		.left-col ul li a.active {
			background: url(../img/dotted-line-hover.gif) repeat-x 0 100%;
			color: #300;
			}
	.left-col ul li ul {
		float: left;
		width: 162px;
		margin: 0;
		padding: 10px 0 0 8px;
		}
		.left-col ul li ul li {
			padding: 0 0 4px;
			}
			.left-col ul li ul li a {
				background: url(../img/arrow.gif) no-repeat 0 5px !important;
				color: #fff;
				text-transform: none;
				padding: 0 0 0 7px;
				}
.content-bg-holder {
	float: right;
	display: inline;
	width: 600px;
	background: #fff url(../img/content-bg.gif) no-repeat;
	margin: 128px 1px 0 0;
	}
.content-bg-holder ul {
	float: left;
	margin: 0;
	padding: 20px 0 0;
	}
.content-bg-holder ul li {
	float: left;
	display: inline;
	margin: 0 3px 0 25px;
	}
.content-bg-holder ul li img {
	display: block;
	}
.verwarming,
.sanitar,
.kachels {
	float: left;
	background: url(../img/box-1-bottom.jpg) no-repeat;
	width: 165px;
	height: 76px;
	color: #fff;
	text-align: center;
	padding: 5px 0 0;
	}
.sanitar {
	height: 68px;
	background: url(../img/box-2-bottom.jpg) no-repeat;
	padding: 13px 0 0;
	}
.kachels {
	background: url(../img/box-3-bottom.jpg) no-repeat;
	}
.verwarming a,
.sanitar a,
.kachels a {
	font: 12px Arial, Verdana, sans-serif;
	color: #fff;
	text-transform: uppercase;
	text-decoration: none;
	}
.verwarming a:hover,
.sanitar a:hover,
.kachels a:hover {
	text-decoration: underline;
	}
.content-home {
	position: relative;
	float: left;
	width: 550px;
	margin: -17px 0 0;
	padding: 0 0 0 26px;
	}
.content {
	position: relative;
	float: left;
	width: 550px;
	margin: 20px 0 0;
	padding: 0 0 0 26px;
	}
	.content-home h1, 
	.content h1 {
		background: url(../img/dotted-line-content.gif) repeat-x 0 100%;
		font: 24px Arial, Verdana, sans-serif;
		color: #930;
		margin: 0 0 20px;
		padding: 0 0 6px;
		}
		.content-home h1 strong, 
		.content h1 strong {
			text-transform: uppercase;
			}
	.content-home h2, 
	.content h2 {
		font: 14px Arial, Verdana, sans-serif;
		color: #300;
		text-transform: uppercase;
		}
	.content-home p {
		font: 12px/18px Arial, Verdana, sans-serif;
		color: #333;
		margin: 0;
		padding: 0;
		}
	.content p {
		font: 12px/18px Arial, Verdana, sans-serif;
		color: #333;
		margin: 10px 0;
		padding: 0;
		}
		.content p a, 
		.content-home p a {
			color: #9cc;
			}
		.content p a:hover, 
		.content-home p a:hover {
			text-decoration: none;
			}
ul#photo {
	float: left;
	list-style: none;
	width: 545px;
	margin: 0;
	padding: 0;
	}
	ul#photo li {
		float: left;
		width: 125px;
		height: 75px;
		margin: 0 8px 8px 0;
		padding: 0;
		}
	ul#photo li img {
		border: 1px solid #c5bcac;
		}
	ul#photo li a {
		display: block;
		width: 125px;
		height: 75px;
		text-decoration: none;
		}
	ul#photo li a:hover {
		text-decoration: none;
		}
.main-box {
	float: left;
	width: 240px;
	}
.sub-box {
	float: right;
	width: 300px;
	}
#map {
	width: 290px;
	height: 150px;
	border: 1px solid #c5bcac;
	}
#footer {
	float: left;
	width: 750px;
	height: 30px;
	margin: 0;
	padding: 0 0 0 130px;
	}
	#footer a.trinch {
		display: block;
		width: 56px;
		height: 20px;
		background: url(../img/trinch.gif) no-repeat left top;
		text-indent: -9999px;
		text-decoration: none;
		margin: 0;
		padding: 0;
		}
	#footer a.trinch:hover {
		background: url(../img/trinch.gif) no-repeat left bottom;
		text-decoration: none;
		}
table.merken td {
	width: 150px;
	text-align: center;
	}
	table.merken td a {
		font: 9px Arial, Verdana, sans-serif;
		color: #666;
		text-transform: uppercase;
		text-decoration: none;
		}
	table#merken td a:hover {
		color: #930;
		text-decoration: none;
		}
table.merken td.lines {
	border: 1px solid #ccc;
	}

/* --- form --- */
div#formset form fieldset {
	border: 1px #c5bcac solid;
	margin: 0 0 20px 0;
	padding: 0;
	}
div#formset form fieldset legend {
	font-size: 14px;
	font-style: italic;
	color: #c5bcac;
	margin: 0 0 0 10px;
	padding: 2px 5px;
	}
div#formset form fieldset div {
	line-height: 20px;
	margin: 5px 0;
	padding: 0;
	}
div#formset label {
	float: left;
	display: block;
	width: 75px;
	text-align: right;
	margin: 0 10px 0 0;
	padding: 0 0 2px 0;
	}
div#formset label strong {
	color: #f00;
	}
div#formset input:focus,
div#formset textarea:focus {
	background-color: #fff;
	}
div#formset textarea {
	margin: 0;
	padding: 0;
	}
#button {
	width: 300px;
	text-align: center;
	margin: 0 auto;
	padding: 0;
	}

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