/* ------------------------------------------------------------------------- *\
	 _____ _____ _____ _____ __ __ _____    _____ _____ _____ 
	|  |  |  _  |  |  |  |  |  |  |  _  |  |     |   | |   __|
	|     |     |    -|  |  |_   _|     |  |  |  | | | |   __|
	|__|__|__|__|__|__|_____| |_| |__|__|  |_____|_|___|_____|

	css layout formatting for kompetenz-im-recht.de
	written by the left hand of mtness

	2012-07-02

*/
/* ------------------------------------------------------------------------- */ /* global */

* { margin: 0; padding: 0; } img, div { border: 0; }
html { overflow-y: scroll; }
body {
	height:100%;
	font-family: trebuchet MS, georgia, serif;
	font-size:12px;
	background: #fff;
	color: #333;
}
#passepartout {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	min-height: 100%;
	z-index: 1;
}
	#stage {
		position: relative;
		display: block;
		margin: 597px auto 190px auto; /* mind the header height! */
		border: 0;
		padding: 0;
		width: 1000px;
		height: 100%;
	}
	.content {
		background: #fff;
		padding: 0 0 30px 0;
	}
	.center
	{
		position: relative;
		width: 1000px;
		height: 100%;
		margin: 0 auto;
	}
#passepartout-bg {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}
	#stage-bg {
		position: relative;
		display: block;
		margin: 0 auto; /* mind the header height! */
		padding: 0;
		width: 1000px;
		height: 100%;
		background-color: #fff;
	}

footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 184px;
	border-top: 2px solid #C9C9C9;
	border-bottom: 4px solid #222;
	background-color: #000;
	line-height: 24px; 
	color: #707173;
}
	footer .center {}

		footer a { text-decoration: none; color: #707173; }
		footer a:hover { color: #fff; }

		footer .left  { position: relative; }

		footer .left h3 {
			position: absolute;
			top: 34px;
			left: 18px;
			width: 196px;
			height: 0;
			padding: 30px 0 0 0;
			background: 0 0 no-repeat url(../img/felix-spiegelberg-anwaltskanzlei-footer-logo.png);
			overflow: hidden;
			z-index: 2;
		}

		footer nav {
			position: absolute;
			top: 0;
			width: 1000px;
			background: #555;
		}

		footer .center .fl {
			float:left;
			display: block;
			font-size: 12px;
		}
		footer .center .fl1 { width: 200px; padding: 30px 20px 0 0; }
		footer .center .fl2 { width: 225px; padding: 30px 0 0 0; border-left: 0px solid #888; border-right: 0px solid #888; }
	
		footer .right .mask { position: absolute; top: -4px; height: 8px; background-color: #3E3D40; width: 270px; }
		footer .right ul { padding: 24px 0 0 30px; list-style: none; font: 12px/27px Georgia; }
		footer .right ul a { text-transform: uppercase; }

		#legal {
			position: absolute;
			bottom: 20px;
			width: 100%;
			text-align: center;
			color: #444;
		}
	
header {
	position: absolute;
	top: 0;
	width: 100%;
	height: 597px;
	background: 0 0 repeat-x url(../img/header-bg.png);
	z-index: 1;
}
	header .center {}

		header a { text-decoration: none; color: #000; }

		#logo {
			position: absolute;
			top: 0;
			left: -41px;
		}
		#logo h1 a {
			position: absolute;
			width: 260px;
			height: 0;
			padding: 156px 0 0 0;
			background: 0 0 no-repeat url(../img/felix-spiegelberg-anwaltskanzlei-logo.png);
			overflow: hidden;
			z-index: 4;
		}
		#hero {
			display: block;
			position: absolute;
			top: 211px;
			width: 1000px;
			height: 376px;
		}
		header .contact {
			display: block;
			position: absolute;
			top: 60px;
			left: 735px;
			font-family: Georgia;
			font-size: 14px;
			line-height: 20px;
		}
		header .contactform {
			display: block;
			position: absolute;
			top: 540px;
			right: 0px;
			width: 230px;
			padding: 20px;
			height: 20px;
			background: #5B0218 0 0 repeat-x url(../img/contactform-bg.png);
			border-bottom: 9px solid #000;
			overflow: hidden;
		}
		header nav {
			position: absolute;
			top: 151px;
			left: -35px;
			width: 1100px;
			/* background: #3E3D40; */
			font-family: Georgia;
		}
		nav ul { list-style: none; }
		nav li { display: inline; }
		
		nav * :focus { outline: 0; }
	#herobg-right {
		display: block;
		position: absolute;
		top: 211px;
		left: 50%;
		width: 50%;
		height: 376px;
		background-color: #C1C0BE;
		z-index: 0;
	}

