/*******************************************************************************

	Project		:	salon-iris.com

	Copyright	:	philipp hofstätter webdesign
					www.fietstouring.com

*******************************************************************************/




/*	
*******************************************************************************/

* { margin: 0; padding: 0; } 
a img { border: 0; }	
fieldset { border: none; }  

body {
	font: 80% Arial, Helvetica, Tahoma, Verdana, sans-serif;
	color: #656565;
	background: #F0F5F5 url(../images/body-bg.gif) repeat-x top left;
	text-align:center;
}

#base { 
	width: 854px; 
	background: #fff; 
	margin: 0 auto; 
	}

#top { 
	width: 854px; 
	height: 10px;
	font-size:0;
	line-height:0;
	-height:1px;
	>height:1px;
	padding:0;
	}

a { color: #027e98; }
a:hover { text-decoration: none; }
#content a { color: #027e98; }

/* =HEADER 
================================================ */

#header { width: 820px; height:35px; padding-top: 12px; margin:0 auto; -height: 45px; >height:45px; }

ul#topnav { float:right; list-style-type:none; margin:0;  }
ul#topnav li { float:left; margin-left: 1px; text-align:center; list-style-type:none;  }
ul#topnav a { float:left; background: #00A3C5; color: #fff; padding: 4px 8px 4px 8px; text-decoration:none;  font-size:11px; }
ul#topnav a:hover { background: #FFA826; color: #FFF } 
ul#topnav li.activelink a,ul#topnav li.activelink a:hover{background: #FFA826;}


/* =NAVIGATION 
================================================= */

#navigation { width:820px; margin: 0 auto; background-color: #DADADA; margin-top: 8px; text-align:left; }

ul#nav {  list-style:none; width:820px; background: #DADADA; margin: 0;  }
ul#nav li { 
	list-style-type:none; 
	float:left; 
	border-right: 1px solid #fff;
	background: #DADADA;
	margin:0; padding:0;
}
ul#nav li a { 
	float:left;
	color: #363636; 
	text-decoration:none; 
	font-size: 11px;
	font-weight: 700;
	padding: 5px 10px;
	
}

ul#nav li a:hover {  background: #FC8A0C url(../images/navi-bg.gif) no-repeat 0 50%; color: #FFF }
ul#nav li a.current { background: #FC8A0C url(../images/navi-bg.gif) no-repeat 0 50%; color: #FFF }


/* =MASTHEADS
================================================ */

div#masthead-start { 
	position:relative;
	width: 820px;
	height: 186px;
	overflow:hidden;
	margin: 0 auto;
}

div#masthead-start h1 {  text-indent: -9999em; }

a#start-link1 { display:block; position:absolute; top: 24px; left: 605px; width:200px; height: 35px; text-indent:-9999em;  }
a#start-link2 { display:block; position:absolute; top: 75px; left: 605px; width:200px; height: 35px; text-indent:-9999em;  }
a#start-link3 { display:block; position:absolute; top: 125px; left: 605px; width:200px; height: 35px; text-indent:-9999em;  }

dl#masthead-general, dl#masthead-systeme, dl#masthead-news, dl#masthead-tipps {
	width: 820px; height: 129px;
	text-indent: -9999em; overflow: hidden;
	position: relative;
	margin: 0 auto;
	background: url(../masthead-siegel-green.png) no-repeat top left;
}

dl#masthead-tipps { background: url(../masthead-siegel-blue.png) no-repeat top left; }
dl#masthead-systeme { background: url(../masthead-siegel-yellow.png) no-repeat top left; }
dl#masthead-news { background: url(../masthead-news.png) no-repeat top left; }


#container { width: 820px; margin: 0 auto;  margin-top: 45px; min-height: 250px; text-align:left; }


/* =TEXT STYLES
================================================ */

#content h1 { font-size: 22px; line-height: 120%; color: #000;  }
#content h2 { font-size: 18px; line-height: 120%; color: #000; margin-bottom: 15px; border-bottom: 1px solid #eee; }
#content h3 { font-size: 1.3em; line-height: 120%;  border-bottom: 1px solid #eee; margin-bottom: 15px; }
#content h4 { font-size: 105%; margin: .6em 0 .1em; }
#content h5 { font-size: 13px; margin: .5em 0 1.2em; background: #FAFAFA; padding: 6px; border: 1px solid #eeeeee;   }
#content h6 { font-size: 100%; margin: .5em 0 .1em; }

