@charset "UTF-8";

/************************************************
*             Fixes, Workarounds, etc.          *
************************************************/
/* Clearfix fuer das Float-clearing */
.clearfix:after {
    content: '.';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
	}
.clearfix {display: inline-block;}  /* IE 7 */

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

/************************************************
*                 Grundlayout                   *
************************************************/
html {
	min-height: 100%;
	height: auto;
	}
body {
	text-align: center;
	font-size: 15px;
	line-height: 140%;
	color: #fff;
	background-color: #000;
	background-position: bottom center;
	background-repeat: no-repeat;
	font-family: "Cantarell", "Lucida Sans", "Lucida Grande", arial, sans-serif;
	}
#wrapper {
	text-align: left;
	width: 980px;
	margin: 0 auto;
	}
header {
	position: relative;
	display: block;
	width: 980px;
	height: 160px;
	padding-top: 10px;
	}
#logo {
	float: left;
	margin: 5px 0 -10px -75px;
	}
#marken {
	text-align: right;
	vertical-align: bottom;
	float: right;
	width: 600px;
	height: 60px;
	margin-top: 30px;
	}
#marken img {
	vertical-align: bottom;
	margin-left: 20px;
	}
#main {
	width: 980px;
	padding-top: 5px;
	background-repeat: no-repeat;
	background-image: url('../images/grau/main_bg.gif');
	}
section {
	display: block !important;
	width: 928px;
	min-height: 400px;
	height: auto !important;
	height: 400px;
	padding: 25px;
	background: #62666d;
	border-left: 1px solid #9c9e9f;
	border-right: 1px solid #9c9e9f;
	}
.narrow {
	background-image: url('../images/grau/main_narrow_bg.gif') !important;
	}
.narrow #left {
	display: inline;
	float: left;
	width: 720px;
	}
.narrow section {
	display: inline;
	float: left;
	width: 668px;
	}
.narrow aside {
	display: inline;
	float: left;
	width: 240px;
	overflow-x: hidden;
	margin: -5px 0 0 20px;
	}
aside .angebot {
	float: left;
	position: relative;
	margin: 0 6px 10px 0;
	}
aside .last {
	margin-right: 0;
	}
#splash {
	width: 980px;
	height: 400px;
	margin-bottom: 10px;
	}
#home {
	position: relative;
	}
#home aside {
	display: block;
	height: 120px;
	}
#home aside .last {margin-left: -2px;}
#emotion {
	float: right;
	width: 345px;
	margin: 0 0 10px 25px;
	}
#footer {
	width: 950px;
	padding: 15px;
	}

/************************************************
*                Style-Elemente                 *
************************************************/
img {border: none;}
hr {
	clear: both;
	color: #fff;
	height: 1px;
	margin: 5px 0 15px 0;
	background: #fff;
	border: none;
	}
a, a:link, a:visited {
	text-decoration: none;
	color: #a7a9ad;
	}
section a:hover, section a:active, section a:focus {color: #fff !important;}
address {font-style: normal;}

/* Corners */
#splash .ecken {
	position: absolute;
	top: 0; left: 0;
	padding: 0;
	}
#emotion img {
	padding: 1px 0 0 1px;
	}



/* Facebook */
header .fb-like {
	position: absolute;
	top: 5px; left: 0;
	}

/************************************************
*                   Navigation                  *
************************************************/
/* Direktlinks */
#directlinks {
	display: block;
	position: absolute;
	top: 20px; right: -43px;
	z-index: 1000;
	}
#directlinks li {
	margin-bottom: 5px;
	}
.orange #directlinks,
.braun #directlinks,
.immo #directlinks {display: none;}
.tuerkis #directlinks li.probefahrt,
.tuerkis #directlinks li.service {display: none;}
#directlinks li a, #directlinks li a:link, #directlinks li a:visited {
	position: relative;
	}

/* generische Navigation */
#gnav {
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	width: 100%;
	height: 55px;
	}
#gnav ul {float: right;}
#gnav ul li {
	float: left;
	border-right: 1px solid #9c9e9f;
	}
