/*********************************************/
/*        css styles for abt automobile      */
/*           written and composed by         */
/*               markus erdmann              */
/*             © 2009 esense gmbh            */
/*                                           */
/*********************************************/

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

body {
background-color:#161A1E;
height:100%;
}

#leftContainer {
position:relative;
margin:20px 0 20px 0;
width:100%;
float:left;
background:transparent url(../pics/test2.jpg) 0px 0px repeat;
}

#rightContainer {
width:100%;
float:left;
background:transparent url(../pics/leder-kachel-hell.jpg) top right repeat-y;
}

#centerContainer {
position:relative;
width:970px;
margin:0 auto 0 auto;
background-color:transparent;
}

#contentContainer {
position:relative;
width:950px;
float:left;
background:transparent url(../pics/schatten-links3.png) top left repeat-y;
}

#centerContentContainer {
position:relative;
width:930px;
float:right;
margin:0 0 0 0;
background:#80868b url(../pics/nav-bg.jpg) 0 133px repeat-y;
}

#headerContainer {
position:relative;
width:930px;
height:134px;
float:right;
background:transparent url(../pics/header.jpg) 0 0 no-repeat;
border-bottom:1px solid #333;
}

/*** abt logo ***/
#logo {
position:absolute;
top:94px;
left:710px;
}

/*** bmw logo ***/
.activeBmw a {
position:relative;
width:70px;
height:70px;
float:left;
background:transparent url(../pics/bmw-active.jpg) 0 0 no-repeat;
}

.inactiveBmw a {
position:relative;
width:70px;
height:70px;
float:left;
background:transparent url(../pics/bmw-inactive.jpg) 0 0 no-repeat;
}

.inactiveBmw a:hover {
background:transparent url(../pics/bmw-active.jpg) 0 0 no-repeat;
}

/*** mini logo ***/
.activeMini a {
position:relative;
width:90px;
height:70px;
float:left;
background:transparent url(../pics/mini-active.jpg) 0 0 no-repeat;
}

.inactiveMini a {
position:relative;
width:90px;
height:70px;
float:left;
background:transparent url(../pics/mini-inactive.jpg) 0 0 no-repeat;
}

.inactiveMini a:hover {
background:transparent url(../pics/mini-active.jpg) 0 0 no-repeat;
}

/*** morgan logo ***/
.activeMorgan a {
position:relative;
width:100px;
height:70px;
float:left;
background:transparent url(../pics/morgan-active.jpg) 0 0 no-repeat;
}

.inactiveMorgan a {
position:relative;
width:100px;
height:70px;
float:left;
background:transparent url(../pics/morgan-inactive.jpg) 0 0 no-repeat;
}

.inactiveMorgan a:hover {
background:transparent url(../pics/morgan-active.jpg) 0 0 no-repeat;
}

/*** header nav ***/
#linkTopNavigation {
position:relative;
top:20px;
padding:0 20px 0 0;
width:auto;
float:right;
z-index:1000;
font-size:11px;
}

#linkTopNavigation a {
font-size:12px;
}

#linkTopNavigation .inactive,
#linkTopNavigation .active {
float:left;
}

#linkTopNavigation .inactive a {
color:#1a2938;
}

#linkTopNavigation .inactive a:hover {
color:#c2c8cc;
}

#linkTopNavigation .active a {
color:#c2c8cc;
}

/*** content ***/
/*** normal ***/
.topContent {
position:relative;
width:761px;
float:right;
background-color:#C2C9CC;
}

.normalContent {
position:relative;
width:671px;
padding:30px 60px 30px 30px;
float:left;
background-color:transparent;
}

.innerContent {
position:relative;
width:591px;
padding:30px 60px 30px 30px;
float:left;
background-color:transparent;
border-bottom:1px solid #161A1E;
}

.bottomContent {
position:relative;
width:761px;
float:right;
border-top:1px solid #161A1E;
}

.externalContent {
position:relative;
top:0;
left:0;
float:left;
padding:0 0 0 20px;
margin:0;
width:auto;
line-height:0;
background-color:#C2C9CC;
}

/*** two column ***/
.twoColumnContainer {
position:relative;
width:761px;
float:right;
background-color:#C2C9CC;
}

.leftContent {
position:relative;
width:381px;
float:left;
background-color:transparent;
}