#content h3.news-header { margin-bottom:3px; }

#content h6.smaller { font-size: 94%; }
h4.special { font-size: 110%; margin: .5em 0 .1em; }


#sidebar h4 { margin-bottom: -3px!important; }


/* =CONTENT
================================================ */

#content-start { float: left; width:645px; margin:0 auto; margin-right: 10px; -width:635px; >width:635px; }

#leftarea { float: left; width: 175px; padding: 15px 10px 20px 0; }
#content { float: left; width: 445px; margin: 0; line-height: 1.5em; padding-right:15px; }
#rightarea { float: left; width: 165px;  }

#rightarea .start { width: 155px; }

/* Absätze Content und Rightbar */

#content p { margin: 5px 0 12px 0; }
#rightarea p { margin: 5px 0 12px 0; font-size: 11px; line-height: 1.4em; }

/* Bilder Content */

img.float-right, img.float-left { float: right; display: inline; margin: 2px 0 8px 10px; padding: 8px; background: #FFF; border: 1px solid #EEE; }
img.float-left { float: left;  margin: 5px 10px 8px 0; }

/* Content Listen */

#content ul { list-style:none; margin-bottom: 1em; }
#content ul li { 
	background: transparent url(../images/bul-grey.gif) no-repeat 0 .2em;
	padding-left: 19px; 
	line-height: 1.5; 
	list-style:none; 
	margin:0; 
	margin-bottom: .6em; 
	border-bottom: 1px solid #f4f4f4; 
	padding-bottom: 0.5em;
	}

#content ol {  
	margin-left: 22px; 
	margin-bottom: 0.8em; 
	background: transparent url(../images/offer-dl-bg.png) repeat-y top right; 
	border-top: 1px solid #eee;
	border-right: 1px solid #eee;
	padding: 1em 0.2em 0.2em 0; 
	font-weight:bold; 
	}
#content ol li { list-style-position:outside; margin-bottom: 0.5em;  }

#content li.odd { background: #f4f4f4 url(../images/bul-grey.gif) no-repeat 0 .2em; }
#content li.even { background: transparent url(../images/bul-grey.gif) no-repeat 0 .2em; }


/* Artikelliste-News */

ul.article-list { list-style:none; }
#content ul.article-list li { background:transparent; margin-bottom: 10px; line-height: 1.3em; padding:0; border:none; }
div.news-date, span.articlelist-date { color: #9D9D9D; font-size: 0.95em;  }
#content ul.article-list h4 { margin:0 0 0.3em 0; line-height: 1; }
div.news-content { margin-top: 10px; }


/* News Blätterung */

div#news-pagination { 
	width:100%; 
	margin-top: 20px; 
	text-align:right; 
	background: #F3F3F3;  
	height: 22px;
	}

span.news-pag-left { float:left; padding: 0.1em 0 0 0.6em; font-size: 11px; }
span.news-pag-right, span.pag-pages { float:right; padding: 0.1em 0.6em 0 0; font-size: 11px; }

/* News-Liste Pagination */

span.pag-pages { font-size: 12px; }
span.pag-pages a, div#news-pagination strong { padding: 0;  text-decoration:none; }
span.pag-pages a.prev-page, span.pag-pages a.next-page { font-size: 14px; }


/* Downloads Rightbar */

ul.downloads-rightarea, ul.links-rightarea { 
	list-style:none; 
	background: transparent url(../images/downloads-bg.gif) no-repeat top left; 
	padding-top: 38px;
	margin: 1.5em 0 2em 0;
	}

ul.downloads-rightarea li a { font-size: 11px; } 

