
body,
	html   {
	margin:0;
	padding:0;
	border:0;
	font-family: Arial, Tahoma, sans-serif;
	font-size: 1.0em;
	COLOR: #404040;
	background-color: rgb(230, 230, 230);
	}

h1, h2, h3 { font-family: Arial Narrow, sans-serif;
	COLOR: navy;
	font-weight: bold; }

h1 {
	font-size: 2.5em;
}

h2 {
	font-size: 1.95em;
}

h3 {
	font-size: 1.3em;
}

ul	{
	list-style-type: none;
	padding: 0;
	margin: 0;
	width: 325px;
	}

.clear-both { clear: both; }

.footerfont { font-size: 0.8em;
	COLOR: #909090;
	}

table { 
  width: 100%; 
  border-collapse: collapse; 
}

th { 
  background: #333; 
  color: white; 
  font-weight: bold; 
}
td, th { 
  padding: .4em; 
  border: 1px solid #ccc; 
  text-align: left; 
}

#bund {
	height: 13em;
	border-right-width: 0px;
	border-left-width: 0px;
	background-color: rgb(70, 70, 70);
}

#container, footer {
	background-COLOR: rgb(250, 250, 250);
	box-shadow: 0px 3px 10px #C0C0C0;
	width: 935px;
	padding:0;
	margin-right: auto;
	margin-left: auto;
}

#footer {
	width: 800 px;
	background-COLOR: rgb(70, 70, 70);
	margin-right: auto;
	margin-left: auto;
	border-top-width: 1px;
	border-right-width: 0px;
	border-left-width: 0px;
	border-bottom-width: 0px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-bottom-style: solid;
	border-top-color: rgb(47, 2, 59);
	border-right-color: rgb(47, 2, 59);
	border-left-color: rgb(47, 2, 59);
	border-bottom-color: rgb(47, 2, 59);
}

#footer1 {
	width: 800 px;
	padding-left: 5 px;
}

.teaser {
	padding:6;
	border:1px solid rgb(220, 220, 250);
	border-radius:10px;
	padding-left: 7px;
	padding-right: 7px;
	background-color: rgb(240, 240, 250);
}

.teaser2 {
	padding:6;
	border:1px solid rgb(220, 220, 250);
	border-radius:6px;
	padding-left: 7px;
	padding-right: 7px;
	background-color: rgb(246, 246, 250);
}

.foto {
	padding:0.7em;
	box-shadow: 0px 4px 7px #C0C0C0;
	border:1px solid rgb(230, 230, 230);
	padding-left: 0.7em;
	padding-right: 0.7em;
	background-color: rgb(245, 245, 245);
}

.box1 {
	padding:0.7em;
	box-shadow: 0px 4px 7px #C0C0C0;
	border:1px solid rgb(230, 230, 230);
	class="float_right"
	padding-left: 0.7em;
	padding-right: 0.7em;
	background-color: rgb(245, 245, 245);
}

.box2 {
	padding:0.4em;
	box-shadow: 0px 4px 7px #C0C0C0;
	border:1px solid rgb(230, 230, 230);
	class="float_left"
	padding-left: 0.5em;
	padding-right: 0.5em;
	background-color: rgb(245, 245, 245);
}

#slider1 {
	width: 18.2em; 
	}

.slider2 {
	position: relative; overflow: auto; }
    .slider2 li { list-style: none; }
        .slider2 ul li { float: left; }

A {
	COLOR: #5000FF;
	font-size: 1.0em;
	FONT-FAMILY: Arial, Lucida sans Unicode, Helvetica, sans-serif;
	TEXT-ALIGN: left;
	TEXT-DECORATION: none;
}

A:hover {
	COLOR: #303030;
	FONT-FAMILY: Arial, Lucida sans Unicode, Helvetica, sans-serif;
	TEXT-ALIGN: left;
	TEXT-DECORATION: underline;
}

A.head {
	COLOR: #c0c0f0;
	font-size: 1em;
	FONT-FAMILY: Lucida sans Unicode, Arial, Helvetica, sans-serif;
	TEXT-ALIGN: left;
	TEXT-DECORATION: none;
}

A.head:hover {
	COLOR: #f0f0f0;
	FONT-FAMILY: Lucida sans Unicode, Arial, Helvetica, sans-serif;
	TEXT-ALIGN: left;
	TEXT-DECORATION: underline;
}

A.note {
	COLOR: #606060;
	font-size: 0.9em;
	FONT-FAMILY: Lucida sans Unicode, Arial, Helvetica, sans-serif;
	TEXT-ALIGN: left;
	TEXT-DECORATION: none;
}

A.note:hover {
	COLOR: #404040;
	FONT-FAMILY: Lucida sans Unicode, Arial, Helvetica, sans-serif;
	TEXT-ALIGN: left;
	TEXT-DECORATION: underline;
}

#left-column {
	width: 705px;
	padding-left: 0.8em;
	padding-right: 0.4em;
	float: left;
	background-color: rgb(250, 250, 250);
}
#right-column {
	width: 188px;
	padding-left: 0.4em;
	padding-right: 0.8em;
	float: right;
	background-color: rgb(250, 250, 250);
}

.float_left {
	float: left;
	margin-right: 0.5em;
	margin-bottom: 1em;
	margin-left: 0.0em;
}

.float_right {
	float: right;
	margin-right: 0.0em;
	margin-bottom: 1em;
	margin-left: 0.5em;
}

@media screen and (max-width: 930px) {
#container, footer {
	width: 100%;
}

#left-column {
	width: 70%;
	padding: 4;
	float: left;
	background-color: rgb(245, 245, 245);
}
#right-column {
	width: 26%;
	padding: 4;
	float: left;
	background-color: rgb(245, 245, 245);
}
img.banner	{
	width: 100%;
}

.storylogo {
	width: 80%;
}

h1 {
	font-size: 35px;
	COLOR: navy;
	font-weight: bold;
}

h2 {
	font-size: 28px;
	COLOR: navy;
	font-weight: bold;
}

h3 {
	font-size: 18px;
	COLOR: navy;
	font-weight: bold;
}

}

@media screen and (max-width: 800px) {

	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: 1px solid #ccc; }

	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
	}

	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
	/*
	Label the data
	*/
	td:nth-of-type(1):before { content: "First name:"; font-weight:bold; }
	td:nth-of-type(2):before { content: "Last name:"; font-weight:bold; }
	td:nth-of-type(3):before { content: "City:"; font-weight:bold; }
	td:nth-of-type(4):before { content: "Country:"; font-weight:bold; }
	td:nth-of-type(5):before { content: "Birthday:"; font-weight:bold; }
	td:nth-of-type(6):before { content: "Joined support:"; font-weight:bold; }
	
table td.first { display: none; }

}

@media screen and (max-width: 550px) {
#left-column {
	width: 98%;
	background-color: rgb(245, 245, 245);
}
#right-column {
	width: 98%;
	background-color: rgb(245, 245, 245);
}

.storylogo {
	width: 80%;
}

}


