/**
 * @author Dominik Strauss
 * @copyright (c)2008 - 2009 n3or.de
 */

*
{
  padding:0;
  margin:0;
}

html, body
{
  background-color:#CCC;
  color:#000;

  border:0;
  padding:0.5% 0.3%;

  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:100%;
}

#container
{
  font-size:62.5%;
}

/*
    Header and Footer
*/
#header, #footer
{
  background-color:#003;
  color:#FFF;
  border-top:1px solid #FFF;
  border-bottom:1px solid #FFF;
  padding:0 3em;
  line-height:0;
}

#header .usergreeting
{
  float:right;
  line-height:2em;
  margin:1em 2em 0 0;
  font-size:1.1em;
}

#header .stripe
{
  margin:0 -0.4em;
  background-color:#336;
  color:#FFF;
}

#footer img
{
  margin:0 -0.4em;
}

#footer address
{
  line-height:2em;
  font-size:1.1em;
  font-style:normal;
}

#footer address.part1
{
  float:left;
  margin-left:2em;
}

#footer address.part2
{
  margin-left:15em;
}

#footer address.part3
{
  float:right;
  margin-right:20em;
  line-height:400%;
  vertical-align:middle;
}

#header a:link, #header a:visited, #footer a:link, #footer a:visited
{
  background-color:inherit;
  color:#FFF;
  text-decoration:underline;
}

#header a:hover, #header a:focus, #footer a:hover, #footer a:focus
{
  text-decoration:none;
}

/*
    Content
*/
#content
{
  background-color:#FFF;
  color:#000;
  font-size:1.2em;
  margin:0 2.2em;
  padding:0.8em 20.8em 2em 0.8em;
}

#content h1
{
  font-size:1.4em;
  margin:0.5em 0;
}

#content h2
{
  font-size:1.2em;
  margin:0.5em 0 0.3em;
}

#content h3
{
  font-size:1em;
  margin:0.5em 0 0.3em;
}

#content a:link, #content a:visited
{
  text-decoration:underline;
  background-color:inherit;
  color:#339;
}

#content a:hover, #content a:focus
{
  text-decoration:none;
  background-color:inherit;
  color:#003;
}

a:active
{
  position:relative;
  top:1px;
  left:1px;
}

/*
    Elements
*/
p
{
  margin:0.5em 0;
  line-height:auto;
}

input, input.text, input.text2, input.text4
{
  font-size:inherit;
  font-family:inherit;
  border:1px solid #336;
  padding:0 0.2em;
  margin-right:0.2em;
  margin-left:0.2em;
  background-color:inherit;
  color:#000;
  height:inherit;
  width:15em;
}

input.textshort
{
  font-size:inherit;
  font-family:inherit;
  border:1px solid #336;
  padding:0 0.2em;
  margin-right:0.2em;
  margin-left:0.2em;
  background-color:inherit;
  color:#000;
  height:inherit;
  width:5em;
}

input.textshort#precipitation
{
  background-color: #FFFFCC;
 }

input.text2
{
  width:2em;
}

input.text4
{
  width:3em;
}

input.checkbox
{
  border:0;
  padding:0;
  margin:0 0.5em;
  height:auto;
  width:auto;
}

input#accumulated
{
  width:8em;
}

input.submit
{
  padding:0.3em 1em;
  height:auto;
  width:auto;
  margin-top:1em;
  background-color:#FFFFCC;
}

textarea
{
  font-size:inherit;
  font-family:inherit;
  border:1px solid #336;
  padding:0.2em;
  background-color:inherit;
  color:#000;
}

label, .label
{
  display:block;
  font-weight:bold;
  margin:1.5em 0 0.5em;
}

label#precipitation
{
  display:block;
  font-weight:bold;
  margin:1.5em 0 0.5em;
  color:#000033;
}

label.noHeadline, .label.noHeadline
{
  display:inline;
  font-weight:normal;
  margin:0;
}

table
{
  width:100%;
  border-collapse:collapse;
  border:0;
  margin:1em 0;
}

table th
{
  text-align:left;
}

table th, table td
{
  padding:0.1em 0.5em;
  vertical-align:top;
}

table .zebra
{
  background-color:#DDD;
  color:#000;
}

th.numeric, td.numeric
{
  text-align:right;
  padding:0 4em 0 0;
}

