/* Farben

Galerie:	#4d3a28;
Friseur:	#6e6328;
Hellgrau:   #edebe9;

Inaktiv:	#a69c93;

Links:		#a85e2c;
Hover:		#cc3300;
Aktiv:		#ff3300;

*/

body {
	font-family: "Verdana", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, Helvetica, Arial, sans-serif;
	font-size: 0.8em;
	line-height: 1.3em;

	text-align: center;
	margin: 0 auto;

	background-color: white;
	color:  #4d3a28;
}

h1, h2, h3, h4, h5, p, ul, li, table, form, img {
	margin: 0 auto 1em auto;
}

p * img {
	margin-bottom: 0;
}

h1 { /* Ohne Verwendung */
}

h2 { /* Grosse Themenueberschriften */
	font-size: 2.0em;
	line-height: 1.1em;
	text-transform: uppercase;
	margin-bottom: 0.3em;
}

h3 { /* Kleine Themenueberschriften */
	font-size: 1.3em;
	line-height: 1.3em;
	text-transform: uppercase;
	margin-bottom: 0.8em;
}

h4 { /* Zwischenueberschriften im Text, ohne Abstand danach */
	font-size: 1.1em;
	margin-bottom: 0.8em;
}

h5 { /* Dachzeile */
}

p {
}

ul, ol {
	list-style: square outside;
	margin-left: 0;
	padding-left: 2.2em;
}

ul li, ol li {
	margin: 0 0 0.4em 0;
}

table {
	font-size: 1em;
}

form {
	font-size: 1em;
	padding: 0;
}

em {
	font-size: 0.9em;
	line-height: 1.5em;

	font-weight: bold;
	font-style: normal;
}

small {
	font-size: 0.8em;
}

img, a, a:link, a:visited, a:hover, a:focus, a:active, 
	button, button:hover, button:focus, button:active {
	outline: none; border: none;
}

/* !Links */

a {
	color: #a85e2c;
}

a:link,
a:visited {
	color: #a85e2c;
}

a:hover,
a:focus {
	color: #cc3300;
	text-decoration: none;
}

a:active {
	color: #ff3300;
	text-decoration: none;
}

/* !Besondere Textformate */

h3.dachzeile {
	font-size: 1.1em;
	line-height: 1.3em;
	margin-bottom: 0.2em;
}

.nowrap {
	white-space: nowrap;
}

/* Debug */

.debug {
	font-size: 0.7em;
	color: #999;
}

/* !Formulare */

form {
}

fieldset { 
}

select {
	width: 100%; margin: 0.3em 0 0.3em -1px;
}

textarea {
	width: 100%; display: block;
}

input.radio, input.checkbox {
	margin: 0 0.5em 0 0;
}

input.text, input.password, input.textarea {
	font-size: 1em;
	color:  #6e6328;
	font-family: "Verdana", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, Helvetica, Arial, sans-serif;

	border: 1px solid #6e6328;
	
	width: 100%;
	padding-left: 0; padding-right: 0;
}

#content #galerie input.text,
#content #galerie input.password,
#content #galerie input.textarea {
	text-align: right;
	color:  #4d3a28;
	
	border-color: #4d3a28;
}

button {
	font-size: 1em;
	color: white;
	
	background-color: #6e6328;
	border: 0;

	margin: 0 0 0.4em 0;
	padding: 0.3em 0.7em;
	
	width: auto; overflow: visible; /* fuer IE */
	cursor: pointer;
}

#content #galerie button {
	background-color: #4d3a28;
}

button:hover,
button:focus,
#content #galerie button:hover,
#content #galerie button:focus {
	background-color: #cc3300;
}

button:active,
#content #galerie button:active,
#content #galerie button:active {
	background-color: #ff3300;
}

form h4 {
	font-size: 1em;
	font-weight: normal;
	margin-bottom: 0.2em;
}

form .pflicht h4 {
	font-weight: bold;
}

form .pflicht input {
	/* font-weight: bold; */
}

/* !Meldungen und Fehler */

form .meldung {
	background-color: #edebe9;
	margin-bottom: 0.8em;
	padding: 0.8em 20px 0.1em 20px;
	
	margin: 0 -20px 0.8em -20px;
}

form .pflicht.fehler input.text {
	background: url(icons/marker.gif) 2px center no-repeat;
}

#content .pflicht.fehler input.text,
#content .pflicht.fehler input.password,
#content .pflicht.fehler input.textarea,
#content #galerie .pflicht.fehler input.text,
#content #galerie .pflicht.fehler input.password,
#content #galerie .pflicht.fehler input.textarea {
	/* border-color: #a85e2c; */
}

form .meldung h4 {
	/* color: #a85e2c; */
	font-weight: bold;
	margin-bottom: 0.4em;
}

form .pflicht.fehler h4 {
	/* color: #a85e2c; */
}

form .meldung ul {
	list-style: none;
	padding: 0;
}

form .meldung ul li {
	list-style: none outside;
	margin: 0 0 0.4em 0;
}