ul.links-rightarea { background: transparent url(../images/links-bg.gif) no-repeat top left; padding-top: 35px; }
ul.links-rightarea li { background: url(../images/bul-green.gif) no-repeat 0 0.1em; padding-left: 18px;  }
ul.links-rightarea li a { color: #2E9D2D; font-size: 11px; }

ul.downloads-rightarea li, ul.links-rightarea li { margin-bottom: 0.7em; clear:both;  }

#rightarea ul.downloads-rightarea li img { padding:0; border:none; float:left; display:inline; padding-right: 0.4em;  }

/* Preislisten-Tables */

table.preisliste { margin-bottom: 1em; width:100%; }

table.preisliste td { border-bottom: 2px solid #fff; color:#575757;  }

table.preisliste td { padding: 0.5em 0.4em 0.4em 0.4em; }
table.preisliste td strong { display:block; }
table.preisliste td.preis-value { white-space:nowrap; font-weight:bold; width: 20%;  }
table.preisliste td.preis-descr { padding-right: 0.5em; padding-left: 0.6em; border-right: 1px solid #fff;}

table.preisliste tr.odd { background-color: #F8F8F8; }
table.preisliste tr.even { background-color: #E8E8E8; }

/* =PRODUKT-TEASER 
================================================== */

dl.teaser, dl.teaser-start {
	background: transparent url(../images/offer-dl-bg.png) repeat-y top right; 
	border-top: 1px solid #eee;
	border-right: 1px solid #eee;
	padding: 10px 0.2em 8px 0;
	line-height: 1.5;
	}

dl.teaser-start { float:left; padding: 0.8em 0.5em 0.8em 0; font-size: 11px; line-height: 1.3; }

dl.teaser dd { margin: 0 0 2px 190px; line-height: 1.4; font-size: 1em; }
dl.teaser dt { margin: 0 0 2px 190px; line-height: 1.3em; }
dl.teaser dt a, dl.teaser-start dt a { font-weight:bold; font-size: 14px; text-decoration:none;  }
dl.teaser dt a:hover, dl.teaser-start dt a:hover { text-decoration:underline;  }
dl.teaser dt.teaser-image, dl.teaser-start dt.teaser-image { float:left; display:inline; margin:0; clear:both;  }
dl.teaser dt.teaser-image img, dl.teaser-start dt.teaser-image img { border: 1px solid #fff; }
div.teaser-text {  padding: 0.5em 0.2em 0.5em 0em;  }

#content div.teaser h3 { font-size: 14px; margin-bottom: 5px; border:none; line-height: 130%;  }

dl.teaser-start { width: 315px; min-height:120px; -width:310px; -height:125px; >height:130px; }

dl.teaser-start dd { margin: 0 0 0 132px; }
dl.teaser-start dt { margin: 0 0 0 132px; line-height:1.3em; }

div.partner { margin-top: 1.2em; font-size: 11px; font-weight:bold; }
#rightarea div.partner img { border:none; }


/* =RIGHTBAR STYLES
====================================================== */

/* Bilder Rightbar und Untertitel*/

#rightarea img.no-border { border:none; padding:0; margin: 0.3em 0 0 0; }

div.img-right { position:relative; margin-bottom: 0.5em;  }
#rightarea div.img-right img {  padding: 5px; border: 1px solid #eeeeee;  }
div.img-right .enlarge { position:absolute; left:142px; width: 19px; height:18px; }
#rightarea div.img-right .enlarge img { border:none; padding:0; }

#rightarea div.img-right p { font-size: 11px; margin:0;  line-height:1.2; padding:0; float:none; }
#rightarea a.imghover img:hover { border: 1px solid #027e98; }

/* Listen Rightbar */

#rightarea li { display:block; float:none; }

/* Produkt-Teaser */

#rightarea a.teaser-rightbar { 
	display:block; 
	text-decoration:none; 
	color:#656565; 
	font-size: 11px; 
	border-bottom: 1px solid #eeeeee;  
	padding-bottom: 1em; 
	line-height: 1.4;
	margin-bottom: 1em; 
	}

#rightarea a.teaser-rightbar strong { display:block; color: #027e98; font-size: 12px;  }
#rightarea a.teaser-rightbar span.highlight {  color: #027e98; }

#rightarea a.teaser-rightbar:hover { text-decoration:underline; }



/* =LEFTBAR SUBNAV 
====================================================== */

div#subnav { margin-top: 18px; }

#subnav ul.nav2nd, #subnav ul.nav3rd { list-style:none;  }

#subnav ul.nav2nd li { padding: 5px 0 4px 7px; }

#subnav ul.nav2nd li a { 
	padding-left: 18px;
	text-decoration:none;
	color: #20577f;
	font-size: 11px;
	font-family: Verdana, Geneva, Arial, sans-serif;
	background: #fff url(../images/bul-blue.gif) no-repeat 0 50%; 
}

#subnav ul.nav2nd li a:hover { text-decoration:underline; }
#subnav ul.nav2nd li a.current { font-weight:bold;  }

#subnav ul.nav3rd { margin-top: 3px; }
#subnav ul.nav3rd li { margin:0; padding: 2px 0 0 0; }

#subnav ul.nav3rd li a { text-transform:none; color: #027e98; letter-spacing: 0;  background: none;   }
#subnav ul.nav3rd li a:hover { text-decoration: underline; }

#subnav ul.nav3rd li a.current { text-decoration:underline; font-weight:normal;  }


/* =NEWSLETTER BOX
================================================= */

#newsletter {
    height:0;
	width:854px;
	font-size:11px;
	background-color: #9D9D9D;
	overflow:hidden;
	margin: 0 auto;
}


#newsletter p { padding: 1em 20px 0.8em 20px; color: #fff; font-weight:bold; float:left; position:relative; }

form#newsletter-box { float:right; padding: 0.7em 0; color:#fff; margin-right: 17px;  }
form#newsletter-box label { padding-right: 0.3em; }
form#newsletter-box input { margin-right: 0.4em; width: 125px; background-color: #FFF; color: #656565; border: 1px solid #363636; padding:2px; font-size: 11px;  }
form#newsletter-box input.logbtn { font-size: 95%; cursor: pointer; color: #656565; background: #F8F8F8; padding: .2em; margin: 0; width: auto; border: 1px outset #CCC; }

#newsletter span.newsl-abmelden { font-weight:normal; }
#newsletter span.newsl-abmelden a { color: #fff; }

/* = CONTACT FORM und PREISLISTE-FORM
================================================ */

form#contact-form h4, form#preisliste-form h4, form#newsletter-form h4, #gform h4 { color: #656565!important; font-size: 94%; margin: 0 0 .5em; }
form#preisliste-form h4 { float:left; width: 95px; }
form#contact-form div, form#preisliste-form div, form#newsletter-form div, .gform { background: url(../images/form-field-bg.gif) repeat-y; padding: 1em; margin-top: .7em; }
form#contact-form p, form#preisliste-form p, form#newsletter-form p { margin:0; padding:0;  }
form#contact-form input.checker, form#preisliste-form input.checker { width: 12px; margin: 0 4px 0 0; padding: 0; background-color: transparent; border:none;  }
form#contact-form input:hover.checker, form#preisliste-form input:hover.checker { background-color: transparent!important; }
form#contact-form input, form#preisliste-form input, form#newsletter-form input, #gform input { width: 200px; background-color: #FFF; color: #656565; border: 1px solid #CCC; padding: 3px; }
form#preisliste-form input.inpt-short { width: 45px; margin-right: 10px;  }
form#preisliste-form input.inpt-middle { width: 140px;  }
form#contact-form textarea { width: 290px; background-color: #FFF; color: #656565; font: 110% Arial, Helvetica, sans-serif; border: 1px solid #CCC; padding: 1px;  }
form#contact-form input:hover, form#contact-form input:focus, form#contact-form textarea:hover, form#contact-form textarea:focus, form#preisliste-form input:hover, form#preisliste-form input:focus, form#newsletter-form input:focus, form#newsletter-form input:hover  { background-color: #F8F8F8!important; }
form#contact-form .buttondiv, form#preisliste-form .buttondiv, form#newsletter-form .buttondiv { padding-bottom: 0.2em; }
form#contact-form table#choices { font-size: 90%; width: 400px; }
form#contact-form table#choices td { padding: 0 0 .6em; width: 35%; }
form.login#contact-form span a { font-size: 90%; color: #00a2bf; padding-left: 1em; }

form#contact-form h4.error, form#preisliste-form h4.error, form#newsletter-form h4.error, form#preisliste-form span.error, #gform .error { color: #ff0000!important; }

 p.no, div.no { display: none; margin:0; padding:0;  }

form#contact-form img.submit-orange, form#preisliste-form img.submit-orange, form#newsletter-form img.submit-orange { background: transparent url(../images/submit-orange.gif) no-repeat; width:89px; height: 26px; border:none; cursor:pointer;  }
form#contact-form img.submit-orange:hover, form#preisliste-form img.submit-orange:hover, form#newsletter-form img.submit-orange:hover  { background: transparent url(../images/submit-orange.gif) no-repeat 0 -26px; }

span.required { background: url(../../images/required.gif) no-repeat right center; padding-right: 10px; }
span.requiredStar { font-size: 125%; font-weight: bold; color: #C00; }


p.note { font-size: 90%; margin: .7em 0 0; }

select { background: #FAFAFA; border: 1px solid #CCC; padding: .1em; width: 150px; } 
select:hover { background: #FFF; border: 1px solid #BBB; } 

*:first-child+html #contact table td input { padding: 0 .25em; width: auto; overflow:visible; } /* IE7 ONLY */

form#preisliste-form label { float:left; width: 300px;  }
form#preisliste-form input.checker { float:left; width:18px; margin-top: 3px; }


/* =SITEMAP
============================================================= */

#content ul.sitemaplevel1 li, ul.sitemaplevel2 li  {  border-bottom:none; }
#content ul.sitemaplevel2 { margin: 8px 0 0 20px; font-size:0.9em;  }
#content ul.sitemaplevel2 li { margin-bottom: 0.1em; }

/* =FOOTER
============================================================= */

#base ul#footer  { 
	font-size: 88%; 
	width:820px; 
	margin:0 auto; 
	border-top: 1px solid #EEE; 
	margin: 2em 0 0 17px; 
	clear: both; 
	padding: .75em 0 3em; 
	text-align:left;
	
	}

#base ul#footer li { display: inline; list-style: none; color: #048a9c; margin: .5em 0; background-image: none; padding: 0; }
#base ul#footer li a { color: #048a9c; text-decoration: none; border-bottom: none; }
#base ul#footer li a:hover { text-decoration: underline; }
#base ul#footer li a strong  { color: #1ab4e2; font-weight: normal; }
#base ul#footer li.copy { display: block; list-style: none; color: #048a9c; }
#base ul#footer li.copy a { text-decoration: underline; }

#base ul#footer ul li a { color: #048a9c; text-decoration: none; border-bottom: none; }
#base ul#footer ul li a:hover { color: #048a9c; text-decoration: underline; border-bottom: none; background-color: #e5fcff; }

/* =LIVESEARCH 
========================================================== */

#livesearch { 
	margin: 0 0 10px 0;
	width:175px;
	padding: 0 0 0.8em 0;
	
}

#LSShadow { 
	padding: 0.4em 0.3em 0 0em; 
}

#LSShadow li.top { font-size: 11px;  }
#LSShadow li.top:hover {  background: none; }

#livesearch ul { 
	margin-top: 0.2em; 
	background-image:none;
	}

#livesearch input { 
	width: 145px; 
	background: #fff url(../images/search.gif) no-repeat right 1px;  
	border: 1px solid #B1B1B1;	
	height: 16px;
	-height: 20px;
	>height:20px;
	padding: 0.2em 0 0 0.1em;
	font-size: 11px;
	margin:0 auto;
	}

#livesearch li { 
	list-style:none;
	margin:0;
	padding:0;
	background-image:none;
	padding: 0.2em 0 0 0;
	font-size:11px; 
	border:none;
	}