.leftInnerContent {
position:relative;
width:321px;
padding:30px;
float:left;
background-color:transparent;
}

.rightContent {
position:relative;
width:380px;
float:right;
}

/*** fullscreen ***/
.fullscreenContent {
position:relative;
width:100%;
float:left;
background-color:#fff;
}

/*** bmw ***/
.bmwTopContent {
position:relative;
width:761px;
float:right;
background-color:#fff;
}

.bmwColumnLogo {
position:absolute;
top:0px;
left:681px;
width:80px;
height:80px;
float:right;
background:#fff url(../pics/bmw-bg.gif) top right no-repeat;
}

/*** mini ***/
.miniTopContent {
position:relative;
width:761px;
float:right;
background-color:#121413;
}

.miniColumnLogo {
position:absolute;
top:0px;
left:681px;
width:80px;
height:80px;
float:right;
background:#121413 url(../pics/mini-bg.gif) top right no-repeat;
}

/*** morgan ***/
.morganTopContent {
position:relative;
width:761px;
float:right;
background-color:#292929;
}

.morganColumnLogo {
position:absolute;
top:0px;
left:681px;
width:80px;
height:80px;
float:right;
background:#292929 url(../pics/morgan-bg.gif) top right no-repeat;
}

/*** content ***/
/*** text and link ***/
#centerContentContainer p a {
text-decoration:underline;
}

#centerContentContainer p a:hover {
text-decoration:none;
color: #80868b;
}

/*** list ***/
#centerContentContainer .normalContent ul li,
#centerContentContainer .twoColumnContainer ul li,
#centerContentContainer .fullscreenContent ul li {
list-style-type:disc;
list-style-position:inside;
}

/*** footer ***/
/*** normal ***/
#footer {
position:relative;
width:761px;
padding:0;
float:right;
background-color:#80868B;
color:#24282a;
border-top:1px solid #161A1E;
}

#footer p {
font-size:11px;
padding:10px 30px 10px 30px;
}

/*** fullscreen ***/
#fullscreenFooter {
position:relative;
width:100%;
padding:0;
float:right;
background-color:#80868B;
color:#24282a;
border-top:1px solid #161A1E;
}

#fullscreenFooter p {
font-size:11px;
padding:10px 30px 10px 20px;
}

#footer p a,
#fullscreenFooter p a {
border:none;
}

#footer p a:hover,
#fullscreenFooter p a:hover {
color:#C2C8CC;
}

/*** multimedia ***/
.multimediaBg {
position:relative;
top:0;
left:0;
margin:0 0 0 0;
padding:0;
width:100%;
line-height:0;
background-color:#C2C9CC;
float:left;
border:none;
}

/*** action template ***/
.actionContainer {
position:relative;
top:0;
left:0;
padding:30px 31px 30px 30px;
margin:0;
width:700px;
float:left;
}

.actionContent {
position:relative;
top:0;
left:0;
width:700px;
padding:10px 0 10px 0;
border-top:1px solid #161A1E;
border-bottom:1px solid #161A1E;
float:left;
}

.actionText {
position:relative;
left:10px;
padding:10px 0 0 0;
width:570px;
float:left;
}

.brandActionText {
position:relative;
left:10px;
padding:10px 0 0 0;
width:470px;
float:left;
}

/*** brand ***/
.actionBmw {
position:relative;
top:0;
width:66px;
height:36px;
background:transparent url(../pics/bmw.jpg) 0 0 no-repeat;
float:right;
margin:0 -1px 0 0;
padding:0;
}

.actionMini {
position:relative;
top:0;
width:66px;
height:36px;
background:transparent url(../pics/mini.jpg) 0 0 no-repeat;
float:right;
margin:0 0 0 0;
padding:0;}

.actionMorgan {
position:relative;
top:0;
width:66px;
height:36px;
background:transparent url(../pics/morgan.jpg) 0 0 no-repeat;
float:right;
}

