@import url('reset.css');

html, body {
height : 100%;
}
body {
color : #585858;
background : #174a77;
font-family : "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size : 12px;
line-height : 18px;
}

/* Typo */

h2 {
color : #444;
font-family : Georgia, "Times New Roman", Times, serif;
font-size : 32px;
line-height : 38px;
letter-spacing : -1px;
margin : 0 0 10px;
}
h3,
#sidebar ul.menu a {
color : #1f6a99;
font-family : Georgia, "Times New Roman", Times, serif;
font-size : 18px;
line-height : 24px;
margin : 0 0 10px;
}
h3 span,
#sidebar a span {
font-size : 14px;
font-style : italic;
}
p {
font-size : 12px;
line-height : 18px;
}
strong {
font-weight : bold;
}
em {
font-style : italic;
}
small {
font-size : 11px;
line-height : 15px;
}
a, a:link, a:visited, a:active {
color : #1f6a99;
}
a:hover {
text-decoration : underline;
}

/* Main Layout */

#wrapper_page {
background : #fff url(images/bg_main.jpg) repeat-x top center;
}
#wrapper_bottom {
background : #174a77 url(images/bg_footer.jpg) repeat-x top center;
}
#page {
background : url(images/bg_page.jpg) no-repeat top center;
width : 860px;
padding : 0 40px;
margin : 0 auto;
}

/* Header Layout */

#header {
background : url(images/bg_nav.jpg) no-repeat bottom center;
height : 230px;
}
#header #logo {
background : url(images/logo.jpg) no-repeat;
width : 300px;
height : 125px;
float : left;
text-indent : -10000px;
}
#header #contact-wrap {
width : 430px;
height : 25px;
padding : 65px 0 35px 130px;
float : left;
}
#header #contact {
background : url(images/bg_contact.jpg) no-repeat;
height : 25px;
overflow : hidden;
line-height : 1 !important;
}
#header #contact span {
width : 140px;
color : #fff;
font-size : 11px;
text-align : center;
font-style : italic;
padding : 7px 0 0;
display : inline-block;
}
#header #contact span a {
color : #fff;
}

/* Header Navigation */

ul#navigation {
width : 860px;
height : 50px;
}
ul#navigation li {
float : left;
}
ul#navigation li a {
height : 50px;
display : block;
text-indent : -10000px;
}
ul#navigation li#schule a {
background : url(images/nav_schule.jpg) no-repeat;
background-position : 0 0;
width : 140px;
}
ul#navigation li#fuehrerscheine a {
background : url(images/nav_fuehrerscheine.jpg) no-repeat;
background-position : 0 0;
width : 140px;
}
ul#navigation li#sportboote a {
background : url(images/nav_sportboote.jpg) no-repeat;
background-position : 0 0;
width : 150px;
}
ul#navigation li#specials a {
background : url(images/nav_specials.jpg) no-repeat;
background-position : 0 0;
width : 150px;
}
ul#navigation li#shop a {
background : url(images/nav_shop.jpg) no-repeat;
background-position : 0 0;
width : 140px;
}
ul#navigation li#kontakt a {
background : url(images/nav_kontakt.jpg) no-repeat;
background-position : 0 0;
width : 140px;
}
ul#navigation li#schule a:hover, ul#navigation li#fuehrerscheine a:hover, ul#navigation li#sportboote a:hover, ul#navigation li#specials a:hover, ul#navigation li#shop a:hover, ul#navigation li#kontakt a:hover {
background-position : 0 -50px;
}

/* Content Layout */