#LSShadow li.result {  padding: 0.2em 0.1em 0.3em 0;  }
#LSShadow li.result:hover { background-color:  #fff; }

#LSShadow li.bottom { margin-top: 1em; font-weight:bold; }

#LSShadow li.suchbegriff { font-size: 11px; padding: 0.8em 0 0.8em 0; }

#livesearch input.searching { background: #fff url(../images/searching.gif) no-repeat right 2px; }


/* =STATISCHE SUCHE 
============================================================= */

#search-static a.search-name { font-size: 1.3em; }
#search-static p { margin-bottom: 1.3em; }


/* =SKIP NAV
================================================ */
ul#skipNav { position: absolute; left: -9999px; font-size: small; z-index: 200; height:0; }
ul#skipNav a:link, ul#skipNav a:visited { color: #F00; }
ul#skipNav a:focus { display: block; position: absolute; top: 20px; left: 10020px; font-size: large; background: #EEE; border: solid 2px #555; padding: 10px; width: 12em; z-index: 100; }
ul#skipNav a:hover { color: #390; background: #FFF; }


/* =EXTRAS (clears floats - do not edit or delete)
================================================ */
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


#container div.imageLink img { 
	margin-top: -5px;
	}


body dt.teaser-image img.teaser-img-border {
  border: 1px solid #eee;
  padding: 8px;
}