#gnav ul li.last {border-right: none;}
#gnav ul li a, #gnav ul li a:link, #gnav ul li a:visited {
	float: left;
	color: #9c9e9f;
	font-size: 11px;
	line-height: 10px;
	padding: 0 5px;
	}
/* Hauptnavigation */
#hnav {
	clear: both;
	display: block;
	clear: both;
	width: 100%;
	height: 36px;
	padding-bottom: 10px;
	}
#hnav ul li {
	float: left;
	margin-right: 1px;
	}
#hnav ul li.last {
	margin-right: 0;
	}
#hnav li a, #hnav li a:link, #hnav li a:visited {
	text-align: center;
	float: left;
	font-size: 18px;
	color: #fff;
	line-height: 1.8em;
	font-weight: bold;
	font-style: italic;
	height: 36px;
	width: 122px;
	background-image: url('../images/grau/hnav_bg.png');
	background-position: -123px 0;
	background-repeat: no-repeat;
	}
#hnav li a:hover, #hnav li a:active, #hnav li a:focus,
#hnav li a.active, #hnav li a.active:link, #hnav li a.active:visited {
	color: #fff !important;
	background-position: -123px -37px; 
	}
#hnav li.first a, #hnav li.first a:link, #hnav li.first a:visited {
	background-position: 0 0; 
	}
#hnav li.first a:hover, #hnav li.first a:active, #hnav li.first a:focus,
#hnav li.first a.active, #hnav li.first a.active:link, #hnav li.first a.active:visited {
	background-position: 0 -37px; 
	}
#hnav li.last a, #hnav li.last a:link, #hnav li.last a:visited {
	width: 119px;
	background-position: -246px 0; 
	}
#hnav li.last a:hover, #hnav li.last a:active, #hnav li.last a:focus,
#hnav li.last a.active, #hnav li.last a.active:link, #hnav li.last a.active:visited {
	background-position: -246px -37px; 
	}

/* sekundaere Navigation */
#snav {
	display: block;
	text-align: center;
	width: 100%;
	height: 20px;
	padding-bottom: 10px;
	}
.angebote #snav {display: none;}
#snav ul {}
#snav li {
	display: inline;
	padding-right: 10px;
	background: url('../images/snav_separator.gif') right no-repeat;
	}
#snav li.last {
	background: none;
	}
#snav li a, #snav li a:link, #snav li a:visited {
	font-size: 16px;
	color: #87888a;
	font-weight: normal;
	font-style: oblique;
	}
#snav li a:hover, #snav li a:active, #snav li a:focus,
#snav li.active a, #snav li.active a:link, #snav li.active a:visited {
	color: #fff;
	}

/* Footer Navigation */
#fnav {
	clear: both;
	display: block;
	height: 20px;
	width: 950px;
	padding: 0 15px 15px;
	background-position: left bottom;
	background-repeat: no-repeat;
	background-image: url('../images/grau/bottom_bg.gif');
	}
.narrow #fnav {
	width: 690px;
	background-image: url('../images/grau/bottom_narrow_bg.gif');
	}
#fnav ul li.back {
	float: left;
	margin: 0;
	}
#fnav ul li {
	float: right;
	margin-left: 20px;
	}

/************************************************
*            Content-Absatzformate              *
************************************************/
/* Ueberschriften */
h1, h2, h3, h4, h5 {
	font-weight: bold;
	margin-bottom: 15px;
	}
h1 {
	font-size: 30px;
	line-height: 1.2em;
	text-shadow: 3px 3px 3px #373737;
	}
h2 {
	font-size: 20px;
	line-height: 1.2em;
	text-shadow: 2px 2px 2px #373737;
	}
h3 {
	font-size: 18px;
	text-shadow: 1px 1px 1px #373737;
	}
/* Paragraph */
p {margin-bottom: 15px;}
p.angebot {
	text-align: center;
	font-size: 17px;
	color: #fff;
	font-weight: normal;
	font-style: oblique;
	width: 100%;
	height: 20px;
	padding-bottom: 10px;
	margin-bottom: 0;
	}