#content {
background : url(images/bg_content.jpg) no-repeat top center;
padding : 40px 10px 60px;
}
#content p {
margin : 0 0 10px;
}
#content .container {
margin : 0 0 20px;
}
#content ul.listed li {
padding : 6px 0;
display : block;
}
#content ul.listed li.divider {
background : url(images/divider_horizontal_2px.gif) repeat-x top;
}
#content ul.listed li ul {
list-style : disc;
}
#content ul.listed li ul li {
font-size : 12px;
line-height : 18px;
padding : 0;
margin : 0 0 0 16px;
list-style : disc;
display : list-item;
}
#content ul.listed li ul li strong {
color : #1f6a99;
}
#content ul.listed li ul li.ausgebucht {
list-style : circle;
color : #aaa;
}
#content ul.listed li ul li.ausgebucht strong,
#content ul.listed li.ausgebucht h3 {
color : #78b6dd;
}
#content ul.listed li ul {
list-style : disc;
}
#main ul.listed li {
margin : 0 0 6px;
}
#content ul.chart li {
background : url(images/divider_horizontal_2px.gif) repeat-x bottom;
padding-bottom : 10px;
}
#content ul.chart li:last-child {
background : transparent;
}
#content ul.chart li ul li {
background : transparent;
padding-bottom : 10px;
}
.column01 {
width : 50%;
padding : 0 20px 0 0;
float : left;
}
.column02 {
width : 45%;
float : left;
}
#sidebar {
width : 230px;
min-height : 420px;
height : auto !important; /* ie6 */
height : 420px;
padding : 0 20px;
float : left;
}
#sidebar ul.menu {
margin : 0 0 20px 0;
}
#sidebar ul.menu li a {
background : url(images/sidebar_li_bullet.gif) 0 5px no-repeat;
padding : 0 0 0 20px;
}
#sidebar ul.menu li a:hover {
background : url(images/sidebar_li_bullet_hover.gif) 0 5px no-repeat;
text-decoration : none;
}
#sidebar ul.menu li a.current {
background : url(images/sidebar_li_bullet_hover.gif) 0 5px no-repeat;
text-decoration : underline;
}
#main {
width : 530px;
padding : 0 20px;
float : left;
}
#main .frame{
height : 120px;
margin : 0 0 10px;
border : 1px solid #1f6a99;
overflow : hidden;
}
#main .frame img{
float : left;
}
.bgcol {
background : url(images/bg_col.jpg) no-repeat top right;
}

/* Footer Layout */

#footer {
width : 800px;
padding : 70px 80px 40px;
margin : 0 auto;
position : relative;
}
#footer h3 {
color : #fff;
margin : 0;
}
#footer p{
color : #c6e3ee;
margin : 0 0 10px;
}
#footer a{
color : #c6e3ee;
font-size : 12px;
}
#footer a:hover{
color : #fff;
}
#footer #boat{
background : url(images/footer_boat.jpg) no-repeat;
width : 240px;
height : 180px;
position : absolute;
top : -60px; left : -191px;
z-index : 100;
}
#copy {
float : left;
}
/* Footer Navigation */

ul#subnav {
padding : 24px 0 0 0;
float : right;
}
ul#subnav li {
color : #c6e3ee;
float : left;
padding : 0 2px;
}

/* Tooltip */

#tooltip {
background : #237daa;
padding : 6px;
position : absolute;
z-index : 1000;
opacity: 0.8;
border : 1px solid #c6e3ee;
/* CSS3 Goodness */
border-radius : 6px;
-moz-border-radius : 6px;
-webkit-border-radius : 6px;
}
#tooltip p {
color : #fff;
font-family : Georgia, "Times New Roman", Times, serif;
}

/* Contact Form */

#contactform {
width : 530px;
}
#contactform div {
margin : 10px 0;
clear : both;
}
#contactform input,
#contactform textarea {
color : #808080;
font-family : Georgia, "Times New Roman", Times, serif;
font-size : 18px;
background : #dfedf6;
padding : 5px;
border : 1px solid #1f6a99;
width : 518px;
}
#contactform input:focus,
#contactform textarea:focus {
background : #fff;
border : 1px solid #444;
color : #444;
}
#contactform input#submit {
color : #444;
width : 80px;
}