/* ------------------------------------------------------------------------- */ /* main navigation: son of suckerfish dropdowns */

nav ul {
	float: left;
	list-style: none;
	padding: 0;
	border: 0;
	margin: 0 0 0 -16px;
}

nav li {
	float: left;
	padding: 0;
	position: relative;
	z-index: 2;
}
nav>ul>li {
	background: 0 0 no-repeat url(../img/nav-li.png);
}
nav>ul>li:first-child {
	background: none;
}

nav li span a {
	position: relative;
	display: block;
	color: #fff;
	text-decoration: none;
	padding: 0 14px;
	text-transform: uppercase;
	font-size: 12px;
	line-height: 60px;
	height: 64px;
	z-index: 3;
}

nav li ul {
	position: absolute;
	top: 60px;
	left: -999em;
	height: auto;
	width: 15em;
	font-weight: normal;
	border-width: 0;
	margin: 0 0 0 6px;
	padding: 8px 0 4px 0;
	background: #A4072E 0 0 repeat-x url(../img/nav-li-ul.png);
	z-index: 1;
	box-shadow: 0 0 10px #222;
	
	display: none !important;
}

nav li li {
	margin: 0;
	padding-right: 0em;
}

nav li ul a {
	position: relative;
	display: block;
	color: #fff;
	text-decoration: none;
	padding: 0 12px;
	font-size: 12px;
	width: 12em;
	height: 32px;
	line-height: 28px;
	z-index: 2;
}
nav li ul a:hover {
	color: #ea7981;
}

nav li ul ul {
	margin: -1.25em 0 0 7.5em;
}

nav li:hover ul ul, nav li:hover ul ul ul, nav li.sfhover ul ul, nav li.sfhover ul ul ul {
	left: -999em;
}

nav li:hover ul, nav li li:hover ul, nav li li li:hover ul, nav li.sfhover ul, nav li li.sfhover ul, nav li li li.sfhover ul {
	left: auto;
}
nav li ul.dev {
	left: auto;
}

nav li:hover span a, nav li.sfhover a {
	background: #880525 0 0 repeat-x url(../img/nav-li-span-a.png);
}
nav li.active span a {
	background: #f6f6f6;
	color: #333;
}

nav li.active + li,
nav li:hover +li { background: none; }



nav li a:hover, nav li.sfhover a {
	/* color: #0f0; */
}



/* ------------------------------------------------------------------------- */ /* equal height columns */

.container {
	position:relative; 
	display:block; 
	border-left:    270px solid #fff; 
	border-right:   270px solid #3E3D40; 
	overflow:visible;
	width: 460px;
}
.content {
	float: left;
	width:          460px;
	background:      #fff; 
}
.left {
	position:relative;
	float:left;
	display:inline;
	/* top: 0; */
	width:          270px;
	margin-left:   -730px;
}

.right {
	position:relative;
	float:right;
	display:inline;
	width:          270px;
	margin-right:  -270px;
}


.clear {
	clear:both;
	height:0;
	overflow:hidden;
}

/* ------------------------------------------------------------------------- */
footer .container {
	border-left-color:    #000; 
	border-right-color:   #000; 
}
footer .content  {
	background-color:     #000;
}
/* ------------------------------------------------------------------------- */

#stage .container {
	border-left:    240px solid #fff; 
	width: 490px;
}
#stage .container .content {
	width: 430px;
	margin-top: 35px;
	margin-bottom: 30px;
	padding: 0 30px 0 29px;
	border-left: 1px solid #ddd;
}

#stage .container .left {
	width:          270px;
	margin-left:   -790px;
	padding: 30px 0 30px 30px;
}

#stage .container .right {
	width:          210px;
	padding: 70px 30px 30px 30px;
	min-height: 450px;
	background: 0 10px repeat-x url(../img/right-bg.png);
	color: #C8C8C8;
}

/* ------------------------------------------------------------------------- */

#stage h1 { font-family: Georgia; font-size: 16px; font-weight: normal; color: #c6012f; padding: 0 0 8px 0; text-transform: uppercase; }
#stage h1 ,
#stage h2 ,
#stage h3 { font-family: Georgia; font-size: 14px; font-weight: normal; color: #c6012f; padding: 0 0 8px 0; text-transform: uppercase; }
#stage h4 { font-family: Georgia; font-size: 14px; font-weight: normal; color: #c6012f; padding: 0 0 8px 0; text-transform: uppercase; }
#stage h5 { font-family: Georgia; font-size: 13px; font-weight: normal; color: #c6012f; padding: 0 0 8px 0; }
#stage h6 { font-family: Georgia; font-size: 13px; font-weight: normal; color: #c6012f; padding: 0 0 0 0; }

