/*****************
browsers interpret margin and padding a little differently, 
we'll remove all default padding and margins and
set them later on
******************/
* {
margin:0;
padding:0;
}

/*
Set initial font styles
*/
body {
   text-align: left;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   font-size: 75.01%;
   line-height: 1.2em;
}

#intro{
	text-align: center;
}


#intro_wrapper{
	margin: 120px auto;
	background: #ccc url("/theme/welcome.png") top left no-repeat;
	height: 450px;
	width: 1040px;
    text-align: center;
}

#intro_logo{
	padding-top: 20px;
	text-align: center;
	height: 80px;
}

#intro_moods{
	text-align: center;
	margin:0 auto;
	padding: 0;
}

div#claim{
	width: 350px;
	height: 180px;
	background: url(offen.gif) top right no-repeat;
	position:absolute;
	z-index:1000001;
	top:-1px;
	right:-1px;
	margin:0
}

/*
set font size for all divs,
this overrides some body rules
*/
div {
   font-size: 1em;
}

/*
if img is inside "a" it would have 
borders, we don't want that
*/
img {
   border: 0;
}


#news img {
    border: 1px solid #ccc;
	padding: 0;
	margin: 0;
}

/*
default link styles
*/
/* set all links to have underline and bluish color */
a,
a:link 
a:active {
   text-decoration: underline;
/* css validation will give a warning if color is set without background color. this will explicitly tell this element to inherit bg colour from parent element */
   background-color: inherit; 
   color: #4d1e00; 
}

a:visited {
   text-decoration: underline;
   background-color: inherit;
  color: #4d1e00;                /* a different color can be used for visited links */
}


/* remove underline on hover and change color */
a:hover {
   text-decoration: none;
   color: #4d1e00;
}

/*****************
basic layout 
*****************/
body {
   background-color: #ccc;
   color: #333;
   margin:1em;    /* gives some air for the pagewrapper */
}

/* center wrapper, min max width */
div#pagewrapper {
   margin: 0 auto;       /* this centers wrapper */
   width: 908px;   /* IE wont understand these, so we will use javascript magick */
   background-color: #fff;
   color: black;
}


/*** header ***
we will hide text and replace it with a image
we need to assign a height for it so that the image wont cut off
*/

div#menu_vert{
	padding-top: 10px;
}


div.breadcrumbs {
   padding: 1em 0 1.2em 0; /* CSS short hand rule first value is top then right, bottom and left */
   font-size: 90%;        /* its good to set fontsizes to be relative, this way viewer can change his/her fontsize */
   margin: 0;        /* css shorthand rule will be opened to be "0 1em 0 1em" */
}

 div.breadcrumbs span.lastitem { 
   font-weight:bold; 
 } 

 div#content {
   margin: 1.5em auto 2em 0;   /* some air above and under menu and content */
}


div#main {
   margin: 0 10px 0 20px;
   width: 590px;
   float: left;
}


div#sidebar {
   float: left;        /* set sidebar on the left side. Change to right to float it right instead. */
   width: 280px;     /* sidebar width, if you change this please also change #main margins */
   display: inline;  /* FIX IE double margin bug */
   margin-left: 0;
}

div#footer {
   clear: both;       /* keep footer below content and menu */
   color: #ccc;
   background-color: #fff;
   height: 80px;   
}

div#footer p {
   padding: 1.5em;       /* some air for footer */
   text-align: center;  /* centered text */
   margin: 0;
}

div#footer p a {
   color: #fff; /* needed becouse footer link would be same color as background otherwise */
}

/* as we hid all hr for accessibility we create new hr with extra div element */
div.hr {
   height: 1px;
   padding: 1em 0;
   border-bottom: 1px solid #ccc;
}

/* relational links under content */
div.left49 {
  width: 49%; /* 50% for both left and right might lead to rounding error on some browser */
}

div.right49 {
  float: right;
  width: 49%;
  text-align: right;
}



/* ImageFlow */
#images{
	_position:relative; 
	>position:relative; 
	visibility: hidden;
}
#loading{
	margin-top:20px;
	text-align:center;
	width:50%;
	position:relative; 
}
#loading img{
	width: 160px;
	text-align:center;
	margin-top:20px;
}
#captions{
	padding-top: 10px;
	font-weight:bold;
	font-size: 1em;
	position:relative; 
	text-align:center;
	z-index:10000;
}
#scrollbar{
	visibility: hidden;
	position: relative; 
	background-color: transparent;
	background-image:url(scrollbar.png);
	background-repeat: repeat-x;
	height: 12px;
	z-index:10001;
	margin-top: 10px;
}
#slider{
	position:absolute;
	z-index:10002;
	background-image:url(slider.png);
	background-repeat:no-repeat;
	width:25px;
	height:12px;
}
#imageflow{
	width: 280px;
	text-align: left;
	margin-bottom: 10px;
}

#imageflow img { 
	position:absolute; 
	top:0px;
	border:none;
}



#flashcontent {
	height: 100%;
}


#sp {
	float: left;
}


td {
	padding:5px;
}

td img {
    border: 1px solid #ccc;
	padding: 0;
	margin: 0;
}