/* Listen */
section ul {
	margin: 0 0 15px 15px;
	}
section ul li {
	list-style: disc;
	margin: 0;
	}
dl {
	margin: 10px 0;
	}
dt {
	float: left;
	width: 18%;
	line-height: 1.8em;
	border-bottom: 1px solid #b2b6a7;
	}
dd {
	float: left;
	width: 82%;
	line-height: 1.8em;
	border-bottom: 1px solid #b2b6a7;
	}
	
/* Tabellen */
#content table {
	border-collapse: collapse;
	}
#content table th {
	font-weight: bold;
	}
#content table td, #content table th {
	text-align: left;
	vertical-align: top;
	border: 1px solid #B2B6A7;
	padding: 3px 10px 3px 3px;
	}
#content table td p {
	padding: 0;
	margin: 0;
	}
	
/* Splash */
#splash .gallery {
	position: relative;
	z-index: 0;
	}

/* News */
article {
	display: block;
	width: 100%;
	clear: both;
	}
article .bild {
	float: right;
	margin-bottom: 5px;
	}
article .childscontainer {
	float: right;
	margin-left: 25px;
	}
article .childscontainer p {
	display: none;	
	}
article p.date {
	font-size: 13px;
	}
	
/* Modelle */
#modelle {
	padding: 0 10px;
	margin: 0;
	}
#modelle li {
	list-style: none;
	float: left;
	width: 300px;
	height: 200px;
	margin-right: 45px;
	}
#modelle li.alt {margin-right: 0;}
#modelle li button {
	text-align: left;
	cursor: pointer;
	color: #fff;
	font-size: 16px;
	font-style: italic;
	font-weight: bold;
	background: transparent;
	border: none;
	}
.overlay {
	display: none;
	width: 668px;
	top: 176px !important;		
	padding: 20px 35px;
	background: #62666D;
	border: 1px solid #9C9E9F;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	}
.overlay .close {
	background-image: url('../images/icons/close.png');
	position: absolute; right: -15px; top: -15px;
	cursor: pointer;
	height: 35px;
	width: 35px;
	}
#modelle li img {
	display: block;
	margin-bottom: 5px;
	}
	
/* Angebote */
a.pdf, a.pdf:link, a.pdf:visited {
	display: block;
	height: 60px;
	padding: 15px 0 0 60px;
	font-size: 20px;
	background: url('../images/icons/pdf-trans.png') left top no-repeat;
	}
	
/* iFrame */
iframe {
	margin-bottom: 15px;
	}
iframe.wide {
	width: 928px;
	height: 620px;
	overflow-x: hidden;
	}
	
/* Stellen */
#accordion h2 {
	cursor: pointer;
	color: #A7A9AD;	
	}
.braun #accordion h2 {
	color: #393229;
	text-shadow: none;
	}
#accordion h2.current {
	cursor: default;
	color: #fff;
	}
#accordion .pane {
	display: none;
	margin-bottom: 15px;
	}


/* Galerie */
.thumbs {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	}
.thumbs p {line-height: 125%;}
.thumbscontainer {
	float: none !important;
	}
section .thumbscontainer ul.thumbs li {
	margin: 0 4px 0 0 !important;
	}
/* Grittibaenz Galerie */
.grittibaenz-gallery ul.thumbs li {
	position: relative;
	}
.grittibaenz-gallery ul.thumbs li p {
	font-size: 20px;
	font-weight: bold;
	position: absolute;
	bottom: 7px;
	padding: 5px 0;
	text-indent: 10px;
	background: #000;
	margin-bottom: 0;
	filter:alpha(opacity=60);
	-moz-opacity:0.6;
	-khtml-opacity: 0.6;
	opacity: 0.6;
	}

/************************************************
*                Rechte Spalte                  *
************************************************/
aside .box {
	width: 240px;
	height: 120px;
	margin-bottom: 15px;
	}
aside .box a, aside .box a:link, aside .box a:visited {
	display: block;
	color: #fff;
	width: 240px;
	height: 120px;
	background: url('../images/grau/box_bg.gif') no-repeat;
	}
