/*
	Name:		layout.css
	Zweck:		Custom Styles f�r Bergsport.ch
	Ersteller:	FM
	=================================================
	*/
	
	/*
	Generelle Elementdefinitionen (f�r Footer Layout)
	=================================================
	*/
	
	html, body { 
        height:100%; 
    } 
	
	body {
		background: #000 top left no-repeat;
		color:#fff;	
	} 
	
	body.theme1 { background-image: url(../images/bg-1.jpg) }
	body.theme2 { background-image: url(../images/bg-2.jpg) }
	body.theme3 { background-image: url(../images/bg-3.jpg) }
	body.theme4 { background-image: url(../images/bg-4.jpg) }
	
    div#mainContainer { 
        position:relative; 
        min-height:100%;
    } 
 
    * html div#mainContainer { 
        height:100%; 
    } 
     
    div#contentContainer { 
        padding-bottom:155px; /* Must have same value like the footer height */ 
    }
     
    div#footerContainer { 
        position:relative; 
		width:780px;
        height:155px;  
        margin:-155px 0 0 180px; /* Must have same value like the footer height */ 
    }

	/*
	Layout Elemente
	=================================================
	*/
    
	a#logo {
		display:block;
		z-index:50;
		position:absolute;
		top:15px;
		left:70px;
		background:url(../images/logo.png) no-repeat;
		width:188px;
		height:157px;
	}
	
	h1 {
		display:none;
	}
	
    div#header { 
		width: 100%;
		background:url(../images/header-bg-notrans.png) top left repeat-x; 
    } 
	
	div#headerFix {
		background:url(../images/header-bg.png) top left no-repeat; 
		height:90px;
	}
    
	/*
	Quicknavigation
	=================================================
	*/
	
	ul#quickNavigation {
		position: absolute;
		top: 4px;
		left: 840px;
		list-styl: none;
		font-size: 1.1em;
		color: #eee;
	}
	
	ul#quickNavigation a {
		color: #eee;
		margin: 0 10px;
		text-decoration: underline;
	}
	
	ul#quickNavigation a:hover {
		color: #999;
	}
	
	/*
	Hauptnavigation
	=================================================
	*/
	
	ul#navigation {
		margin-left:240px;
		width: 600px;
	}
	
	ul#navigation li a {
		height:90px;
		cursor: pointer;
	}
	
	ul#navigation li a span {
		display:none;
	} 
	
	ul#navigation li a#navShop {
		background-image:url(../images/nav-shop.png);
		width:60px;
	}
	
	ul#navigation li a#navMarken {
		background-image:url(../images/nav-marken.png);
		width:72px;
	}
	
	ul#navigation li a#navNeuigkeiten {
		background-image:url(../images/nav-neuigkeiten.png);
		width:97px;
	}
	
	ul#navigation li a#navTeam {
		background-image:url(../images/nav-team.png);
		width:72px;
	}
	
	ul#navigation li a#navVortraege {
		background-image:url(../images/nav-vortraege.png);
		width:78px;
	}
	
	ul#navigation li a#navTouren {
		background-image:url(../images/nav-touren.png);
		width:68px;
	}
	
	ul#navigation li a#navKontakt {
		background-image:url(../images/nav-kontakt.png);
		width:74px;
	}
	
	ul#navigation li a#navPartner {
		background-image:url(../images/nav-partner.png);
		width:71px;
	}
	
	ul#navigation li.current a#navShop { background-image:url(../images/nav-shop-active.png); }
	ul#navigation li.current a#navMarken { background-image:url(../images/nav-marken-active.png); }
	ul#navigation li.current a#navNeuigkeiten { background-image:url(../images/nav-neuigkeiten-active.png); }
	ul#navigation li.current a#navTeam { background-image:url(../images/nav-team-active.png); }
	ul#navigation li.current a#navVortraege { background-image:url(../images/nav-vortraege-active.png); }
	ul#navigation li.current a#navTouren { background-image:url(../images/nav-touren-active.png); }
	ul#navigation li.current a#navKontakt { background-image:url(../images/nav-kontakt-active.png); }
	ul#navigation li.current a#navPartner { background-image:url(../images/nav-partner-active.png); }
	
	/*
	Content Elemente generell
	=================================================
	*/
	
	div#content {
		width:780px;
		margin:40px 0 0 180px;
	}
	
	div#content h2 {
		text-align:right;
		font-size:1.7em;
		font-weight: bold;
		background:url(../images/title-border.png) bottom repeat-x;
		padding-right:25px;
	}
	
	div#content h3 {
		font-size:1.2em;
		font-weight:bold;
		margin-bottom:10px;
	}
	
	div#content h4 {
		font-weight:bold;
		margin-top:.8em;
	}
	
	div#content a {
		color:#fff;
	}
	
	div#content h2.mainTitle {
		margin-bottom:1.8em;
	}
	
	div#content .contentElement {
		margin:0 0 35px 25px;
		font-size: 1.2em;
	}
	
	div#content div#contentLeft h2 {
		padding-right:0;
	}
	
	div#contentLeft {
		float:left;
		width:485px;
		margin-right:35px;
	}
	
	div#contentLeft dl dt {
		float:left;
		font-weight: bold;
		width: 160px;
		clear: both;
		margin-bottom: 10px;
	}
	
	div#contentLeft dl.dtNotStrong dt {
		font-weight: normal;
	}
	
	div#contentLeft dl dd {
		float: left;
		width:300px;
		margin-bottom: 10px;
	}

	div#markenOverview a  {
		float: left;
		display: block;
		text-align: center;
		background: #fff center no-repeat;
		width: 130px;
		height: 130px;
		margin: 0 20px 20px 0;
		cursor: pointer; 
	}
	
	div#markenOverview a img {
		display: none;
	}
	
	/*
	Content Spalte Rechts
	=================================================
	*/
	
	div#contentRight {
		float:left;
		width:260px;
	}
	
	div#contentRight .contentElement {
		margin:0 25px 35px 0;
	}
	
	div#contentRight .contentElement a {
		 color:#72767b;
	}
	
	/*
	Footer
	=================================================
	*/
	
	div#footer h3 {
		font-size:1em;
		margin:0 0 .3em 0;
		color:#4f4f4f;
		font-weight:bold;
	}
	
	div#footerMiddle h3 {
		margin-bottom:.8em;
	}
	
	div#footer {
		font-size:1.1em;
		color:#4f4f4f;
		background:url(../images/title-border.png) top left repeat-x;
		padding:45px 25px 0 25px;
	}
	
	div#footerLeft {
		width:190px;
		float:left;
	}
	
	div#footerLeft a {
		color:#4f4f4f;
		text-decoration:none;
	}
		
	div#footerLeft a:hover {
		color:#fff;
		text-decoration:none;
	}
	
	div#footerMiddle {
		width:155px;
		float:left;
	}
	
	div#footerRight {
		width:385px;
		float:left;
	}
	
	ul#footerNavigation {
		padding-bottom:3em;
	}
	
	ul#footerNavigation li a {
		color:#4f4f4f;
		background-color:#232323;
		padding:3px 7px;
		margin-right:3px;
	}
	
	ul#footerNavigation li a:hover {
		background-color:#2c2c2c; 
	}
	
	ul#footerNavigation li a.last {
		margin-right:0;
	}
	
	a#clickwerk {
		display:block;
		width:94px;
		height:16px;
		background:url(../images/clickwerk.gif) no-repeat;
	}
	
	a#clickwerk span {
		display:none;
	}
	
	/*
	Marken
	=================================================
	*/
	
	ul#marken {
		float: left;
		width: 100%;
	}
	
	ul#marken li {
		float: left;
		margin: 0 15px 15px 0;
	}

	ul#marken li a {
		cursor: pointer;
		display:block;
		background-repeat:no-repeat;
	}
	
	ul#marken li a span {
		display:none;
	}
	
	a#markeArteryx {
		width:80px;
		height:53px;
		background-image:url(../images/marke-arcteryx.png);
	}
	
	a#markeMammut {
		width:68px;
		height:58px;
		background-image:url(../images/marke-mammut.png);
	}
	
	a#markeToko {
		width:73px;
		height:57px;
		background-image:url(../images/marke-toko.png);
	}
	
	a#markeCollTex {
		width:109px;
		height:23px;
		background-image:url(../images/marke-colltex.png);
	}
	
	a#markeLeki {
		width:110px;
		height:19px;
		background-image:url(../images/marke-leki.png);
	}
	
	a#markeDynafit {
		width:117px;
		height:22px;
		background-image:url(../images/marke-dynafit.png);
	}
	
	a#markeSilvretta {
		width:114px;
		height:16px;
		background-image:url(../images/marke-silvretta.png);
	}
	
	a#markeDiamir {
		width:119px;
		height:46px;
		background-image:url(../images/marke-diamir.png);
	}
	
	a#markeSportiva {
		width:116px;
		height:58px;
		background-image:url(../images/marke-sportiva.png);
	}
	
	a#markeAtomic {
		width:127px;
		height:27px;
		background-image:url(../images/marke-atomic.png);
		margin-top: 18px;
	}
	
	a#markeNorrona {
		width:150px;
		height:31px;
		background-image:url(../images/marke-norrona.png);
	}
	
	a#markeScarpa {
		width:98px;
		height:53px;
		background-image:url(../images/marke-scarpa.png);
		margin-left: 25px;
	}
	
	a#markeIcebreaker {
		width:213px;
		height:36px;
		background-image:url(../images/marke-icebreaker.png);
	}
	
	a#markePetzl {
		width:120px;
		height:60px;
		background-image:url(../images/marke-petzl.png);
	}
	
	/*
	Partner
	=================================================
	*/
	
	div#partnerContainer a.partnerLogo {
		display: block;
		float: left;
		background-repeat: no-repeat;
		width: 180px;
		margin-right: 25px;
		cursor: pointer;
	}
	
	div#partnerContainer address {
		display: block;
		float: left;
		margin-bottom: 25px;
	}
	
	a#partnerGlanzmannTours {
		background-image: url(../images/partner-glanzmanntours.png);
		height: 25px;
	}
	
	a#partnerAlpineAdventures {
		background-image: url(../images/partner-alpineadventures.png);
		height: 61px;
	}
	
	a#partnerSAA {
		background-image: url(../images/partner-saa.png);
		height: 50px;
	}
	
	/*
	Formular
	=================================================
	*/
	
	form .formLeft {
		clear: both;
		width: 150px;
		float: left;
		margin-bottom: 10px;
	}
	
	form .formRight {
		float: left;
		width: 310px;
		margin-bottom: 10px;
	}
	
	form .formRight.spacerSmall {
		margin-bottom: 5px;
	}
	
	form .formRight label {
		display: block;
		width: 284px;
		float: left;
	}
	
	form .formRight .inputFloat {
		display: block;
		float: left;
		margin-right: 6px;
	}
	
	form .formRight label {
		margin-bottom: 4px;
	}
	
	form .formRight label.last {
		margin-bottom: 0;
	}
	
	form select.small {
		width: 100px;
	}
	
	form input.inputText {
		width: 210px;
	}
	
	form textarea {
		width: 210px;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 1em;
	}
	
	* html form input.inputText, * html form textarea {
		margin-left: -20px;
	}
	
	form input.inputText.small {
		width: 30px;
	}
	
	form input.inputText.medium {
		width: 163px;
		margin-left: 0 !important; /* For IE6*/
	}
	
	form .inputText, form textarea {
		padding: 6px;
		border: 1px solid #000;
	}
	
	form .formRight.inputFlow input, form .formRight.inputFlow label {
		width: auto;
		float: none !important; /* IE6 needs important*/
		display: inline !important;
	}
	
	form .formRight label.error {
		display: inline;
		position: absolute;
		padding: 3px 6px;
		font-size: 0.9em;
		background: #cf231c;
		margin-top: 2px;
		width: auto;

	}
	
	form input.inputText.error, form textarea.error {
		border-color: #cf231c;
		border-width:2px;
		padding: 5px;
	}
	
	form .labelAdd {
		color: #72767b;
		font-size: 0.9em;
	}
	
	form input.inputSubmit {
		padding: 2px 4px;
	}
	
	* html form input.inputSubmit {
		margin-left: -20px;
	}
	
	form.newsletterSidebar label {
		display: block;
	}
	
	* html form.newsletterSidebar input.inputText, * html form.newsletterSidebar input.inputSubmit {
		margin-left: 0;
	}
	
	form.newsletterSidebar input.inputText {
		display: block;
		margin-bottom: 6px;
	}
	
	/*
	Verschiedene Klassen
	=================================================
	*/
	 
	.highlight {
		color:#e5312a;
	}
	
	.imageBorder {
		border:5px solid #232323;
	}
	
	.highlightBox {
		background-image:url(../images/bg-highlight.png);
		background-repeat:no-repeat;
		margin-bottom: 1.5em;
	}

	.btnProcent {
		float: left;
		margin: 5px 15px 3px 0;
	}

	.highlightBox p{
		padding: 10px;
		margin-bottom: 0;
	} 
	
	
	div#contentRight div.imgContainer {
		float: left;
		background: url(../images/45-lines.png) top left;
		padding: 8px;
		margin: 0 10px 10px 0;
	}
	
	div#contentLeft div.imgContainer {
		background: url(../images/45-lines.png) top left;
		padding: 8px;
	}
	
	div.imgContainer img {
		border: 1px solid #000;
	}
	
	.imgImpr {
		padding:5px !important;
		margin: 0 5px 5px 0 !important;
	}
	
	a.linkArrow {
		background:url(../images/icon-arrow.gif) center left no-repeat;
		padding-left:14px;
	}
	
	a.linkArrowGray {
		background:url(../images/icon-arrow-gray.gif) center left no-repeat;
		padding-left:14px;
	}
	
	/*
	Tabellen Definitionen
	=================================================
	*/
	 
	 .shade td {
	 	background:url(../images/table-bg.png);
	 }