@charset "utf-8";
/* CSS Document /* 

########################################################################################################
########################################################################################################

Einteilung des CSS-Aufbaus

0. Import CSS
1. Standards
2. Layout
3. Navigation
4. Content
5. Links 

########################################################################################################
######################################################################################################*/

/* 0. Import CSS */

	@import url("lightbox.css");
 @import url("cms.css");
 @import url("clearfix.css");
/* ########################################################################################################
######################################################################################################*/   

/* 1. Standards */

html, body, p, h1, h2, h3, h4, h5, h6, ul, ol, span, a, table, td, form, img, li, form, object, textarea {
	margin: 0px;
	padding: 0px;
	text-decoration: none;
	list-style-type: none;
	color: #545658;
	vertical-align:baseline;
	font: 13px/18px "Verdana, Arial, Helvetica", sans-serif;
}
body {
	background: #FFF url(../images/layout/bg.jpg) repeat-x top center;
	min-height: 101%;
}
html {
	font-size: 100%;
	overflow: -moz-scrollbars-vertical;
}
h1 {
	color: #2e81a4;
	font-style:italic;
	font: 14px/20px Georgia, "Times New Roman", Times, serif;
	padding-bottom:20px;
}
h2 {
	color: #2e81a4;
	font-weight:lighter;
	font: 18px/22px Georgia, "Times New Roman", Times, serif;
}
h3 {
	color: #2e81a4;
	font-weight:lighter;
	font: 18px/22px;
}
h4 {
		color: #2e81a4;
	font-style:italic;
	font: 14px/20px Georgia, "Times New Roman", Times, serif;
}
p {
	margin: 0 0 20px 0px;
}
.hideme {
	display: none;
}
img, img a {
	border: none;
}
/*######################################################################################################
######################################################################################################*/

/* 2. Layout */

#clear, .clear {
	clear:left;
	float:none;
}
#container {
	width: 955px;
	position:relative;
	margin: 0 auto;
	text-align: left;
}
/*---------------------------------*/

#head {
	background:url(../images/layout/header.jpg) no-repeat;
	width:953px;
	height:509px;
	position:relative;
	clear: both;
}
a#team {
	position:absolute;
	text-indent:-9999px;
	width: 170px;
	height: 48px;
	left: 41px;
	top: 41px;
}
a#team:hover {
	background:url(../images/layout/team_hover.jpg) no-repeat;
}
a#angebote {
	position:absolute;
	text-indent:-9999px;
	width: 131px;
	height: 132px;
	left: 492px;
	top: 357px;
}
a#angebote:hover {
	background:url(../images/layout/angebote_hover.jpg) no-repeat;
}
a#neuigkeiten {
	position:absolute;
	text-indent:-9999px;
	width: 162px;
	height: 10px;
	left: 636px;
	top: 470px;
}
a#neuigkeiten:hover {
	background:url(../images/layout/neuigkeiten_hover.jpg) no-repeat;
}
a#anfahrt {
	position:absolute;
	text-indent:-9999px;
	width: 69px;
	height: 10px;
	left: 798px;
	top: 381px;
}
a#anfahrt:hover {
	background:url(../images/layout/anfahrt_hover.jpg) no-repeat;
}
a#kontakt {
	position:absolute;
	text-indent:-9999px;
	width: 88px;
	height: 17px;
	left: 778px;
	top: 400px;
}
a#kontakt:hover {
	background:url(../images/layout/kontakt_hover.jpg) no-repeat;
}
a#startseite {
	position:absolute;
	text-indent:-9999px;
	width: 121px;
	height: 21px;
	left: 759px;
	top: 68px;
}
a#startseite:hover {
	background:url(../images/layout/startseite_hover.jpg) no-repeat;
}
a#logo {
	position:absolute;
	text-indent:-9999px;
	width: 286px;
	height: 100px;
	left: 398px;
	top: 39px;
}
#content {
	width:654px;
	float:left;
	
}
#contentindex {
	width:280px;
	padding-right:52px;
	float:left;
	
}
#contentcomic { width:652px; margin-right:-40px; float:left;}
#right {
	width:281px;
	height:360px;
	float:left;
	position:relative;
}
.col-left {
	float:left;
}
.col-right {
	float:left;
}
#newsticker {
	background:#fff;
	width:281px;
	height:181px;
	min-height:181px;
}
div#newsticker a{
	position:absolute;
	height:18px;
	width:188px;
	left: 94px;
	top: 159px;
	text-indent:-9999px;
	background:url(../images/layout/newsticker.jpg) no-repeat 3px 0;
}
div#newsticker a:hover {
	background:url(../images/layout/newsticker_hover.jpg) no-repeat 3px 0;
}
ul#comic2 {
	background:url(../images/layout/comic.jpg) no-repeat;
	width:281px;
	height:179px;
	padding-top:16px;
}
ul#comic2 li a {
	text-indent:-9999px;
	display:block;
}
ul#comic2 li a#aktuelles2 {
	height:82px;
}
ul#comic2 li a#aktuelles2:hover {
	background:url(../images/layout/comic_hover.jpg) no-repeat;
}
ul#comic2 li a#comic3 {
	height:70px;
}
ul#comic2 li a#comic3:hover {
	background:url(../images/layout/comic_hover.jpg) 0 -82px no-repeat;
}
/*---------------------------------*/

