/* ################################################################
#
#  Info
#
################################################################ */

/* ---------------------------------------------------------------------------------------------
-
- ...box = äussere Box für Maße
- ...box2 = innere Box für Abstände (IE Box-Bug)
-
--------------------------------------------------------------------------------------------- */

/* ################################################################
#
#  Globals
#
################################################################ */

body, div { margin: 0px; padding: 0px;}
table, input, textarea, select {font-size: 100%; }
td {vertical-align: top;}
form {display: inline; margin: 0px; padding: 0px;}
.clear {clear: both;}
.bold {font-weight: bold;}
.nowrap {white-space: nowrap;}
ul, dl {margin: 0px;}
a img {border: 0px;}
.right {float: right;}
ul.contentlist li {margin-bottom: 2px;}

.in, .out {padding-left: 14px;}
.in {background: url(../img/icon_in.gif) no-repeat 2px 5px;}
.out {background: url(../img/icon_out.gif) no-repeat 2px 5px;}

/* ################################################################
#
#  MainNav2Box
#
################################################################ */

#mainnav2box a, #mainnav2spanner {padding: 3px; font-size: 90%;}
#mainnav2box { background: #000040; color: #ffffff;}
#mainnav2box a {color: #ffffff; display: block; float: left; font-weight: bold; padding-left: 15px; padding-right: 15px; }
#mainnav2box a:hover, #mainnav2box a:focus {color: #000040; background: #dddddd; }
#mainnav2boxdivider {background: url(../img/bg_mainvav2left.gif) repeat-x; height: 2px; font-size: 0px; }

/* ################################################################
#
#  Measurements and Positions
#
################################################################ */