aside .box a:hover, aside .box a:active, aside .box a:focus,
aside .box a.active, aside .box a.active:link, aside .box a.active:visited {
	background-position: bottom;
	}
aside .box a img.marke {
	float: left;
	margin: 20px 5px 0 10px;
	}
aside .box a img.gecko {
	position: relative;
	float: left;
	width: 108px;
	height: 120px;
	margin: 0 5px;
	}
.rot .box img.gecko {display: none;}
aside .box a span {
	float: right;
	text-align: center;
	font-weight: bold;
	font-size: 18px;
	line-height: 25px;
	width: 150px;
	padding-top: 45px;
	}
aside .aktion a span {
	text-align: center;
	width: 240px;
	padding-top: 35px;
	font-size: 16px;
	}
aside .job a span {
	text-align: center;
	width: 220px;
	font-size: 14px;
	padding: 10px;
	}
.blau .aktion {display: none;}

/************************************************
*                   Formular                    *
************************************************/
form {width: 400px;}
form p {
	font-size: 13px;
	line-height: 16px;
	padding-top: 5px;
	margin-bottom: 5px;
	}
fieldset {
	border: none;
	margin-bottom: 10px;
	}
fieldset:last-of-type {
	margin-bottom: 0;
	}
.orange fieldset.empfang {display: none;}
legend {
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	padding-bottom: 10px;
	}
fieldset fieldset legend {
	font-size: 13px;
	font-weight: normal;
	padding-bottom: 0;
	}
form ol {margin: 0; padding: 0;}
form ol li {
	font-size: 13px;
	line-height: 30px;
	list-style: none;
	padding: 5px 10px;
	margin-bottom: 2px;
	background: #919499;
	background: rgba(255,255,255,.3);
	border-color: rgba(255,255,255,.6);
	border-style: solid;
	border-width: 2px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	border-radius: 5px;
	}
form ol li.text {
	line-height: 17px;
	}
form ol ol li {
	float: left;
	background: none;
	border: none;
	}
form ol ol li.clear {
	clear: both;
	}
label {
	float: left;
	font-size: 13px;
	width: 150px;
	}
label.long {width: 350px; line-height: 1.3em;}
fieldset fieldset label {
	line-height: 20px;
	padding: 0 0 0 5px;
	width: auto;
	background: none no-repeat left 50%;
	}
fieldset fieldset label:hover {
	cursor: pointer;
	}
input[type=text],
input[type=password],
input[type=submit],
input[type=button],
textarea {
	font-family: "Lucida Sans", "Lucida Grande", Sans-Serif;
	font-size: 12px;
	line-height: 18px;
	outline: none;
	width: 200px;
	padding: 5px;
	background: #fff;
	border: none;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
	border-radius: 3px;
	}
input.plz {width: 50px;}
input.ort {width: 135px;}
textarea {
	height: 100px;
	}
select {
	font-family: "Lucida Sans", "Lucida Grande", Sans-Serif;
	font-size: 12px;
	width: 210px;
	height: 20px;
	background: #fff;
	border: none;
	}
select option {
	line-height: 20px;
	}
input:not([type=submit]):focus,
textarea:focus {
	background: #eaeaea;
	}
input[type=radio],
input[type=checkbox] {
	float: left;
	margin-right: 5px;
	}
form button {
	font: 18px "Lucida Sans", "Lucida Grande", Sans-Serif;
	color: #666;
	letter-spacing: 1px;
	text-transform: uppercase;
	text-shadow: 0 1px 1px #000000;
	background: #fff;
	display: block;
	margin: 30px auto 0 auto;
	padding: 7px 25px;
	border: none;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	-khtml-border-radius: 20px;
	border-radius: 20px;
	}
form button:hover {
	color: #fff;
	background: #000;
	cursor: pointer;
	}

.errors {
	color: red;
	width: 380px;
	padding: 10px;
	margin: 20px 0;
	background: #FFCCCC;
	border: 1px solid red;
	}
	
.tuerkis .autokauf {
	display: none;
	}


	
