/* Screen CSS for Leifels													 */
/* ------------------------------------------------------------------------- */
/* Autor: 	Verena Biewald													 */
/* Firma: 	art&motion GmbH & Co. KG										 */
/* Datum:	08.04.2009														 */
/* Email:	biewald (at) art-motion.de										 */
/* Web:		www.art-motion.de												 */
/* ------------------------------------------------------------------------- */

/* Allgemein
------------------------------------------------------------------------- */

*
{
	margin: 0;
	padding: 0;
	outline: 0;
}

body
{
	background-color: #000;
	text-align: center;
	font-family: Arial, sans-serif;
	font-size: 12px;
	color: #fff;
}
a, a:hover
{
	color: #e2001a;
}
/* Layout
------------------------------------------------------------------------- */

#layout
{
	width: 960px;
	height: 890px;
	margin: 2% auto 4% auto;
	background: #000;
}

#logo
{
	width: 960px;
	height: 69px;
	background-image: url('../grafik/logo.jpg');
	background-repeat: no-repeat;
}

#navi
{
	width: 960px;
	height: 24px;
	background-image: url('../grafik/navi_bg.jpg');
	background-repeat: no-repeat;
	margin-top: 0.5em;
}

#warenkorb_anzeige
{
	position: relative;
	top: 1em;
	right: 2em;
	clear: both;
	width: 960px;
	text-align: right;
}