#footer {
	background:url(../images/layout/footer.jpg) 79px 0 no-repeat;
	width:874px;
	height:113px;
	padding: 0 38px 0 41px;
	position:relative;
}
ul#mouleoptik {
	padding:52px 0 0 45px;
	float:left;
}
ul#oeffnungszeiten {
	padding:52px 0 0 131px;
	float:left;
}
ul#telefon {
	padding:30px 0 0 180px;
	float:left;
	width:150px;
}

span#badge {
background:url(../images/shoplink.png) no-repeat;
display:block;
width:197px;
height:121px;
position:absolute;
z-index:100;
top:106px;
left:709px;
text-indent:-10000px;
}
span#badge a {
display:block;
width:197px;
height:121px;
}

/*######################################################################################################
######################################################################################################*/


/* 3. Navigation */

ul#navi {
	background:url(../images/layout/navi.jpg) 41px 0 no-repeat;
	width:212px;
	height:433px;
	position:relative;
	padding:0 48px 0 41px;
	float:left;
}
ul#navi li a {
	position:relative;
	text-indent:-9999px;
	display:block;
}
ul#navi li a#brillenmode {
	height:71px;
}
ul#navi li a#brillenmode:hover {
	background:url(../images/layout/navi_hover.jpg) no-repeat;
}
ul#navi li a#sonnenbrillen {
	height:37px;
}
ul#navi li a#sonnenbrillen:hover {
	background:url(../images/layout/navi_hover.jpg) 0 -71px no-repeat;
}
ul#navi li a#brillenglaeser {
	height:37px;
}
ul#navi li a#brillenglaeser:hover {
	background:url(../images/layout/navi_hover.jpg) 0 -108px no-repeat;
}
ul#navi li a#lupen {
	height:36px;
}
ul#navi li a#lupen:hover {
	background:url(../images/layout/navi_hover.jpg) 0 -145px no-repeat;
}
ul#navi li a#kontanktlinsen {
	height:35px;
}
ul#navi li a#kontanktlinsen:hover {
	background:url(../images/layout/navi_hover.jpg) 0 -181px no-repeat;
}
ul#navi li a#auge {
	height:36px;
}
ul#navi li a#auge:hover {
	background:url(../images/layout/navi_hover.jpg) 0 -216px no-repeat;
}
ul#navi li a#optik {
	height:38px;
}
ul#navi li a#optik:hover {
	background:url(../images/layout/navi_hover.jpg) 0 -252px no-repeat;
}
ul#navi li a#team2 {
	height:35px;
}
ul#navi li a#team2:hover {
	background:url(../images/layout/navi_hover.jpg) 0 -290px no-repeat;
}
ul#navi li a#comic {
	height:35px;
}
ul#navi li a#comic:hover {
	background:url(../images/layout/navi_hover.jpg) 0 -325px no-repeat;
}
/*----------------- PNG-Filter/Position Hacks fuer IE6 -------------------*/



/*------------------------------- Subnavi  -------------------------------*/

ul#subnavi {
}
ul#subnavi li {
	float: left;
}
ul#subnavi a {
}
ul#subnavi a:hover {
}
/*######################################################################################################
######################################################################################################*/

/* 4. Content */

.picture {
	border: 1px solid #666;
	padding: 2px;
	background:#FFF url(../images/layout/progress.gif) no-repeat center center;
	margin: 0px 15px 10px 0;
	cursor: url(../images/layout/zoomin.cur), pointer;
	outline: none;
}
.picture:hover, a:hover img.picture {
	border: 2px solid #2E81A4;
	padding: 1px;
}
.picturenohover {
	border: 1px solid #666;
	padding: 2px;
	background:#FFF url(../images/layout/progress.gif) no-repeat center center;
	margin: 4px 4px 0 0;
}
/*---------------------------------*/

.floatleft {
	float: left;
}
.marginright10px {
	margin: 0 10px 0 0;
}
.floatright {
	float: right;
}
/*---------------------------------*/

ul.liste {
	margin: 0 0 20px 0;
	padding: 0;
	list-style: none;
}
ul.liste li {
	padding: 5px 0 5px 25px;
	border-bottom: dashed 1px #ccc;
	margin: 0 10px 0 0;
	line-height: 18px;
	list-style:none;
	_height: 20px;
}
ul.liste li:hover {
	color:#333;
	background: #f7f8f8;
}
/*---------------------------------*/

.block60 {
	float:left;
	display:block;
	width: 60px;
}
.block130 {
	float:left;
	display:block;
	width: 130px;
}
/*######################################################################################################
######################################################################################################*/


/* 5. Links */

a:link, a:visited, a:active, a:focus, .escape span {
	text-decoration: underline;
	color: #2e81a4;
	outline: none;/*	white-space:nowrap;*/
}
a:hover, a:hover span {
	text-decoration:none;
	color:#545658;
}

#contentright { width:280px; float:left;margin-right:40px;}
#contentleft {	 width:280px; float:left; padding-right:52px; }

* html #contentright {width:280px; float:left; padding:0; margin:0;}


.tenner { border-bottom: dashed 1px #ccc}
/*---------------------------------*/



/*######################################################################################################
######################################################################################################*/