/****************************************************

	SITE: Birgit.Sander.de

	Pink: #a20061

	25.07.2012
	grass@mai-multimedia.de 2012

******************************************************/

@import url(http://fonts.googleapis.com/css?family=Abel);

* {margin: 0; padding: 0;}

html, body { height: 100%; }

body
	{
		font-family: Arial,Helvetica,sans-serif;
		font-size: 75%;
		line-height: 1.4;
		background: #f2f2f2;
		background-image: url(/media/default/key_steine_hgr.jpg);
		background-repeat: repeat-x;
		background-position: top center;
		text-align: center;
		color: #454545;
		padding-bottom: 1px;
	}
body.noscroll
{
    position: fixed;
    overflow-y: scroll;
    width: 100%;
}
h1, h2, h3, h4, h5, li li, li p, td p, td, blockquote p {font-size: 1em}

/****************************************************
	ALLGEMEINE STYLES
******************************************************/

.clear { clear: both; }
.invisible { display: none; }

img { border: none; }
.imgLeft { float: left;  clear: left; margin: 2px 10px 10px 0;}
.imgRight { float: right; margin: 4px 0 10px 10px; }

.imgRight img, .imgLeft img { float: none; }


span.lupe {
	display: block;
	width: 19px;
	height: 19px;
	position: absolute;
	bottom: 5px;
	left: 3px;
	background: transparent url(../images/lupe.png);
}
a.imgLeft span.lupe {
	bottom: 14px;
	left: 6px;
}
a.imgRight span.lupe {
	bottom: 14px;
	left: 16px;
}

a
	{
		color: #D50575;
	}
a:hover
	{
		text-decoration: none;
	}

a.download { padding-left: 25px ; }
a.pdf { background: transparent url(/images/media_pdf.gif) no-repeat; }
a.ppt { background: transparent url(/images/media_ppt.gif) no-repeat; }
a.txt { background: transparent url(/images/media_txt.gif) no-repeat; }
a.doc { background: transparent url(/images/media_doc.gif) no-repeat; }
a.xls { background: transparent url(/images/media_xls.gif) no-repeat; }
a.zip { background: transparent url(/images/media_zip.gif) no-repeat; }
a.swf {	background: transparent url(/images/media_swf.gif) no-repeat; }
a.mov {	background: transparent url(/images/media_mov.gif) no-repeat; }
a.mp3 {	background: transparent url(/images/media_mp3.gif) no-repeat; }

.mediaImage img { display: none; }

a.more
	{
		padding-left: 10px;
		background: transparent url(/images/link_arrow.gif) no-repeat 0 4px;
	}
a.zoomImageLink { padding: 0 5px; }
a.zoomImageLink image
	{

	}

.moreLink,
.prevNext,
.button
{
	display: block;
	padding: 5px;
	background: #DBDBDB;
	display: inline-block;
	text-decoration: none;
}
.moreLink:hover,
a.prevNext:hover,
.button
{
	background: #DBDBDB;
}
span.prevNext {
	background: #dbdbdb;
	color: #a0a0a0;
}

h1, h2, h3, h4, h5
	{
		line-height: 1.2em;
	}
h1,	 h1 textarea {
	font-size: 1.5em;
	font-weight: normal;
	margin-bottom: 1em;
	text-transform: uppercase;
	color: #D50575;
}

h1 span,
h1 .span_Edit
{
	display: block;
}
h1.textarea {
	margin-bottom: 0;
}

h2, h3, h2 a {
	color: #D50575;
	font-weight: normal;
	margin-bottom: 1em;
}
h2 {
	font-size: 1.2em;
}
h3 {
	font-size: 1.1em;
	margin-bottom: 0;
}


p { margin: 0 0 1em 0;}

ul
	{
    	margin: 1em 0 1em 1.4em;
	}
ol
	{
    	margin-left: 2.4em;
		list-style-position: outside;
	}

hr
	{
		border: 0px; /* Fr Firefox und Opera */
		border-top: solid 1px #FF0000;
		border-bottom: transparent;
	}

table
	{
		margin-bottom: 2em;
    }

td { padding: 0.1em 0.5em 0.1em 0;}

table.border
	{
		border-collapse: collapse;
		border: solid 1px #ccc;
	}

td { vertical-align: top;}
.imgTable.left
	{
		float: left;
		margin: 2px 10px 10px 0;
	}
.imgTable.right
	{
		float: right;
		margin: 2px 0 10px 10px;
	}
.imgTable .subLine
	{
		font-size: 0.9em;
		font-style: italic;
	}


/****************************************************
	LAYOUT
******************************************************/

#wrap
	{
		position: relative;
		text-align: left;
		margin: 0 auto;
		width: 980px;
		min-height: 100%;
		background: #71706F;
		overflow: hidden;
		-moz-box-shadow: 0 0 6px 6px rgba(0,0,0,0.2);
		-webkit-box-shadow: 0 0 6px 6px rgba(0,0,0,0.2);
		box-shadow: 0 0 6px 6px rgba(0,0,0,0.2);
	}
#contentWrap
	{
		position: relative;
		background: #fff url(../images/hgr_pink.png) repeat-y right;
	}
#headerBox
	{
		position: relative;
		z-index: 5;
		height: 257px;
		-moz-box-shadow: 0 0 3px 3px rgba(0,0,0,0.3);
		-webkit-box-shadow: 0 0 3px 3px rgba(0,0,0,0.3);
		box-shadow: 0 0 4px 2px rgba(0,0,0,0.2);
	}
#sloganBox
	{
		height: 257px;
	}
#logo
	{
		position: absolute;
		top: 0px;
		right: 0;
	}

#mainBodyBox
	{
		z-index: 4;
		position: relative;
		padding-bottom: 100px;
		overflow: auto;
	}
#contentLeft
	{
		float: left;
		padding: 50px 0 0 70px;
		width: 565px;
	}
#contentRight
	{
		position: absolute;
		top: 0;
		right: 0;
		padding: 50px 35px 0 0px;
		width: 230px;
		color: #fff;
		font-family: 'Abel', sans-serif;
		font-size: 18px;

	}

#footerBox
	{
		position: relative;
		padding: 20px 30px 30px 30px;
		overflow: auto;
		color: #fff;
		background: transparent url(../images/birgit-sander.png) no-repeat 70px 15px;
	}


#cBottom
	{
		position: absolute;
		z-index: 15;
		left: 0px;
		bottom: 0px;
		height: 25px;
 		font-size: 10px;
		width: 530px;
		padding: 4px 85px 0 70px;
	}
#cBottom span
	{
		display: inline-block;
		padding-left: 5px;
		margin-right: 5px;
		line-height: 1em;
		border-left: solid 1px #454545;
	}
#cBottom span.firstItem
	{
		padding-left: 0;
		border: none;
	}
#iconBox {
	position: absolute;
	top: 0;
	left: 600px;
	white-space: nowrap;
}
#mailIcon {
	margin-right: 10px;
}