#warenkorb_anzeige a
{
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

#warenkorb_anzeige a:hover
{
	color: #e2001a;
}

#suche
{
	position: relative;
	top: -0.6em;
	float: right;
	width: 260px;
}

#suche input
{
	height: 1.2em;
	background-color: #fff;
	color: #000;
	margin: 0;
	border: none;
}

#suche a
{
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	top: -1px;
}

#suche a:hover
{
	color: #e2001a;
}

#content
{
	clear: both;
	width: 1000px;
	min-height: 760px;
	background-image: url('../grafik/startseite_bg.jpg');
	background-repeat: no-repeat;
	background-position: bottom center;
}

#content2
{
	clear: both;
	width: 1000px;
	min-height: 760px;
	background-image: url('../grafik/content_bg01.jpg');
	background-repeat: no-repeat;
	background-position: bottom center;
}

#start
{
	width: 710px;
	height: 680px;
	text-align: left;
	line-height: 1.5em;
	padding: 5.5em 3em 0em 3em;
	overflow: hidden;
}

#start h1
{
	font-size: 12px;
}

#text
{
	position: relative;
	width: 410px;
	height: 735px;
	text-align: left;
	line-height: 1.5em;
	padding: 2em 1.2em 0em 1.2em;
	overflow: auto;
	background-image: url('../grafik/content_bg.png');
}

#shop
{
	width: 930px;
	min-height: 735px;
	text-align: left;
	line-height: 1.5em;
	padding: 2em 1.2em 2em 1.2em;
	overflow: auto;
	background-image: url('../grafik/content_bg.png');
}

#foot
{
	width: 960px;
	height: 44px;
	border-top: 1px solid #fff;
}

/* Navigation
------------------------------------------------------------------------- */

#nav, #nav ul 
{
	padding: 0.4em 1em;
	margin: 0;
	list-style: none;
	line-height: 1;
	text-align: left;
	z-index: 999;
}

#nav a 
{
	display: block;
	font-weight: bold;
	text-decoration: none;
	color: #fff;
	z-index: 999;
}

#nav a:hover 
{
	display: block;
	font-weight: bold;
	text-decoration: none;
	color: #e2001a;
	z-index: 999;
}

#nav li 
{
	float: left;
	display: inline;
	margin-right: 2em;
	z-index: 999;
}

#nav li ul 
{
	position: absolute;
	width: 200px;
	left: -999em;
	padding: 0.7em 0 0 0;
	margin-left: -1em;
	z-index: 999;
}

#nav li ul li
{
	background-color: #515151;
	width: 10em;
	height: 1em;
	margin: 0em;
	padding: 0.2em 1.2em;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	border-right: 4px solid #000;
	z-index: 999;
}

#nav li ul li:hover
{
	background-color: #e2001a;
	z-index: 999;
}

#nav li ul li a:hover
{
	color: #fff;
	z-index: 999;
}

#nav li ul ul 
{
	position: relative;
	top: -2.1em;
	margin: 0 0 0 11.4em;
	z-index: 999;
}

#nav li ul ul li
{
	height: 1em;
}

#nav li:hover ul ul, 
#nav li.sfhover ul ul 
{
	left: -999em;
	z-index: 999;
}

#nav li:hover ul, 
#nav li li:hover ul, 
#nav li.sfhover ul, 
#nav li li.sfhover ul 
{
	left: auto;
	z-index: 999;
}

#copyright
{
	text-align: left;
	padding: 1em 1em;
}

#footnav
{
	text-align: right;
	padding: 1em 1em;
	list-style: none;
}

#footnav li
{
	display: inline;
	padding: 0em 1em;
	border-right: 1px solid #fff;
}

#footnav a
{
	text-decoration: none;
	color: #fff;
}

#footnav a:hover
{
	text-decoration: none;
	color: #e2001a;
}

/* Typographie
------------------------------------------------------------------------- */

#text h1,
#text h2,
#text h3,
#text h4,
#text h5,
#text h6,
#startseite h1,
#startseite h2,
#startseite h3,
#startseite h4,
#startseite h5,
#startseite h6,
#shop h1,
#shop h2,
#shop h3,
#shop h4,
#shop h5,
#shop h6
{
	font-size: 1.1em;
	font-weight: bold;
}

#text a,
#startseite a,
#shop a
{
	text-decoration: underline;
	color: #e2001a;
}

#shop img
{
	vertical-align: middle;
}

/* Formular
------------------------------------------------------------------------- */

#druckserviceform label
{
	float: left;
	width: 120px !important;
	margin: 4px 0px;
}

#druckserviceform input,
#druckserviceform select
{
	padding: 1px;
	margin: 4px 0px;
	background-color: #000;
	color: #fff;
	border: 1px solid #515151;
}

#druckserviceform textarea
{
	width: 250px;
	height: 200px;
	margin: 4px 0px;
}

#text label
{
	float: left;
	width: 200px;
}

#text input
{
	padding: 1px;
}

input,
select,
textarea
{
	background-color: #000;
	color: #fff;
	border: 1px solid #515151;
}

/* Listen
------------------------------------------------------------------------- */

#text ul
{
	margin-left: 1.4em;
}

#text ul li
{
	list-style-image: url('../grafik/pfeil.gif');
}

/* Tinymce / Editor
------------------------------------------------------------------------- */

#tinymce
{
	background-image: none !important;
	background-color: #fff !important;
	text-align: left !important;
	font-size: 12px !important;
	font-family: Arial,Helvetica,Verdana,sans-serif !important;
	color: #222 !important;
}

.mceContentBody
{
	background-image: none !important;
	background-color: #fff !important;
	text-align: left !important;
	font-size: 12px !important;
	font-family: Arial,Helvetica,Verdana,sans-serif !important;
	color: #222 !important;
}

/* Klassen
------------------------------------------------------------------------- */

.button
{
	background-color: #515151 !important;
	color: #fff !important;
	padding: 0.3em 0.6em !important;
	font-weight: bold !important;
	font-family: Arial !important;
	text-decoration: none !important;
	cursor: pointer !important;
}

.button:hover
{
	color: #e2001a !important;
}

.linkbutton,
.linkbutton a
{
	background-color: #515151 !important;
	color: #fff !important;
	padding: 0.3em 0.6em;
	font-weight: bold;
	text-decoration: none !important;
}

.linkbutton a:hover,
.linkbutton:hover
{
	color: #e2001a !important;
}

.fleft
{
	float: left;
}

.fright
{
	float: right;
}

.clearboth
{
	clear: both;
}

.red
{
	font-weight: bold;
	color: #E2001A;
}

/* Scrollbar
------------------------------------------------------------------------- */

#scrollbar_container 
{  
    position: relative;  
	padding-right:20px;
} 
 
#scrollbar_track 
{  
    position: absolute;  
    top: 0;  
    right: 0;  
    height: 100%;  
    width: 10px !important;  
    background-color: transparent;  
    cursor: move;  
} 
 
#scrollbar_handle 
{  
    width: 10px !important;  
    background-color: #515151;  
    cursor: move;  
    -moz-border-radius: 3px;  
    -webkit-border-radius: 3px;  
} 
 
#scrollbar_content 
{  
    overflow: hidden;  
    width: 390px !important;
    height: 710px;
}

/* Slideshow
------------------------------------------------------------------------- */

#sliderFrame { 
	overflow: hidden;
	position: relative;
	height: 520px;
	width: 680px;
}