/* Manage Pictures */
.managecontainer {float: none !important;}
.pictureform {width: 900px;}
#editform {width: 900px;}
.shortfields {padding-bottom: 5px;}
textarea.title {height: 20px; margin-bottom: 5px;}
.managecontainer hr {width: 100% !important;}

input[type=checkbox] {width: 20px;}
textarea.description {height: 50px;}
.uploadform .uploadfile {
	float: left;
	width: 300px;
	}
/************************************************
*                   Farbwelten                  *
************************************************/
/* Body Background */
body.braun {background-image: url('../images/braun/bg.jpg');}
body.grau {background-image: url('../images/grau/bg.jpg');}
body.blau {background-image: url('../images/blau/bg.jpg');}
body.gruen {background-image: url('../images/gruen/bg.jpg');}
body.orange {background-image: url('../images/orange/bg.jpg');}
body.rot {background-image: url('../images/rot/bg.jpg');}
body.tuerkis {background-image: url('../images/tuerkis/bg.jpg');}
body.immo {background-image: none; background-color: #fff;}

.blau #wrapper {
	border-top: 6px solid #ff8c02;
	}

/* Marken */
.grau #marken .fiat,
.grau #marken .alfaromeo,
.grau #marken .lancia {display: none;}
.intern #marken {display: none;}
.rot #marken .honda,
.rot #marken .ford {display: none;}
.orange #marken {display: none;}
.tuerkis #marken {display: none;}
.blau #marken .fiat,
.blau #marken .alfaromeo,
.blau #marken .lancia,
.blau #marken .honda,
.immo #marken {
	display: none;
	}

/* Modelle */
.overlay .bilder {
	margin-bottom: 10px;
	}
.overlay .bilder canvas {
	float: left;
	margin-right: 25px;
	}
.rot .overlay {
	background: #930B0B;
	border: 1px solid #CB4040;
	}
.blau .overlay {
	background: #001E5A;
	border: 1px solid #003399;
	}
.braun .overlay {
	background: #786855;
	border: 1px solid #8F8273;
	}
	
/* Linkfarben */
.rot a, .rot a:link, .rot a:visited {color: #e27272;}
.tuerkis a, .tuerkis a:link, .tuerkis a:visited {color: #02bfcc;}
.orange a, .orange a:link, .orange a:visited {color: #521900;}
.blau a, .blau a:link, .blau a:visited {color: #95aad4;}
.braun a, .braun a:link, .braun a:visited {color: #b3a897;}

/* Hauptnavigation */
.braun #hnav li a, .braun #hnav li a:link, .braun #hnav li a:visited {
	background-image: url('../images/braun/hnav_bg.gif');
	}
.rot #hnav li a, .rot #hnav li a:link, .rot #hnav li a:visited {
	background-image: url('../images/rot/hnav_bg.gif');
	}
.tuerkis #hnav li a, .tuerkis #hnav li a:link, .tuerkis #hnav li a:visited {
	background-image: url('../images/tuerkis/hnav_bg.gif');
	}
.orange #hnav li a, .orange #hnav li a:link, .orange #hnav li a:visited {
	background-image: url('../images/orange/hnav_bg.gif');
	}
.blau #hnav li a, .blau #hnav li a:link, .blau #hnav li a:visited {
	background-image: url('../images/blau/hnav_bg.gif');
	}
.gruen #hnav li a, .gruen #hnav li a:link, .gruen #hnav li a:visited {
	background-image: url('../images/gruen/hnav_bg.gif');
	}
	
/* Main Background */
.braun #main {background-image: url('../images/braun/main_bg.gif');}
.rot #main {background-image: url('../images/rot/main_bg.gif');}
.tuerkis #main {background-image: url('../images/tuerkis/main_bg.gif');}
.orange #main {background-image: url('../images/orange/main_bg.gif');}
.blau #main {background-image: url('../images/blau/main_bg.gif');}