/****************************************************
	Menu
******************************************************/

#mainNav {
	list-style: none;
	margin: 0;
	position: absolute;
	left: 0;
	bottom: 0;
 }
#mainNav a {
	text-decoration: none;
	color: #333;
}
#mainNav li {
	margin-right: 2px;

	white-space: nowrap!important;
}
#mainNav_2 a {
	width: 37px;
}

#mainNav li a {
	position: relative;
	z-index: 100;
	display: block;
	padding: 0 15px;
	line-height: 32px;
	text-align: center;
	background-color: #fff;
	font-size: 1.2em;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	filter: alpha(opacity=80);
	opacity: 0.8;
}
#mainNav li.sub a {
	padding-right: 20px;
}
#mainNav li.sub.active a
{
	border-bottom: solid #fff 4px;
	margin-top: -4px;
	top: 4px;
}
#mainNav li.active a
{
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}
#mainNav ul {
	background: #fff;
	width: 100%;
	padding: 15px 5px 20px 0;
		-moz-box-shadow: 0 3px 3px 2px rgba(0,0,0,0.1);
		-webkit-box-shadow: 0 3px 3px 2px rgba(0,0,0,0.1);
		box-shadow: 0 3px 3px 2px rgba(0,0,0,0.1);
}

#mainNav ul li {
	margin: 0px;
	border: none;
}
#mainNav li ul a {
	position: static;
	display: inline;
	line-height: 1.4em;
	background-color: transparent;
	color: #666;
	font-size: 1em;
}
#mainNav li.sub.active ul a
{
	border-bottom: none;
	margin-top: 0;
	top: 0;
}
#mainNav li ul a:hover,
#mainNav li ul li.active a:hover
{
	color: #333;

}
#mainNav li ul li.active a,
#mainNav li ul li.active li.active a,
#mainNav li ul a.active {
	color: #000;
}
#mainNav li ul li.active li a {
	color: #666;
}