/***************************/
/*****//* !Struktur *//*****/
/***************************/

.clear {
	clear: both;
}

#container {
	text-align: center;
	margin: 0 auto;
	padding: 40px 0 20px 0;
	width: 860px;
}

#branding {
}

#content {
}

#footer {
	clear: both;
	padding-top: 20px;
}

/***************************/
/*****//* !Branding *//*****/
/***************************/

#branding h1 {
	text-transform: uppercase;
	font-size: 26px;
	line-height: 30px;
	
	margin-bottom: 0.25em;
	
	min-width: 200px; width: auto !important; width: 200px;
	height: 30px; 
	overflow: hidden;
}

#branding h1 img {
	width: 192px; height: 30px;
	background: url(logo.gif) top center no-repeat;
}

#branding h1 a {
	text-decoration: none;
	color: #4d3a28;

	min-width: 200px; width: auto !important; width: 200px;
	height: 30px;
}

#branding h1 span {
	display: block; height: 0; width: 0; overflow: hidden;
}

#branding p {
	color: #6e6328;
}

#branding a {
	color: #6e6328;
	text-decoration: none;
}

#branding a:link {
	color: #6e6328;
}

#branding a:visited {
	color: #6e6328;
}

#branding a:hover,
#branding a:focus {
	color: #cc3300;
	text-decoration: underline;
}

#branding a:active {
	color: #ff3300;
	text-decoration: underline;
}

/**************************/
/*****//* !Content *//*****/
/**************************/

/* Struktur */

#galerie {
	text-align: right;
	float: left; display: inline;
	color: #4d3a28;
	
	margin-left: 5px;
	padding: 0 20px 30px 5px;
	
	border-right: 5px #4d3a28 solid;
	
	width: 390px; 
}

#friseur {
	text-align: left;
	float: right; display: inline;
	color: #6e6328;
	
	margin-right: 5px;
	padding: 0 5px 30px 20px;
	
	border-left: 5px #6e6328 solid;

	width: 390px; 
}

#galerie .navigation {
	text-align: left;
	
	margin: 0 -25px 0 0;

	min-height: 45px; height: auto !important; height: 45px;
	overflow: hidden;

	background: url(ecken/galerie.png) bottom right no-repeat;
	position: relative; z-index: 2;
}

#friseur .navigation {
	text-align: right;
	
	margin: 0 0 0 -25px ;

	min-height: 45px; height: auto !important; height: 45px;
	overflow: hidden;

	background: url(ecken/friseur.png) top left no-repeat;
	position: relative; z-index: 2;
}

#galerie.inaktiv, #friseur.inaktiv {
	/* nicht valide */
	-moz-opacity: 0.5;
	opacity: 0.5;
}

/* Typografie */

#content p a:before {
	content: "\203A\A0";
}

#content p #e-mail-adresse a:before {
	content: "";
}

#content .einleitung {
	font-weight: bold;
}

/* !Navigation */

#galerie .navigation h2,
#friseur .navigation h2 {
	font-size: 1em;
	text-transform: uppercase;
	padding: 0 0.2em;
}

#galerie .navigation h2 a {
	text-decoration: none;
	color: #4d3a28;
}

#galerie .navigation h2 a:link,
#galerie .navigation h2 a:visited {
	color: #4d3a28;
	text-decoration: none;
}

#friseur .navigation h2 a {
	text-decoration: none;
	color: #6e6328;
}

#friseur .navigation h2 a:link,
#friseur .navigation h2 a:visited {
	color: #6e6328;
	text-decoration: none;
}

#galerie .navigation h2 a:hover,
#galerie .navigation h2 a:focus,
#friseur .navigation h2 a:hover,
#friseur .navigation h2 a:focus {
	color: #cc3300;
	text-decoration: underline;
}

#galerie .navigation h2 a:active,
#friseur .navigation h2 a:active {
	color: #ff3300;
	text-decoration: underline;
}

#galerie .navigation h2 a:before,
#friseur .navigation h2 a:before {
	content: "";
}

/*****//* !Bloecke *//*****/

#content .block,
#content .cms_artikel {
	margin: 0 -20px 1.5em -20px;
	padding: 0 20px 0.7em 20px;
	
	border-bottom: 1px solid #4d3a26;
}

#content #galerie .block,
#content #galerie .cms_artikel {
	margin-left: 40px;
}

#content #friseur .block,
#content #friseur .cms_artikel {
	margin-right: 40px;
}

#content #galerie .block .cms_artikel,
#content #friseur .block .cms_artikel {
	border-bottom: none;
	margin: 0;
	padding: 0 0 0.7em 0;
}

#content .block.offen {
	border-bottom: none;
}

/* !Coverteaser */

#content #galerie .coverteaser {
	/* position: relative; z-index: 1; */
	margin-top: -20px;
}

#content #galerie .coverteaser img.teaser {
	margin-left: -60px;
}

#content #friseur .coverteaser {
	/* position: relative; z-index: 1; */
	margin-top: -20px;
}