/*
    Classes
*/
.clear { clear:both; }
.center { text-align:center; }
.left { text-align:left; }
.right { text-align:right; }
.floatLeft { float:left; }
.floatRight { float:right; }
.error { line-height:1.5em; background-color:inherit; color:#900; font-style:italic; text-align:center; margin-bottom:1em; }
.small { font-size:0.9em; }
.hint { margin:1em 0; background-color:inherit; color:#c00; }
.monospace { font-family:monospace; font-size:1.2em; }
.nowrap { white-space:nowrap; }
.precipitationtypes, .snowheight { padding-top:1em; }
.editheader { width:42.4em; }

/*
    Navigator
*/
.navigator { margin:2em 0; }
.navigator a { display:block; width:15em; margin:0 auto; }
.navigator .current { text-align:center; }
.navigator .before { float:left; text-align:left; }
.navigator .after { float:right; text-align:right; }

/*
    Login
*/
#login
{
  margin:0 auto;
  width:17em;
  border:1px solid #003;
  padding:1em;
  text-align:center;
}

#login label
{
  margin:1em 0 0;
}

#login p
{
  text-align:left;
  margin:0 auto;
  width:15.5em;
}

#login input
{
  margin:0.2em 0 1em;
}

/*
    Calendar Popup
*/
#calendarDiv, #calendarDiv *, #calendarDivAccumulated, #calendarDivAccumulated *
{
  padding:0;
  margin:0;
}

#calendarDiv, #calendarDivAccumulated
{
  position:absolute;
  visibility:hidden;
  background-color:#fff;
  color:#000;
  border:1px solid #000;
  padding:0.5em 0.3em;
}

#calendarDiv td.cpDayColumnHeader, #calendarDiv td.cpOtherMonthDate, #calendarDiv td.cpCurrentMonthDate, #calendarDivAccumulated td.cpDayColumnHeader, #calendarDivAccumulated td.cpOtherMonthDate, #calendarDivAccumulated td.cpCurrentMonthDate
{
  border-collapse:collapse;
  border:1px solid #333;
  text-align:center;
}

#calendarDiv td.cpDayColumnHeader a:link, #calendarDiv td.cpCurrentDate a:link, #calendarDiv td.cpOtherMonthDate a:link, #calendarDiv td.cpCurrentMonthDate a:link, #calendarDiv td.cpDayColumnHeader a:visited, #calendarDiv td.cpCurrentDate a:visited, #calendarDiv td.cpOtherMonthDate a:visited, #calendarDiv td.cpCurrentMonthDate a:visited, #calendarDivAccumulated td.cpDayColumnHeader a:link, #calendarDivAccumulated td.cpCurrentDate a:link, #calendarDivAccumulated td.cpOtherMonthDate a:link, #calendarDivAccumulated td.cpCurrentMonthDate a:link, #calendarDivAccumulated td.cpDayColumnHeader a:visited, #calendarDivAccumulated td.cpCurrentDate a:visited, #calendarDivAccumulated td.cpOtherMonthDate a:visited, #calendarDivAccumulated td.cpCurrentMonthDate a:visited
{
  text-decoration:none;
  display:block;
  padding:0.1em;
  background-color:#fff;
  color:#000;
}

#calendarDiv td.cpDayColumnHeader a:hover, #calendarDiv td.cpCurrentDate a:hover, #calendarDiv td.cpOtherMonthDate a:hover, #calendarDiv td.cpCurrentMonthDate a:hover, #calendarDivAccumulated td.cpDayColumnHeader a:hover, #calendarDivAccumulated td.cpCurrentDate a:hover, #calendarDivAccumulated td.cpOtherMonthDate a:hover, #calendarDivAccumulated td.cpCurrentMonthDate a:hover
{
  text-decoration:none;
  background-color:#ccc;
  color:#000;
}

#calendarDiv .cpMonthNavigation, #calendarDivAccumulated .cpMonthNavigation
{
  text-align:center;
  padding:0 0 0.5em
}

#calendarDiv td.cpCurrentDate, #calendarDiv .cpDayColumnHeader, #calendarDivAccumulated td.cpCurrentDate, #calendarDivAccumulated .cpDayColumnHeader
{
  font-weight:bold;
}

#calendarAnchor img, #calendarAnchorAccumulated img
{
  vertical-align:middle;
  border:0;
}

.precipitationtype li
{
  line-height:1.7em;
  height:1.7em;
  margin:0;
  padding:0;
  list-style-type:none;
  display:block;
}

.precipitationtype li *
{
  vertical-align:middle;
  margin:0 0.2em;
}