/* ============================================================
   Schreinerei Brunner AG - Stylesheet
   erstellt mit Adobe Dreamweaver CS4
   (c) 2011 - Layout: 960px, optimiert fuer 1280x1024
   ============================================================ */

* { margin: 0; padding: 0; }

body {
	background-color: #e9e3d6;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 1.55;
	color: #3a342c;
}

a        { color: #1c5d99; text-decoration: none; }
a:hover  { color: #c0392b; text-decoration: underline; }
img      { border: 0; }
ul       { margin: 8px 0 12px 22px; }
li       { margin: 3px 0; }
p        { margin: 0 0 11px 0; }

#wrap {
	width: 960px;
	margin: 18px auto;
	background: #ffffff;
	border: 1px solid #c9bfa9;
	-webkit-box-shadow: 0 2px 10px rgba(0,0,0,0.35);
	-moz-box-shadow: 0 2px 10px rgba(0,0,0,0.35);
	box-shadow: 0 2px 10px rgba(0,0,0,0.35);
}

/* ---- top utility bar ---- */
#topbar {
	background: #463018;
	color: #e7d6b8;
	font-size: 11px;
	padding: 5px 18px;
	overflow: hidden;
}
#topbar .r { float: right; }
#topbar a { color: #f0c987; }

/* ---- header ---- */
#header {
	overflow: hidden;
	padding: 16px 18px 12px 18px;
	background: #f7f1e4;
	background: -webkit-linear-gradient(#ffffff, #f1e7d2);
	background: -moz-linear-gradient(#ffffff, #f1e7d2);
	background: linear-gradient(#ffffff, #f1e7d2);
	border-bottom: 1px solid #d8cba9;
}
#header img.logo { float: left; }
#header .phone {
	float: right;
	text-align: right;
	color: #5a3a22;
	margin-top: 6px;
}
#header .phone strong { font-size: 19px; }
#header .phone span { font-size: 11px; color: #8a7b5f; }

/* ---- navigation (glossy tabs) ---- */
#nav {
	list-style: none;
	margin: 0;
	overflow: hidden;
	background: #6f4a23;
	background: -webkit-linear-gradient(#8a5e30, #5a3a1c);
	background: -moz-linear-gradient(#8a5e30, #5a3a1c);
	background: linear-gradient(#8a5e30, #5a3a1c);
	border-top: 1px solid #a9763f;
	padding-left: 10px;
}
#nav li { float: left; margin: 0; }
#nav li a {
	display: block;
	padding: 10px 18px;
	color: #f3ead9;
	font-weight: bold;
	font-size: 13px;
	border-right: 1px solid rgba(0,0,0,0.2);
	border-left: 1px solid rgba(255,255,255,0.08);
	text-shadow: 0 -1px 0 rgba(0,0,0,0.4);
}
#nav li a:hover { background: rgba(255,255,255,0.12); text-decoration: none; }
#nav li a.active {
	background: #c0392b;
	background: -webkit-linear-gradient(#d35400, #b8331f);
	background: linear-gradient(#d35400, #b8331f);
	color: #fff;
}

/* ---- hero ---- */
#hero { line-height: 0; border-bottom: 3px solid #5a3a22; }
#hero img { display: block; width: 100%; height: auto; }

/* ---- content layout (float-based) ---- */
#content { overflow: hidden; padding: 20px 18px 8px 18px; }
#main    { float: left;  width: 600px; }
#sidebar { float: right; width: 300px; }
.clear   { clear: both; height: 0; font-size: 0; }

/* ---- headings ---- */
h1 { font-family: Georgia, "Times New Roman", serif; font-size: 25px; color: #5a3a22; font-weight: normal; margin-bottom: 10px; }
h2 { font-family: Georgia, serif; font-size: 18px; color: #7a4f27; margin: 18px 0 8px 0; padding-bottom: 4px; border-bottom: 1px solid #e2d6bd; }
h3 { font-size: 14px; color: #5a3a22; margin-bottom: 4px; }

/* ---- glossy button ---- */
.btn, input.btn {
	display: inline-block;
	font-family: "Trebuchet MS", Arial, sans-serif;
	font-size: 13px;
	font-weight: bold;
	color: #fff !important;
	text-decoration: none;
	padding: 8px 16px;
	border: 1px solid #8c3a14;
	cursor: pointer;
	background: #d35400;
	background: -webkit-linear-gradient(#e8731f, #c0451a);
	background: -moz-linear-gradient(#e8731f, #c0451a);
	background: linear-gradient(#e8731f, #c0451a);
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
	-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
	text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
}
.btn:hover { background: linear-gradient(#f0822c, #d04d1d); text-decoration: none; }

/* ---- boxes (sidebar + callouts) ---- */
.box {
	border: 1px solid #d8cba9;
	-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;
	margin-bottom: 16px;
	background: #fdfaf3;
	overflow: hidden;
}
.box h3 {
	background: #efe4cd;
	background: -webkit-linear-gradient(#f5ecd8, #e6d6b4);
	background: linear-gradient(#f5ecd8, #e6d6b4);
	padding: 7px 12px;
	margin: 0;
	border-bottom: 1px solid #d8cba9;
	font-family: Georgia, serif;
	color: #5a3a22;
}
.box .inner { padding: 10px 12px; font-size: 12px; }
.box ul { margin: 4px 0 4px 18px; }

.callout {
	background: #fcf3d8;
	border: 1px solid #e7cf8c;
	-webkit-border-radius: 6px; border-radius: 6px;
	padding: 10px 14px;
	margin: 14px 0;
}
.callout strong { color: #c0392b; }

.quote { font-family: Georgia, serif; font-style: italic; font-size: 15px; color: #7a4f27; }
.small { font-size: 11px; color: #8a7b5f; }

/* ---- gallery ---- */
.gallery { overflow: hidden; margin: 6px 0 4px 0; }
.gallery .thumb {
	float: left;
	width: 188px;
	margin: 0 12px 12px 0;
	text-align: center;
}
.gallery .thumb img {
	width: 188px; height: auto;
	border: 1px solid #c9bfa9;
	padding: 4px;
	background: #fff;
	-webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.2);
	box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}
.gallery .thumb span { display: block; font-size: 11px; color: #8a7b5f; margin-top: 4px; }
.gallery .last { margin-right: 0; }

.imgright { float: right; margin: 0 0 10px 16px; border: 1px solid #c9bfa9; padding: 4px; background: #fff;
	-webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.2); box-shadow: 0 1px 4px rgba(0,0,0,0.2); }

/* ---- tables ---- */
table.svc { border-collapse: collapse; width: 100%; margin: 8px 0; }
table.svc th { background: #efe4cd; text-align: left; padding: 7px 10px; border: 1px solid #d8cba9; font-family: Georgia, serif; color: #5a3a22; }
table.svc td { padding: 7px 10px; border: 1px solid #e2d6bd; vertical-align: top; }
table.svc tr.alt td { background: #fbf6ea; }

/* ---- forms ---- */
label { display: block; font-size: 12px; font-weight: bold; color: #5a3a22; margin-top: 8px; }
input.txt, textarea.txt {
	width: 96%; padding: 5px; font-family: Arial, sans-serif; font-size: 12px;
	border: 1px solid #c2b89f; -webkit-border-radius: 3px; border-radius: 3px; background: #fffdf8;
}

/* ---- footer ---- */
#footer {
	clear: both;
	background: #463018;
	color: #cdbb9b;
	font-size: 11px;
	padding: 14px 18px;
	overflow: hidden;
	border-top: 3px solid #5a3a22;
}
#footer a { color: #f0c987; }
#footer .r { float: right; text-align: right; }