#mainNav li.active.sub ul {
	top: 36px!important;
	display: block!important;
	visibility: visible!important;
}
#mainNav li.active.sub ul li ul {
	top: -999em!important;
	display: none!important;
	visibility: hidden!important;
}
#mainNav li.active.sub ul li.active.sub ul {
	top: -15px!important;
	display: block!important;
	visibility: visible!important;
}


#mainNav ul ul {
	margin-left: 14px;
	background: #FBECF2;
}
#mainNav ul ul a {
	color: #E3609E!important;
}
#mainNav ul ul a.active,
#mainNav ul ul a:hover {
	color: #D20D75!important;
}

#mainNav .menuArrow {
	position: absolute;
	right: -13px;
	top: 3px;
	display: block;
	width: 8px;
	height: 14px;
	background: transparent url(../images/menu_arrow.png);
}

/****************************************************
	Menu Superfish
******************************************************/

/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			100%; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0px;
	top:			36px; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			0px; /* match ul width */
	top:			-15px;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			5em; /* match ul width */
	top:			0;
}


/****************************************************
	Menu Footer
******************************************************/

#goTop {
	position: absolute;
	left: 30px;
	bottom: 10px;
	text-decoration: none;
	font-size: 0.9em;
	color: #a0a0a0;
	padding-left: 20px;
	background: transparent url(../images/gotop.png) no-repeat 0 50%;
}
#goTop:hover {
	text-decoration: underline;
}

#serviceNav {
	float: left;
	list-style: none;
	margin: 40px 0 0 40px;
	font-size: 0.9em;
}
#serviceNav li {
	padding-left:5px;
	margin-bottom: 5px;
	border-left: solid 1px #fff;
	line-height: 1em;
}

#footerNav  {
	float: right;
	list-style: none;
	margin: 0;
	font-size: 0.9em;
	white-space: nowrap;
}
#footerNav a, #serviceNav a {
	color: #fff;
	font-weight: normal;
	text-transform: uppercase;
	text-decoration: none;
}
#footerNav a:hover, #serviceNav a:hover {
	text-decoration: underline;
}
#footerNav li {
	float: left;
	padding: 0 10px;

	border-left: dotted 1px #9A9A9A;
}
#footerNav ul  {
	list-style: none;
	margin: 2em 0 0 0;
}
#footerNav ul li {
	float: none;
	padding: 0;
	border: 0;
}
#footerNav ul a {
	text-transform: none;
}
#footerNav ul ul {
	margin: 0 0 0 10px;
}
#footerNav ul ul a {
	color: #C6C7C8;
}

/****************************************************
	CONTENT (Mitte)
******************************************************/

#contentLeft {

}
#contentLeft ul {
	list-style-image: url(../images/dot.png);
	margin: 0 0 1em 1.2em;
}
#contentLeft li {
	padding: 0.5em 0;
}


/****************************************************
	MEDIAGALERIE
******************************************************/
#mediaGalerie
	{
		float: left;
	}
#mediaGalerie ul
	{
		list-style: none;
		margin: 0;
	}
#mediaGalerie li
	{
		display: inline-Block;
		vertical-align: top;
		padding: 5px;
	}