#content #friseur .coverteaser img.teaser {
	margin-left: -20px;
}

/*****//* !Stšrer *//*****/

#content #galerie .stoerer,
#content #friseur .stoerer {
}

#content #galerie .block .stoerer,
#content #friseur .block .stoerer {
	margin: 0;
	padding: 0;
	border-bottom: none;
}

#content .stoerer h3 {
	color: white;
	letter-spacing: 0.1em;
	
	display: block;
	background-color: #4d3a28;
	margin-right: -20px; margin-left: -20px;
	padding: 0.2em 20px;
}

/* !Archiv */

#content .archiv h2 {
	font-size: 1.3em;
	line-height: 1.3em;
	text-transform: uppercase;
	margin-bottom: 0.8em;
}

#content .archiv h3 {
	font-size: 0.9em;
	text-transform: none;
	margin-bottom: 0.4em;
}

#content .archiv p em {
	font-weight: normal;
	font-size: 1em;
	line-height: 1.3em;
}


/*****************************/
/*****//* !Galerien *//*****/
/*****************************/

/* Bildformat: 372px, Rand: 19px */

/* Uebersicht */

#content .uebersicht {
	padding-top: 1.5em;
}

/* Slideshow */

#content .galerie {
	text-align: center;	
	margin: 0 0 1.5em 0;
	width: 370px;
	padding: 0 20px 0 20px;
}

#content .cms_artikel .galerie {
	padding-top: 1.5em;
}

#content #galerie .galerie {
	margin-left: -60px;
}

#content #friseur .galerie {
	margin-left: -20px;
}

#content .galerie a {
	text-decoration: none;
}

/* Bild */

#content .galerie #bild {
	/* background: #edebe9 url(schere.gif) center center no-repeat; */
	background-color: #edebe9;
	background-position: center;
	background-repeat: no-repeat;

	margin: 0 -20px 0 -20px;

	width: 410px; height: 410px;
	overflow: hidden;
}

#content .galerie #bild .bild {
	background-position: center;
	background-repeat: no-repeat;
	
	width: 410px; height: 410px;
	overflow: hidden;
}

/* Titel */

#content .galerie .titel {
	text-align: center;
	font-weight: normal;
	font-size: 0.8em;
	line-height: 2em;
	
	background-color: #edebe9;
	height: 2.5em; width: 410px; 
	overflow: hidden;
	
	margin: -12px -20px 1em -20px;
}

/* Navigation */

#content .galerie .navigation {
	min-height: 0; height: auto !important; height: auto;
	margin: 0;
	
	background-image: none;
	text-align: center;
}

#content .galerie .uebersicht,
#content .galerie .vor,
#content .galerie .zurueck {
	float: left; display: inline;
}

#content .galerie .uebersicht {
	width: 302px; overflow: hidden;
	padding-top: 0;
}

#content .galerie .uebersicht img {
	width: 24px; height: 16px;
	background: url(/media/icons/uebersicht.gif) center 0 no-repeat;
}

#content .galerie .zurueck img {
	width: 34px; height: 16px;
	background: url(/media/icons/zurueck.gif) center 0 no-repeat;
}

#content .galerie .vor img {
	width: 34px; height: 16px;
	background: url(/media/icons/vor.gif) center 0 no-repeat;
}

#content .galerie .navigation a:link img,
#content .galerie .navigation a:visited img {
	background-position: center -16px;
}

#content .galerie .navigation a:hover img,
#content .galerie .navigation a:focus img {
	background-position: center -32px;
}

#content .galerie .navigation a:active img {
	background-position: center -48px;
}

/* !Thumbnails */

#content .galerie .thumbnails {
	background-color: #edebe9;

	margin: 0 -20px 0em -20px;
	padding: 5px 15px 5px 15px;
}

#content .galerie .thumbnails div {
	background-color: white;
	background-position: center;
	background-repeat: no-repeat;

	margin: 5px;
	height: 66px; width: 66px;
}

#content #galerie .galerie .thumbnails div {
	float: right; display: inline;
}

#content #friseur .galerie .thumbnails div {
	float: left; display: inline;
}

#content #galerie .galerie .thumbnails div.clear,
#content #friseur .galerie .thumbnails div.clear {
	float: none; clear: both;
	margin: 0; height: 0; width: 0;
	display: block;
}

#content .galerie .thumbnails img {
	background: url(rahmen_thumbs.png) center center no-repeat;
	height: 66px; width: 66px;
}

/*************************/
/*****//* !Footer *//*****/
/*************************/

#footer {
	font-size: 0.7em;
	line-height: 1.4em;
	color: #999;
	
}

#footer a {
	color: #a69c93;
	text-decoration: none;
}

#footer a:link,
#footer a:visited {
	color: #a69c93;
}

#footer a:hover,
#footer a:focus {
	color: #cc3300;
	text-decoration: underline;
}

#footer a:active {
	color: #ff3300;
	text-decoration: underline;
}

#footer a:before {
	content: "\203A\A0";
}

#footer a#srzsd:before {
	content: "";
}