#contentarea {height: 100%; width: 1004px; margin-left: auto; margin-right: auto;}
#mainborder {width: 1001px; height: 100%; border-left: 1px solid #8888aa; border-right: 1px solid #8888aa; border-bottom: 1px solid #8888aa; background: #000040; padding-bottom: 8px; text-align: center;}
#mainbox {width: 980px; height: 100%; margin-left: auto; margin-right: auto;}
#spannerrow1 {width: 253px; height: 1px;}																/* Logo */
#spannerrow2 {width: 490px; height: 1px;}																/* Mittlere Spalte */
#spannerrow3 {width: 242px; height: 1px;}																/* Infospalte */
#logobox {height: 100px;}
#bannerbox {padding: 0px; overflow: hidden; text-align: right; height: 76px; white-space: nowrap;}
#mainnavbox a, #mainnavspanner {padding: 5px;}
#maincol {padding: 15px 14px 15px 14px; height: 450px; position: relative;}
#infocol, #infocolleft  {padding: 15px 5px 0px 5px;}
#copyright {width: 980px; color: #cccccc; text-align: right; margin-top: 5px;}
h1 {margin: 0px 0px 10px 0px;}
h2 {padding: 1px 5px 1px 0px; }
h2, h3 {margin: 0px 0px 5px 0px;}
.groupbox {margin-bottom: 10px;}
.picleft {float: left; margin-right: 10px;}
.picright {float: right; margin-left: 10px;}
.contentline {margin-bottom: 4px;}
dt {border-bottom: 1px solid #eeeebb;}
dd {margin-bottom: 10px; margin-left: 20px; border-left: 1px solid #eeeebb; padding: 5px 0px 5px 5px;}

/* ################################################################
#
#  Aligns
#
################################################################ */

body {text-align: center;}
#contentarea {text-align: center;}
#bannerbox {text-align: center;}
#mainbox {text-align: left;}
.alignright {text-align: right;}

/* ################################################################
#
#  Fonts
#
################################################################ */

#contentarea, textarea, form {font-family: Verdana, Arial, Tahoma; font-size: 11px; }
h1 {font-size: 150%;}
h2 {font-size: 120%;}
h3 {font-size: 110%;}
.date, .copyright, .subinfo {font-size: 80%;}
h1 .date {font-size: 70%;}
.detailtext .copyright {font-size: 80%; margin-top: 4px;}
.detailtext .copyright a {font-weight: normal;}
.winner {font-weight: bold; color: #313131; letter-spacing: 1px; text-transform: uppercase;}

/* ################################################################
#
#  Colors and Decorations
#
################################################################ */

body { background: url(../img/bg_main.jpg) repeat-x #424242;}
a {color: #002080; text-decoration: none;}
a:hover, a:focus {color: #804000;}
.indexlink {background: url(../img/icon_arrow_red.gif) no-repeat; padding-left: 7px; display: block; margin: 3px 0px 3px 0px; }
a.morelink {background: url(../img/icon_arrow_red.gif) no-repeat; padding-left: 7px; }

#logobox {background: #442f06; border-right: 1px solid #002080;}

#topnavbannerbox {background: #424242;}
#topnavbox { background: #dddddd; border-bottom: 1px solid #002080; }
#topnavbox a {color: #002080; display: block; float: right; border-left: 1px solid #002080; font-weight: bold; padding: 5px 15px 5px 15px; }
#topnavbox a:hover, #topnavbox a:focus {color: #dddddd; background: #002080;}
#topnavspanner {padding: 5px;}
#iconbox {float: right; border-left: 1px solid #002080; padding: 3px 0px 2px 10px; }
#iconbox a {display: inline; float: none; border: none; padding: 0px; margin-right: 10px;}
#iconbox a:hover, #iconbox a:focus {background: none;}

#mainnavbox { background: url(../img/bg_blue.gif) repeat-x; }
#mainnavbox a {color: #ffffff; display: block; float: left; border-right: 1px solid #00cfcf; font-weight: bold; padding-left: 15px; padding-right: 15px; }
#mainnavbox a:hover, #mainnavbox a:focus {color: #000040; background: #dddddd;  }
#mainnavbox a.active {color: #ffffff; background: #000040;  }

#maincol {background: #ffffff;}
#maincol a {color: #0040a0;}
#maincol a:hover, #maincol a:focus {color: #804000;}
#maincol .copyright a {font-weight: normal;}
#maincol h2 a {font-weight: bold;}

#infocol {background: #cccccc;}
#infocolleft {background: #cccccc;}
h1 {color: #800000;}
h2 {color: #800000;}
h3, .date {color: #800000; margin: 0px;}
.contentdivider {height: 1px; background: #ccccaa; clear: both; margin-bottom: 7px; margin-top: 7px;}
.teaserbox {height: 100px; position: relative;}
.teaserbox .copyright {position: absolute; bottom: 0px; left: 240px;}
dt {font-weight: bold;}

/* ################################################################
#
#  Detailbox
#
################################################################ */

.detailbox {margin: 0px 0px 10px 0px; border: 1px solid #400000;}
.detailbox h2, .detailbox h2 a, .detailbox .topic, .detailbox .topic a {background: #0088aa; color: #ffffae; border-bottom: 1px solid #400000; font-weight: bold; padding: 2px 5px 2px 5px; margin: 0px;}
.detailbox h2 a {margin: 0px; padding: 0px; border-bottom: 0px;}
.detailbox h3 {font-size: 100%; margin-bottom: 5px;}
.detailtext, .detailtexthighlight, .detailtexttotal { padding: 4px 5px 5px 5px; font-size: 100%; }
.detailtext { background: #eeeeee;}
.dyk {background: url(../img/bg_didyouknow.jpg) no-repeat right #eeeeee;}
.detailmorebox {padding: 2px 5px 2px 5px; text-align: right; background: url(../img/bg_grey.gif) repeat-x; border-top: 1px solid #400000; margin-top:0px;}
.detailmorebox a { background: url(../img/icon_arrow_yellow.gif) no-repeat; padding-left: 10px; text-decoration: none; color: #ffffff; font-weight: normal; font-family: Arial;}
.detailmorebox a:hover, .detailmorebox a:focus { color: #ffffaa; }

.detailtexthighlight { background: #400000; color: #ffffff; font-weight: bold;}
.detailtexttotal { background: #f8f8ee;}
// .detailtextfacebook {padding: 0px; font-size: 200%; background: #ffffff;}
.divider {background: #ccccaa; font-size: 1px; padding: 0px; margin: 0px; }
.detailboxaddon {background: #bfbfbf; border-top: 1px solid #400000; margin: 0px; font-size: 2px;}

.width1 {width: 1%;}
.bullet {margin-left: 10px;}
#maincol a.sortlink {background: url(../img/icon_sort.gif) no-repeat; padding-left: 9px; color: #ffffad;}
#maincol a.sortlink:hover, #maincol a.sortlink:focus {color: #ffff80;}


/* ################################################################
#
#  Rollbox
#
################################################################ */

.rollbox {margin: 0px 0px 10px 0px; border: 1px solid #ccccaa;}
.rolltopicbox {background: #0088aa; margin: 0px; height: 18px;}
.rolltopicbox2 {background: url(../img/bg_rolltopic_shadow.gif) no-repeat left bottom; padding-bottom: 10px; margin-bottom: 8px; margin-top: 15px;}
.rolltopicbox .topic {background: #ccccaa; color: #222222; font-weight: bold; display: block; float: left; padding: 2px 0px 2px 0px; width: 106px; text-align: center; font-family: Arial;}

#maincol .rolltopicbox div {height: 18px; background: url(../img/bg_rolltopic.gif) repeat-y; float: left; width: 119px;}
#maincol .rolltopicbox div.active {background: url(../img/bg_rolltopicactive.gif) repeat-y;}
#maincol .rolltopicbox a {color: #ffffae; font-weight: normal; display: block; padding: 2px 0px 2px 0px; text-align: center; font-family: Arial;}
#maincol .rolltopicbox a.active {font-weight: bold;}

.rollbox .contentbox { position: relative; padding: 0px; font-size: 100%; height: 100px;}
.rollbox .contentbox .textbox h2 {padding-top: 5px;}
.rollbox .contentbox .copyright {position: absolute; bottom: 1px; left: 240px;}

/* ################################################################
#
#  Home
#
################################################################ */

.lastblog {margin-top: 8px;}
.topbox {height: 102px; position: relative; }
.topbox .copyright {position: absolute; bottom: 3px; left: 240px;}
#homenews {height: 268px; clear: both; margin-bottom: 8px; margin-top: 8px; position: relative;}
.homenewstop {width: 440px; float: left; margin-right: 15px;}
.homenewstopdivider {height: 10px;}
.homenewselse {width: 245px; float: left;}
.homenewselsedivider {font-size: 7px;}
#homenewslink {position: absolute; bottom: 0px; right: 0px;}
#homenewslink a {color: #ffffae; padding: 4px 8px 4px 8px; background: #0088aa; display: block;}
#homenewslink a:hover {background: #000040; color: #ffff00}
.update {text-transform: uppercase; font-weight: bold;}
.hometriplet {width: 230px; float: left; margin-bottom: 7px; margin-top: 3px; overflow: hidden;}
.hometriplet h2 {margin-bottom: 0px;}
.hometripletdivider {width: 13px; float: left;}

.entry-title {display: none;}
.entry-content {}
.ecbody {background: #ffffff; text-align: left; width: 100%; font-family: Verdana, Arial, Tahoma; font-size: 11px; padding-bottom: 5px;}
.homenewstop .ecbody {background: #eeeeee;}

.eventpromobox {height: 290px;}

/* ################################################################
#
#  MainLinkBox
#
################################################################ */

.mainlinkbox {background: #eeeeee; border: 1px solid #ccccaa; clear: both; margin-bottom: 10px; margin-top: 10px; clear: both; padding: 4px 5px 5px 5px; }
.mainlinkboxleft {width: 49%; float: left;}
.mainlinkboxright {width: 49%; float: left;}

/* ################################################################
#
#  Gallery
#
################################################################ */

#galleryphoto {position: relative; background-repeat: no-repeat; background-position: center;}
.galleryphotospanner {width: 700px; height: 525px;}
#galleryphotopaging {width: 700px; height: 525px;position: absolute; top: 0px; left: 0px;}
a#galleryphotonext, a#galleryphotoback {position: absolute; top: 100px; width: 50px; background: #800000; color: #ffffff; font-weight: bold; padding: 2px; text-align: center; filter:Alpha(opacity=60, finishopacity=60, style=2); display: none;}
a#galleryphotonext:hover, a#galleryphotonext:focus, a#galleryphotoback:hover, a#galleryphotoback:focus {color: #ffff00;}
#galleryphotonext {right: 0px;}
#galleryphotoback {left: 0px; }

.galleryteaser {float: left; border: 1px solid #400000; margin-right: 4px; margin-bottom: 3px;}
.gallerypaging {margin-bottom: 5px;}
.gallerynext {float: right;}
.galleryback {float: left;}

.galleryphotobox .phototext {position: relative; padding-left: 40px; padding-top: 8px;}
.gallerybuttonnext {position: absolute; top: 11px; right: 0px;}
.gallerybuttonback {position: absolute; top: 11px; left: 0px;}

/* ################################################################
#
#  Photobox
#
################################################################ */

.gallerybox, .photobox, .galleryphotobox {background: #800000; padding: 1px; color: #ffffff; font-family: Tahoma;}
.galleryphotobox {padding: 5px;}
.galleryphotobox2 {padding: 3px 2px 2px 2px; background: #D5A800;}
.photobox {float: right; margin-left: 14px; margin-bottom: 10px; width: 238px; position: relative;}
.photobuttonnext {float: right; z-index: 100; margin-top: 7px; position: relative;}
.photobuttonback {float: left; z-index: 100; margin-top: 7px; position: relative;}
.gallerybox {float: left; margin-right: 2px; margin-top: 2px;}
.phototext {padding: 4px 5px 2px 5px; background: url(../img/bg_red.gif) repeat-x; z-index: 1; position: relative;}
.phototext .copyright {margin-top: 4px; position: relative;}
#maincol .phototext .copyright a {color: #ffffaa; font-weight: normal;}
#maincol .phototext .copyright a:hover, .phototext .copyright a:focus {color: #ffff00; font-weight: normal;}

/* ################################################################
#
#  Slidebox
#
################################################################ */
.slidebox {padding: 1px; font-family: Tahoma; margin-bottom: 10px; position: relative; background: #eeeeee; border: 1px solid #ccccaa;}
.slideboxtext {height: 198px; position: relative;}
.slidetext {padding: 4px 5px 2px 5px; z-index: 1; font-size: 12px;}
.slideboxtext .photobuttonnext {z-index: 100; position: absolute; bottom: 0px; right: 0px;}
.slideboxtext .photobuttonback {z-index: 100; position: absolute; bottom: 10px; left: 250px; display: none;}
.slideboxtext .copyright {margin-top: 20px; position: relative;}



/* ################################################################
#
#  Forms
#
################################################################ */

form.contact {display: block; margin: 0px;}
.contactbox { margin-bottom: 10px;}
.contactbox2 {}
label.contact {width: 120px; display: block; float: left; padding-top: 4px; font-weight: bold;}
input.contact, textarea.contact {width: 570px; border: 1px solid #444444; padding: 2px; background: #eeeeff;}
textarea.contact {height: 100px;}
#submitbox {text-align: right; }
#submitbutton {border: 1px solid #444444; background: #eeeeff;}

/* ################################################################
#
#  Impressum
#
################################################################ */

h2.impressum {clear: both; float: left; border-bottom: 2px solid #ccccaa; width: 300px; margin-right: 30px;}
.roles {width: 350px; float: left; margin-bottom: 24px; padding-top: 5px;}

/* ################################################################
#
#  Sitemap
#
################################################################ */

h2.sitemap {clear: both; font-size: 130%; margin-bottom: 14px;}
#maincol h2.sitemap a {color: #800000;}
div.sitemapsubnav {margin-left: 20px;}
h3.sitemap {clear: both; float: left; border-bottom: 2px solid #ccccaa; width: 300px; margin-right: 30px;}
.navtext {width: 400px; float: left; padding-top: 5px;}
div.subnav3 {float: left; width: 33%;}
div.subnav4 {float: left; width: 24%;}

/* ################################################################
#
#  TruckBioWizard
#
################################################################ */

#formmain input, #forminfo input, #formmain textarea, #forminfo texarea {border: 1px solid #cccccc;}
input#headline {color: #800000; border: 1px solid #cccccc; width: 461px;}
input#headlinefull {color: #800000; border: 1px solid #cccccc; width: 710px;}
input#teaser, textarea#trucktext {width: 448px;}
textarea#trucktext {height: 500px; overflow: auto;}
input#photourl {width: 236px; margin-top: -1px; background: #800000; color: #ffffff; clear: both;}
input#phototext {width: 224px; background: #800000; color: #ffffff;}
#photoselectorbutton {float: right; font-size: 170%; width: 10px; cursor: pointer; text-align: center;}
#photoselector {position: absolute; background: #ffffff; border: 1px solid #cccccc; top: 10px; right: 1px; padding: 5px; width: 150px; display: none;}
#maincol .phototext .copyright #photoselector a {color: #002080; display: block; float: left; width: 100%;}
#photoselector a:hover {background: #ffff00;}
input#photocopyright {width: 185px; background: #800000; color: #ffffff;}
input#photocopyrighturl {width: 224px; background: #800000; color: #ffffff;}
input.titlename {width: 448px;}
input.titledriver {width: 248px;}

#forminfo input  {background: #eeeeee;}
#forminfo .full {width: 222px;}
#forminfo .sharename {width: 114px;}
#forminfo .shareinfo {width: 222px; margin: 0px;}
#forminfo .shareinfo2 {width: 104px; margin: 0px;}
#forminfo .sharedate {width: 50px;}
.addform {float: right; cursor: pointer;}

#formpost {display: none;}

/* ################################################################
#
#  Collector
#
################################################################ */
.collectorinfobox {border-top: 1px solid #ccccaa; border-bottom: 1px solid #ccccaa; padding: 5px 0px 5px 0px; margin-bottom: 10px;}


/* ################################################################
#
#  Calendar
#
################################################################ */

.calmonthbox {font-weight: bold; font-size: 150%; margin-bottom: 12px; float: right;}
.calbox {border-top: 1px solid black; border-right: 1px solid black; width: 100%;}
.calday, .caltopic {width: 14%; border-bottom: 1px solid black; border-left: 1px solid black;}
.caltoday {background: #ffffcf;}
.caltopic {background: #0088aa; color: #ffffae; text-align: center; font-weight: bold; padding: 2px 5px 2px 5px;}
.calday {height: 126px; }
.caldaytopic {padding: 2px 5px 2px 5px; background: #cccccc; font-weight: bold; text-align: right;}
.caldaytext {padding: 2px 5px 2px 5px; font-size: 90%; font-family: Arial;}
.caldaytext a {font-weight: bold;}
.pagingbackicon {margin-right: 10px; margin-bottom: 1px;}
.pagingnexticon {margin-left: 10px; margin-bottom: 1px;}

/* ################################################################
#
#  SocNets
#
################################################################ */
#socnetbox {margin-top: 30px; }

/* ################################################################
#
#  Tabelle - Events, Combo
#
################################################################ */

.tablebox caption {color: #800000; font-size: 120%; padding: 1px 5px 1px 0px; margin: 0px 0px 5px 0px; font-weight: bold; text-align: left;}
.tablebox {width: 100%;}
.tabletopic5, .tabletopic10, .tabletopic15, .tabletopic20, .tabletopic25, .tabletopic30, .tabletopic40, .tabletopic50, .tabletopic60, .tabletopic70, .tabletopic80, .tabletopic90 {background: #0088aa; color: #ffffae; font-weight: bold; padding: 2px 5px 2px 5px; border-bottom: 2px solid black;}
.tabletopic5 {width: 5%;}
.tabletopic10 {width: 10%;}
.tabletopic15 {width: 15%;}
.tabletopic20 {width: 20%;}
.tabletopic25 {width: 25%;}
.tabletopic30 {width: 30%;}
.tabletopic40 {width: 40%;}
.tabletopic50 {width: 50%;}
.tabletopic60 {width: 60%;}
.tabletopic70 {width: 70%;}
.tabletopic80 {width: 80%;}
.tabletopic90 {width: 90%;}
.tablecell, .tablecellcenter {padding: 2px 5px 2px 5px;}
.tablecellcenter {text-align: center;}

/* ################################################################
#
#  Interview
#
################################################################ */
.interviewpretext {}

.interviewer, .interviewee, .intervieweefirst {float: left; font-weight: bold; margin-right: 4px; font-style: italic; color: #800000;}
.interviewer, .interviewertext, .intervieweefirst, .intervieweetextfirst {margin-top: 10px;}
.interviewee, .intervieweetext {margin-top: 2px;}

/* ################################################################
#
#  Paging
#
################################################################ */
.back, .next {display: block;}
.next {float: right; background: url(../img/icon_next.gif) no-repeat right 2px; padding-right: 10px;}
.back {float: left; background: url(../img/icon_back.gif) no-repeat 0px 2px; padding-left: 9px;}
.pages {text-align: center;}

/* ################################################################
#
# Login
#
################################################################ */
#loginForm {background: #eeeeee; border: 1px solid #ccccaa; clear: both; margin-bottom: 10px; margin-top: 10px; clear: both; padding: 4px 5px 5px 5px; display: block; padding: 20px;}
#loginForm label {display: block; width: 150px; float: left; clear: both; font-size: 110%; font-weight: bold;}
input.loginfield {width: 250px; float: left; font-size: 120%; }
select.loginfield {width: 150px; float: left; font-size: 120%; }
#loginForm #loginButton {clear: both; font-size: 120%;}
#loginFormContainer {}
.loginfieldrow {margin-bottom: 8px;}
.submitrow {width: 300px; text-align: right; clear: both;}

/* ################################################################
#
#  QS
#
################################################################ */

.qsbox {clear: both;}
.checkbox {background: #800000; color: #ffffdd; float: right; padding: 5px; margin-right: 25px;}
.qsok {background: #008000; text-align: left; padding: 4px; color: #ffffff; margin-bottom: 1px;}
.qslesserror {background: #ff8000; color: #000000; font-weight: bold; padding: 4px; margin-bottom: 1px;}
.qserror {background: #800000; color: #ffff00; font-weight: bold; padding: 4px; margin-bottom: 1px;}

/* ################################################################
#
#  Chart
#
################################################################ */
.chartentry {height: 20px;}
.chartpos {float: left; width: 20px;}
.charttendency {float: left; width: 16px; margin-top: 2px;}
.chartname {float: left; margin-right: 4px;}
.chartlast {float: left; font-size: 10px; color: #888888;}


/* ################################################################
#
#  Shop
#
################################################################ */

.shopteaserbox {height: 100px; position: relative;}
.shopteasertext {height: 50px;}
.shoptext {margin-bottom: 30px;}
.shoppricebox {float: right; height: 50px; color: #888888; background: #dddddd; width: 350px;}
.shoppriceinnerbox {padding: 5px;}
.shopregularprice {text-decoration: line-through;}
.shopsaleprice {font-size: 120%; color: #800000; font-weight: bold;}
.shopfewleft {margin-top: 8px; color: #a04444; font-size: 9px;}
.cartmaxamount {float: right; color: #a04444; font-size: 9px; width: 120px; font-weight: bold; margin-top: 1px;}
.shopcartform {float: right; text-align: right;}
label.cartamount {color: #313131; font-size: 9px; margin-right: 5px;}
select.cartamount {color: #313131; font-size: 9px; background: #dddddd; width: 50px; border: 1px solid #888888; padding: 0px; margin-right: 1px;}
.shopamountbox {height: 20px;}
.cartbutton {text-align: center; font-size: 10px;}

.carttable {width: 100%;}
.carttable th {background: #dddddd;}

.orderformbox {color: #313131; background: #dddddd; }
.orderforminnerbox {padding: 10px;}
.orderform {}
.orderfieldbox {margin-bottom: 5px;}
.orderform label {width: 120px; float: left; display: block; margin-top: 3px; font-size: 12px; font-weight: bold;}
.orderform input, .orderform textarea {width: 300px; display: block; color: #313131; background: #eaeaea; border: 1px solid #888888; font-size: 12px;}
.orderform input:focus, .orderform textarea:focus {background: #f4f4f4;}
.orderform textarea {height: 50px; font-size: 11px;}
.orderbutton {text-align: center; font-size: 11px;}