ul#slider {
	width: 5000px;
	padding: 0px;
	margin: 0px;
	list-style: none;
	height: 520px;
	overflow: hidden;
	position: relative;
}

li.sliderItem {
	width: 680px;
	float: left;
}

#werbepartner
{
	margin-top: 2em;
}

#werbepartner img
{
	float: left;
	margin-right: 1.5em;
	vertical-align: middle;
}

.newslinks
{
	float: left;
	width: 315px;
	height: 520px;
	padding-top: -1em;
	padding-left: 3em;
	color:#000;
}

.newsrechts
{
	float: right;
	width: 325px;
	height: 520px;
	padding-top: 7em;
}

.highlightlinks
{
	float: left;
	width: 320px;
	height: 520px;
	padding-top: 10em;
	padding-left: 0.5em;
	background-image: url("../grafik/trennung.png");
	background-repeat: no-repeat;
	background-position: 289px 10px;
}

.highlightlinks img,
.highlightrechts img
{
	max-width: 250px;
}

.highlightrechts img
{
	vertical-align: middle;
}

.highlightrechts
{
	float: right;
	width: 340px;
	height: 520px;
}

.highlightlinks .text,
.highlightrechts .text
{
	color: #515151;
	margin: 0em 0em 12px 0em;
	padding-left: 2em;
	width: 280px;
}

.newslinks .text,
.newsrechts .text
{
	color: #515151;
	margin: 0em 0em 12px 0em;
	padding-left: 2em;
	width: 240px;
}

.newslinks h1,
.newsrechts h1,
.highlightlinks h1,
.highlightrechts h1
{
	color: #de2d16;
	font-size: 18px;
	font-weight: normal;
	margin: 0.5em 0em 1em 0em;
}

.highlightlinks div.preis,
.highlightrechts div.preis
{
	color: #de2d16;
	font-size: 18px;
	font-weight: normal;
	margin: 1em 0em 0em 0em;
}

.highlightlinks .button,
.highlightrechts .button
{
	background-color: #de2d16 !important;
	font-weight: normal !important;
	font-size: 16px !important;
	padding: 0.6em 0.7em !important;
	margin-left: 24px !important;
	width: auto !important;
}

.highlightlinks a.button:hover,
.highlightrechts a.button:hover
{
	color: #fff !important;
}

#paging {
	z-index: 500;
	position: absolute;
	top: 440px;
	left: 20px;
}

.Pages, .activePage { 
	width: 15px;
	height: 15px;
	margin-right: 0.3em;
	color: #fff;
	background-image: url("../grafik/punkt_schwarz.png");
	background-repeat: no-repeat;
	display: inline-block;
}

.activePage { 
	text-decoration:underline; 
	background-image: url("../grafik/punkt_rot.png");
	background-repeat: no-repeat;
}

.Pages:link, .Pages:visited { 
	cursor:pointer; 
	text-decoration:none; 
}

.Pages:hover, .Pages:active, .activePage:hover, .activePage:active { 
	background-image: url("../grafik/punkt_rot.png");
	background-repeat: no-repeat;
	text-decoration:underline; 
	color: #fff;
} 

#sliderStartStop
{
	display: none;
}

#text2
{
	position: relative;
	width: 500px;
	height: 735px;
	text-align: left;
	line-height: 1.5em;
	padding: 2em 1.2em 0em 1.2em;
	overflow: auto;
	background-image: url('../grafik/content_bg.png');
}

#scrollbar_container2
{  
    position: relative;  
} 

#scrollbar_content2
{  
    overflow: hidden;  
    width: 500px !important;
    height: 710px;
}
#start .text h1
{
	font-size:1.5em;
}