#mediaGalerie li.firstItem
	{
		margin-left: 0px;
		clear: left;
	}
#mediaGalerie li .imageBox
	{
		padding-bottom: 5px;
	}
#mediaGalerie li h4
	{
		font-weight: normal;
		color: inherit;
		font-size: 0.9em;
		line-height: 1.2em;
	}


/*************************
	CONTEXT
**************************/

#addressBox {
	color: #666666;
	margin-bottom: 2em;
	line-height: 1.2em;
}
#addressBox span,
#addressBox a
{
	color: #333;
}

#addressBox p {
	margin: 0;
}

/**/
.docList {
	list-style: none;
	margin: 1em 0;
}
.docList li {
	padding-bottom: 1em;
}
.docList h3 {
	position: relative;
	margin-bottom: 0.5em;
}
.docList .moreLink {
	display: inline-block;
	margin-top: 10px;
}

/* Sitenavigation */
#siteNav
	{
		clear: both;

        position: relative;
		margin: 2em 0 1em 0;
	}
#siteNav .prev
	{
		margin-right: 20px;
	}
#siteNav .next
	{
		margin-left: 20px;
	}


/*************************
	FORMULARE
**************************/

form
	{
		margin: 0;
		padding: 0;
	}

fieldset {
	border: 0;
}
legend {
	display: none;
}

input, textarea, select
	{
		width: 400px;
		font-family: Arial,Helvetica,sans-serif;
		font-size: 1em;
		padding: 2px;
		border: solid 1px #CCCECE;
		background-color: #FBFAFA;
	}
.fbError
	{
		color: #cc0000;
	}
.fbError input, .fbError textarea
	{
		border: solid 2px #cc0000;
	}
.formField
	{
		clear: both;
		padding: 2px 0;
	}
.formField label
	{
		width: 150px;
		float: left;

	}
.button
	{
		border: none;
		cursor: pointer;
		margin: 10px 0 0 150px;
		width: auto;
	}
.button.no-margin
	{
		margin: 0;
	}

.radio
	{
		width: auto;
	}

.radioSet
	{
		display: inline;
		padding-right: 1em;
	}
.radioLabel
	{
		position: relative;
		top: -2px;
		padding: 0 0.5em;
	}
.radioSet.fbError
	{
		border: none;
	}
.check, .checkbox
	{
		float: left;
		clear: both;
		width: auto;
	}
.formField label.checkboxLabel, .formField label.radioLabel
	{
		position: relative;
		top: 0;
		float: none;
		padding-left: 0.5em;
		width: 100%;
	}
.formHint
	{
		clear: both;
		padding: 1em 0;
		font-size: 0.8em;
	}
.formField h4	{ padding: 1em 0;}

#formField_message {
	padding-bottom: 20px;
}
#formField_message label {
	display: none;
}
#formField_message textarea {
	width: 370px;
}


/* Datum Picker */

a.dp-choose-date {
	float: left;
	width: 20px;
	height: 14px;
	padding: 0;
	margin: 2px 3px 0;
	display: block;
	text-indent: -2000px;
	overflow: hidden;
	background: url(/images/calenderImg.gif) no-repeat;
}
a.dp-choose-date.dp-disabled {
	background-position: 0 -20px;
	cursor: default;
}
input.dp-applied {
	width: 140px!important;
	float: left;
}

#searchBoxForm
	{
		margin-left: 10px;
    }
#searchBoxForm input, #searchBoxForm input.searchField
	{
		width: auto!important;
    }


.alertBox h4
	{
		font-size: 1.2em;
	}
.alertBox
	{
		color: #cc0000;
		padding: 0 0 20px 50px;
		background: transparent url(/images/alertSign.gif) no-repeat left top;
		margin-top: 20px;
	}
.alertBox ul
	{
		color: #cc0000
	}
/* Pretty Photo PopUp */
div.pp_details {
	background: #dbdbdb;
	margin-top: 0;
	padding-top: 5px;
}
a.pp_close {
	top: 8px!important;
}