/*** action-label: color ***/
/*** news ***/
.colorNews,
.colorNews a {
color:#0982c6;
text-decoration:none;
font-size:1.5em;
}
.colorNews a {font-size:1em;}
.colorNews a:hover {color:#094769;}

/*** event ***/
.colorEvent,
.colorEvent a {
color:#69951d;
text-decoration:none;
font-size:1.5em;
}
.colorEvent a {font-size:1em;}
.colorEvent a:hover {color:#3c5511;}

/*** action ***/
.colorAction,
.colorAction a {
color:#cd690a;
text-decoration:none;
font-size:1.5em;
}
.colorAction a {font-size:1em;}
.colorAction a:hover {color:#85460a;}

/*** abt ***/
.colorAbt,
.colorAbt a {
color:#C2C8CC;
text-decoration:none;
font-size:1.5em;
}

.colorAbt a {font-size:1em;}
.colorAbt a:hover {color:#1A2938;}

.searchNormalContent .colorAbt a {
color:#1A2938 !important;
}

.searchNormalContent .colorAbt a:hover {
color:#555 !important;
}

/*** action buttons ***/
.buttonNews {
position:relative;
top:0px;
left:0px;
width:40px;
height:40px;
background:transparent url(../pics/news.jpg) 0 0 no-repeat;
float:left;
}

.buttonEvent {
position:relative;
top:0px;
left:0px;
width:40px;
height:40px;
background:transparent url(../pics/event.jpg) 0 0 no-repeat;
float:left;
}

.buttonAction {
position:relative;
top:0px;
left:0px;
width:40px;
height:40px;
background:transparent url(../pics/aktion.jpg) 0 0 no-repeat;
float:left;
}

.buttonAbt {
position:relative;
top:0px;
left:0px;
top:0px;
left:0px;
width:40px;
height:40px;
background:transparent url(../pics/abt.jpg) 0 0 no-repeat;
float:left;
}

/*** search action: normal ***/
.searchContent {
position:relative;
left:0;
padding:30px;
margin:0;
width:700px;
float:left;
}

.searchNormalContent {
position:relative;
top:0;
left:0;
width:100%;
padding:10px 0 10px 0;
margin:0 0 -1px 0;
border-top:1px solid #161A1E;
border-bottom:1px solid #161A1E;
float:left;
background-color:transparent;
}

/*** search action: brand ***/
.brandActionContainer {
position:relative;
top:0;
left:0;
width:100%;
padding:10px 0 10px 0;
margin:0 0 -1px 0;
border-top:1px solid #161A1E;
border-bottom:1px solid #161A1E;
float:left;
background-color:transparent;
}

.brandInnerContent {
position:relative;
width:621px;
padding:30px 30px 30px 30px;
float:left;
background:#C2C9CC url(../pics/schatten-rechts.gif) top right repeat-y;
}

/*** back button ***/
.actionBackButton {
position:relative;
top:0;
left:644px;
width:60px;
height:20px;
background:transparent url(../pics/back.jpg) 45px 4px no-repeat;
float:left;
padding:0;
margin:0 0 30px 0;
}

/*** twoCols: title text image ***/
.leftInnerContentSmall {
position:relative;
width:320px;
height:220px;
padding:30px 30px 0 30px;
float:left;
background-color:transparent;
}

.leftInnerContentSmall h2 {
border-bottom:1px solid #161A1E;
padding:0 0 5px 0;
}

.smallTextContainer {
position:relative;
width:200px;
float:right;
margin:0;
padding:0;
}

.smallImageContainer {
position:relative;
width:110px;
float:left;
margin:0;
padding:0;
}

.smallImageContainer img {
line-height:0;
margin:0;
padding:0;
}

/*** download ***/
.brandDownloadContainer {
position:relative;
width:621px;
padding:0 30px 0 30px;
float:left;
background:#C2C9CC url(../pics/schatten-rechts.gif) top right repeat-y;
}

.largeDownloadContainer {
position:relative;
width:701px;
padding:0 30px 0 30px;
float:left;
}

.twoColsDownloadContainer {
position:relative;
top:0;
left:0;
margin:0;
width:320px;
display:block;
float:left;
padding:0 30px 0 30px;
}

.downloadContainer {
position:relative;
top:0;
left:0;
margin:0;
width:100%;
display:block;
float:left;
padding:0;
}


.downloadContent {
position:relative;
top:0;
left:0;
padding:5px 0 5px 0;
width:100%;
display:block;
float:left;
margin:0;
border-bottom:1px solid #161A1E;
}

.downloadContent img {
position:relative;
top:0;
left:0;
padding:0 5px 0 0;
margin:0;
border:none;
}

.downloadContent a {
position:relative;
top:0;
left:0;
padding:0;
margin:0;
width:100%;
display:block;
float:left;
}

/*** form ***/
form {
position:relative;
margin:0;
padding:30px;
width:701px;
background-color:#C2C9CC;
float:left;
}

.labelContainer {
position:relative;
width:100%;
float:left;
}

label {
font-weight:bold;
padding:0 5px 5px 0;
float:left;
}

.inputContainer {
position:relative;
width:100%;
float:left;
padding:0 0 30px 0;
border-bottom:1px solid #161A1E;
margin:0 0 10px 0;
}

.selectInput {
position:relative;
width:230px;
float:left;
padding:5px 0 5px 0;
}

textarea,
input {
width:700px;
border:1px solid #161A1E;
background-color:#C2C9CC;
margin:0 0 30px 0;
}

.radio,
input.checkbox {
position:relative;
width:10px;
float:left;
border:none;
margin:0 10px 0 0;
}

.submit {
border:none;
width:auto;
float:right;
cursor:pointer;
font-weight:bold;
padding:0;
margin:0;
}

/*** abtImageTextIframe (give a wine) ***/
.codeWrapperWhite {
width:100%;
float:left;
background-color:#fff;
padding:20px 0 50px 0;
}

.codeWrapperWhite .image {
width:250px;
float:left;
padding:20px 0 20px 20px;
}

.codeWrapperWhite .content {
width:450px;
float:left;
padding:20px 20px 20px 0;
}

.codeWrapperWhite .content h2 {
font-size: 1.8em;
margin:0;
padding:8px 0 5px 0;
}

.codeWrapperWhite .content p {
font-size: 1.5em;
line-height:1.5em;
}

.codeWrapperWhite .content p.small {
font-size: 1em;
line-height:1.5em;
}

.codeWrapperWhite .codeContent {
width:100%;
padding:20px 0 20px 0;
}

/*** abtImageTextIframe (give a wine) ***/
.codeWrapperWhite {
width:815px;
float:left;
background:#fff url(../pics/schleife.jpg) bottom right no-repeat;
padding:100px 0 150px 100px;
}

.codeWrapperWhite .image {
width:250px;
float:left;
padding:20px 0 20px 20px;
}

.codeWrapperWhite .content {
width:450px;
float:left;
padding:20px 20px 20px 0;
}

.codeWrapperWhite .content h2 {
font-size: 1.8em;
margin:0;
padding:8px 0 5px 0;
}

.codeWrapperWhite .content p {
font-size: 1.1em;
line-height:1.5em;
}

.codeWrapperWhite .content p.small {
position:relative;
top:-15px;
width:100%;
float:left;
font-size: 1em;
line-height:1.5em;
}

.codeWrapperWhite .codeContent {
width:100%;
float:left;
}

.codeWrapperWhite .codeContent form {
width:100%;
float:left;
background-color:transparent;
padding:0;

}

.codeWrapperWhite .codeContent form input.codeInput {
width:200px;
float:left;
font-size:2em;
background-color:#fff;
padding:0;
margin:0;
font-family: Arial, Helvetica, "Liberation sans", "Bitstream Vera Sans", sans-serif;
color:#1A2938;
outline:none;
}

.codeWrapperWhite .codeContent form input.codeSubmit {
width:auto;
float:left;
font-size:1em;
background-color:#fff;
border:none;
padding:8px 0 0 20px;
margin:0;
cursor:pointer;
font-family: Arial, Helvetica, "Liberation sans", "Bitstream Vera Sans", sans-serif;
color:#1A2938;
text-decoration:underline;
outline:none;
}

.codeWrapperWhite .codeContent form input.hidden {
display:none;
visibility:hidden;
height:0;
position:absolute;
}

.iFrameWrapper {
position:relative;
margin-bottom:-5px;
width:930px;
height:564px;
}

/* IE6 hack */
* html .iFrameWrapper {
height:538px;
}

* html .codeWrapperWhite {
width:812px;
}

* html .iFrameWrapper {
margin-bottom:0;
}

* html #subNavigation ul.level4 {
visibility:hidden;
display:none;
}

/* IE7 hack */
*+html .iFrameWrapper {
height:548px;
}

*+html .codeWrapperWhite {
width:812px;
}

*+html .iFrameWrapper {
margin-bottom:0;
}

*+html #subNavigation ul.level4 {
visibility:hidden;
display:none;
}

/*** end of css ***/