/* Main Narrow Background */
.braun .narrow {background-image: url('../images/braun/main_narrow_bg.gif') !important;}
.rot .narrow {background-image: url('../images/rot/main_narrow_bg.gif') !important;}
.tuerkis .narrow {background-image: url('../images/tuerkis/main_narrow_bg.gif') !important;}
.orange .narrow {background-image: url('../images/orange/main_narrow_bg.gif') !important;}
.blau .narrow {background-image: url('../images/blau/main_narrow_bg.gif') !important;}

/* Section Background */
.braun section {
	background: #786855;
	border-right: 1px solid #8f8273;
	border-left: 1px solid #8f8273;
	}
.rot section {
	background: #930b0b;
	border-right: 1px solid #cb4040;
	border-left: 1px solid #cb4040;
	}
.tuerkis section {
	background: #014c51;
	border-right: 1px solid #02727a;
	border-left: 1px solid #02727a;
	}
.orange section {
	background: #ff4e00;
	border-right: 1px solid #ff7900;
	border-left: 1px solid #ff7900;
	}
.blau section {
	background: #001e5a;
	border-right: 1px solid #003399;
	border-left: 1px solid #003399;
	}

/* Aside Background */
.braun aside .box a, .braun aside .box a:link, .braun aside .box a:visited {
	background-image: url('../images/braun/box_bg.gif');
	}
.rot aside .box a, .rot aside .box a:link, .rot aside .box a:visited {
	background-image: url('../images/rot/box_bg.gif');
	}
.tuerkis aside .box a, .tuerkis aside .box a:link, .tuerkis aside .box a:visited {
	background-image: url('../images/tuerkis/box_bg.gif');
	}
.orange aside .box a, .orange aside .box a:link, .orange aside .box a:visited {
	background-image: url('../images/orange/box_bg.gif');
	}
.blau aside .box a, .blau aside .box a:link, .blau aside .box a:visited {
	background-image: url('../images/blau/box_bg.gif');
	}

/* Formular */
.rot form ol li {background: #b35454;}
.tuerkis form ol li {background: #4d8285;}
.orange form ol li {background: #ff834d;}
.blau form ol li {background: #4d618b;}

/* Footer Nav */
.braun #fnav {background-image: url('../images/braun/bottom_bg.gif');}
.rot #fnav {background-image: url('../images/rot/bottom_bg.gif');}
.tuerkis #fnav {background-image: url('../images/tuerkis/bottom_bg.gif');}
.orange #fnav {background-image: url('../images/orange/bottom_bg.gif');}
.blau #fnav {background-image: url('../images/blau/bottom_bg.gif');}

/* Footer Narrow Nav */
.braun .narrow #fnav {background-image: url('../images/braun/bottom_narrow_bg.gif');}
.rot .narrow #fnav {background-image: url('../images/rot/bottom_narrow_bg.gif');}
.tuerkis .narrow #fnav {background-image: url('../images/tuerkis/bottom_narrow_bg.gif');}
.orange .narrow #fnav {background-image: url('../images/orange/bottom_narrow_bg.gif');}
.blau .narrow #fnav {background-image: url('../images/blau/bottom_narrow_bg.gif');}










/* everything is constructed with a single background image */

/* root element for tabs */
#flowtabs {
	width:900px;
	height:31px !important;
	margin: 0;
	}
/* single tab */
#flowtabs li { 
	float: left;
	margin: 0; 
	padding: 0; 
	text-indent: 0; 
	list-style-type: none;
	}
/* a- tag inside single tab */
#flowtabs li a, #flowtabs li a:link, #flowtabs li a:visited {
	display: block;
	font-weight: bold;
	height: 31px;   
	width: 60px;
	line-height: 33px;
	text-align: center;
	}
#flowtabs li a.current {
	color: #fff;
	}
/* panes */
#flowpanes {	
	width: 900px;
	height: 300px;	
	}
/* single pane */
#flowpanes div {display: none;}



/************************************************
*                 Immobilien                   *
************************************************/
.immo {font-family: arial, sans-serif; font-size: 13px;}
.immo #gnav {display: none;}
.immo #hnav li a, .immo #hnav li a:link, .immo #hnav li a:visited {font-style: normal; font-weight: normal; font-size: 13px;}