/* #stage .content p:first-child { font-size: 20px; padding: 0 0 32px 0; } */
#stage .content p  { line-height: 1.5; padding: 0 0 12px 0; line-height: 1.7; }
#stage .content ul { line-height: 1.7; }
#stage .content em { font-style: normal; }

#stage .content table { margin: 0 0 32px 0; }

#stage .content td p  { font-size: 1em; padding: 0 0 0 0; }
#stage .content a { color: #3f3d40; text-decoration: none; }
#stage .content h1 a { color: #c5012f; }
#stage .content p a { color: #c5012f; text-decoration: none; border-bottom: 1px dotted #c5012f; }
#stage .content p a:hover { border-bottom: 1px solid #c5012f; }
#stage .content .csc-default>ul { margin: 0 0 8px 16px; list-style: none; }
#stage .content .csc-default>ul li { padding: 0 0 12px 12px; background: 0 6px no-repeat url(../img/ul-li.png); line-height: 1.5;}
#stage .content ol { margin: 0 0 16px 33px; line-height: 1.7; }

#stage .content .csc-default { margin: 0 0 32px 0; }


#stage .right h1 { font-family: Georgia; font-size: 15px; font-weight: normal; padding: 0 0 16px 0; color: #fff; text-transform: uppercase; }
#stage .right h2 ,
#stage .right h3 { font-family: Georgia; font-size: 14px; font-weight: normal; padding: 0 0 16px 0; color: #fff; text-transform: uppercase; }
#stage .right h4 { font-family: Georgia; font-size: 13px; font-weight: normal; padding: 0 0 8px 0; color: #fff; text-transform: uppercase; }
#stage .right h5, 
#stage .right h6 { font-size: 13px; font-weight: normal; padding: 0 0 8px 0; }

#stage .left div  { margin: 0 0 30px 0; }
#stage .left h3 { font-size: 13px;}
#stage .left p { margin: 0 0 12px 0; }

#stage .left ul { line-height: 32px; list-style: none; }
#stage .left a { color: #3f3d40; text-decoration: none; }
#stage .left ul a:hover { color: #c5012f; }

#stage .right ul {  list-style: none; font-family: Georgia; }
#stage .right li {  padding: 6px 0; }
#stage .right ul a { color: #C8C8C8; text-decoration: none; text-transform: uppercase; }
#stage .right ul a:hover { color: #fff; }

#stage .right ul ul {  font-family: Trebuchet MS; margin: 0 0 10px 0; }
#stage .right ul ul li {  padding: 2px 0; }
#stage .right ul ul a { text-transform: none; }

/* ------------------------------------------------------------------------- */ /* v9 contact form */

.contactform h1 a { font-family: Georgia; font-size: 15px; font-weight: normal; margin: -20px; padding: 20px 20px 36px 20px; color: #fff; text-transform: uppercase; cursor: pointer; }
.contactform:hover { background: #C1274D;  }

#u26 .contactform {
	display: none;
}

#c13 form {
	
}

#c13 form .form-group {
	margin-bottom: 10px;
}

#c13 form .form-group input,
#c13 form .form-group textarea {
	width: 92%;
	font-size: 1em;
	font: inherit;
	background: #fff;
	margin: .25em 0 .5em 0;
	border: 1px solid rgba(34,36,38,.15);
	padding: .75em .5em;
	color: rgba(0,0,0,.87);
	border-radius: 1px;
}
#c13 form .form-group textarea {
	min-height: 10em;
}

input:required,
textarea:required {
	box-shadow:none;
}
input:invalid,
textarea:invalid {
	box-shadow: 0 0 1px #A1072D;
	border: 0 !important;
}

#c13 form  button[type=submit] {
	margin-top: 8px;
	padding: 12px 64px;
	border-radius: 3px;
	background-color: #A1072D;
	color: #fff;
	text-decoration: none;
	font-family: "trajan-sans-pro",sans-serif;
	font-weight: 600;
	font-size: 11px;
	line-height: 1.6;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	border: 1px solid rgba(34,36,38,.15);
	cursor: pointer;
}
#c13 form  button[type=submit]:hover {
	background-color: #C1274D;

/* ------------------------------------------------------------------------- */ /* mobile bugfixes */

body,
#passepartout,
header,
footer
{
	min-width: 1060px;
}

/* ------------------------------------------------------------------------- */

#mtness{}