/* =stylesheet for rechtsanwalt-koeper.de
================================================ */
html {margin: 0; padding: 0;}
* {margin: 0; padding: 0;}
body {font-size: 62.5%; font-family: "Helvetica Neue", Arial, serif; color: #222; text-align: center; background: #fff; margin: 0; padding: 0; height: 100%;}
img {border: none;}
a {color: #69c;}
em {font-family: Georgia, "Times New Roman", serif; font-style: italic;}
b {color: #000;}
p {font-size: 1.2em; line-height: 1.6;}
p.indent {margin-left: 80px;}

/* =header
================================================ */
#header-wrap {background: #fff;}
#header {position: relative; height: 60px; width: 960px; margin: 0 auto;}
#header h1 a {position: absolute; top: 17px; left: 0; width: 536px; height: 26px; background: url(/images/logo.png) no-repeat; text-indent: -9999px; text-decoration: none; border: none;}

/* =nav
================================================ */
#nav {background: #333; border-top: 1px solid #999; border-bottom: 1px solid #111;}
#nav ul {width: 960px; margin: 0 auto; overflow: auto;}

#nav li {float: left; list-style-type: none;}
#nav li a {float: left; display: block; font-size: 1.2em; font-weight: bold; color: #ddd; text-transform: uppercase; text-decoration: none; letter-spacing: .1em; text-shadow: 1px 1px 1px #000; padding: 7px 30px; border-left: 1px solid #111; border-right: 1px solid #555;}
#nav li a:hover, 
#nav li#current {background: #000;}

/* =banner
================================================ */
#banner-wrap {width: 100%; background: #9cf url(/images/banner-glows.jpg) 50% 0 no-repeat; border-top: 1px solid #cae4fe; border-bottom: 1px solid #2e3d4d;}
#banner {width: 960px; text-align: left; padding: 20px 0; margin: 0 auto; overflow: hidden;}
#banner h2 {font: normal 2.4em Georgia, "Times New Roman", serif; color: #000; line-height: 1.6; text-shadow: 1px 1px 1px #fff;}

#video {float: right; margin-right: 90px; border: 1px solid #cae4fe;}

/* =intro
================================================ */
#intro {float: left; width: 400px;}
#intro h2 {font-size: 1.8em; color: #000; line-height: 1.6; text-shadow: 1px 1px 1px #fff; padding-bottom: .6em;}
#intro img {float: left; width: 90px; height: 125px; border: 1px solid #cae4fe; margin: 0 20px 0 0;}
#intro p {font-size: 1.2em;}

/* =content
================================================ */
#content-wrap {width: 100%;}
#content {position: relative; width: 960px; text-align: left; background: url(/images/shade.png) 50% 0 no-repeat; padding: 30px 0 40px 0; margin: 0 auto; overflow: hidden;}
#content h2 {font-size: 1.2em; font-weight: bold; color: #333; text-transform: uppercase; letter-spacing: .1em; text-shadow: 1px 1px 1px #fff; background: url(/images/underline.png) 0 bottom repeat-x; padding-bottom: .6em; margin-bottom: 1.2em;}
#content h3 {font: normal 1.8em Georgia, "Times New Roman", serif; line-height: 1.6; color: #000; margin-bottom: .6em;}
#content h3 a {color: #000; text-decoration: none;}

#main {float: left; width: 600px;}
#side {float: right; width: 300px;}

/* =subnav
================================================ */
.subnav {width: 300px; list-style-type: none;}
.subnav li {background: url(/images/underline.png) 0 bottom repeat-x; padding: 2px 0;}
.subnav li a {display: block; font-size: 1.2em; line-height: 1.6; color: #333; text-decoration: none; background: url(/images/arrow-off.png) 2px .9em no-repeat; padding: .5em 0 .5em 16px;}
.subnav li a:hover {color: #369; background-color: #fff;}
.subnav li a.selected {font-weight: bold; color: #000; background-color: inherit; background-image: url(/images/arrow-on.png); cursor: default;}

/* =date
================================================ */
.date {float: left; width: 60px; height: 80px; text-align: center; background: url(/images/calendar.png) no-repeat; margin: .3em 20px 0 0;}
.date .month {font-size: 1.2em; font-weight: bold; line-height: 26px; color: #fff; letter-spacing: .2em; text-transform: uppercase; text-shadow: 1px 1px 1px #000;}
.date .day {font: bold 3em Georgia, "Times New Roman", serif; line-height: 38px; color: #000;}
.date .year {font-size: 1em; color: #333; line-height: 16px;}

/* =button
================================================ */
a.button {display: block; float: left; height: 20px; width: 100px; font-size: 1em; line-height: 20px; font-weight: normal; color: #fff; text-decoration: none; text-transform: uppercase; text-align: center; letter-spacing: .1em; text-shadow: 1px 1px 1px #000; background: url(/images/button.png); padding: 0; margin: 10px 0;}
a.button:hover {text-decoration: none; background-position: 0 -20px; outline: none;}
input[type="submit"]::-moz-focus-inner{padding:0; border:none;} /* center text vertically in FF */

/* =accordion
================================================ */
.accordion {margin-bottom: 2em;}
.accordion dt {font-size: 1.2em; line-height: 1.6; cursor: pointer; background-position: right 50%; background-repeat: no-repeat; padding: .3em 0; border-bottom: 1px dotted #bbb;}
.accordion dt:hover {color: #369; background-color: #fff;}
.accordion dt.off {background-image: url(/images/plus.gif);}
.accordion dt.on {background-image: url(/images/minus.gif);}
.accordion dd {font-size: 1.2em; line-height: 1.6; padding: 0 0 1em 20px; border-bottom: 1px dotted #bbb; overflow: hidden;}
.accordion dd ul {float: left; width: 270px; list-style-position: outside; padding-right: 20px;}
.accordion dd p {font-size: inherit;}

/* =rates
================================================ */
#rates {font-size: 1.2em; line-height: 1.6; border-collapse: collapse;}
#rates th, #rates td {padding: 3px 30px 3px 3px;}
#rates th {border-bottom: 1px solid #333;}
#rates td {border-bottom: 1px dotted #ccc;}

/* =form
================================================ */
form {margin: 15px 0;}
form p {padding: .5em 0;}
form label {float: left; width: 7em;}
form input[type="text"],
form textarea {font: 1.2em/1.6 "Helvetica Neue", Arial, sans-serif; background: #fff; margin-right: 5px; border: 1px solid #dcdcdc; border-top: 1px solid #999;}
form input[type="text"] {width: 250px;}
form textarea {width: 550px; overflow: hidden; /* hide scrollbar in IE6 */}
form em {color: #c00;}

/* =footer
================================================ */
#footer {width: 960px; background: url(/images/underline.png) top repeat-x; padding: 20px 0 100px 0; margin: 0 auto;}
#footer p {float: left;}
#footer ul {float: right; list-style-type: none;}
#footer li {float: left; margin-left: 30px;}

/* =other
================================================ */
#map-canvas {width: 280px; height: 180px; border: 1px solid #dcdcdc; margin-top: 0px;}
.clear {clear: both;}

/* =image
================================================ */
.left {float: left; /* background: url(/images/shade-small.png) bottom center no-repeat; padding: 2px; border: 1px solid #ccc; */ margin: .3em 20px 10px 0;}

.image {float: left; background: url(/images/frame.png) right bottom no-repeat; padding: 5px 10px 10px 5px; margin: 0 10px 10px 0;}