body {font-size: 14px; line-height: 1.3em; margin: 0; padding: 0;}
.pagewidth {width: 930px; margin: 0 auto; padding: 0 10px;}
/* automagical clearing */
.pagewidth:after {content: '.'; height: 0; visibility: hidden; clear: both; display: block;}

.pagewidth.divider-LR {background: url(images/bg_trennstriche_LR_transp.png) no-repeat;}
.pagewidth.divider-L  {background: url(images/bg_trennstriche_L_transp.png) no-repeat;}
.pagewidth.divider-R  {background: url(images/bg_trennstriche_R_transp.png) no-repeat;}

a {text-decoration: none; color: #21547d;}
a:hover {text-decoration: underline;}
h1 {font-size: 47px; margin-top: 40px; margin-bottom: 20px;}
h2 {font-size: 36px; line-height: 1.3em; margin: 10px 0;}
.centerline {text-align: center;}
h3 {font-size: 24px; line-height: 1.3em; margin: 10px 0;}
h4 {font-size: 20px; line-height: 1.3em; margin: 10px 0;}
h5 {font-size: 18px; line-height: 1.3em; margin: 0.5em 0}
h6 {font-weight: bold; margin: 0;}
ul {list-style-type: disc; margin: 0.5em 0 0.5em 2em;}
p {margin: 0.5em 0;}
strong {font-weight: bold;}
ul li {margin-left: 1em;}
em {font-style: italic;}

#head {height: 400px; background: url(images/bg_head.png) repeat-x 0 -35px; margin-bottom: 15px;}
#headsplatter {background: url(images/bg_splatter.png) no-repeat right bottom;}
#head .pagewidth {height: 400px; background: url(images/bg_macbook.png) no-repeat bottom right; position: relative;}

#metanavi .pagewidth {padding 0;}
#metanavi {background: black url(images/bg_metanavi.png) repeat-x; margin-bottom: 33px;}
#metanavi ul {float: left; font-size: 12px; list-style: none; margin: 0; border-width: 0 1px; border-style: solid; border-right-color: black; border-left-color: #555;}
#metanavi li {float: left; margin: 0;}
#metanavi li a, #metanavi li span {display: block; float: left; line-height: 29px; color: white; padding: 0 20px; border-width: 0 1px; border-style: solid; border-left-color: black; border-right-color: #555;}
#metanavi li a:hover {text-decoration: underline;}

#metanavi ul li span {position: relative;}
#metanavi ul li span:hover ul {display: block;}
#metanavi ul li span ul {z-index: 100; display: none; float: none; border: 0; position: absolute; background: black; margin-left: -20px; padding: 10px 20px; width: 150px;}
#metanavi ul li span ul li {display: block; float: none;}
#metanavi ul li span input {padding: 4px; margin: 0; border: 0; font-size: 12px;}

#navi {clear: both; font-size: 20px; height: 50px;}
#navi ul, #navi li {list-style-type: none; margin: 0; padding: 0; }
#navi ul {text-align: center;}
#navi li {padding: 7px 5px 7px 0; margin: 0 10px; display: inline;}
#navi a  {padding: 7px 15px 7px 20px;}
#navi li.active, #navi li:hover   {background: url(images/bg_navi-active_right.png) right center no-repeat;}
#navi .active a, #navi li:hover a {color: white; background: url(images/bg_navi-active_left.png) left center no-repeat; text-decoration: none;}

#logo {width: 337px; text-align: center; color: #183069; font-size: 18px; padding-left: 70px; margin-top: 50px;}
#logo img {margin-bottom: 20px; margin-left: -70px;}

#downloadbutton {background: url(images/bg_download_button.png) center no-repeat; width: 214px; height: 59px; padding-top: 8px;
                 text-align: center; color: white; position: absolute; top: 280px; left: 690px; /*padding: 10px 0; margin: -75px 0 0 680px;*/}
#downloadbutton strong {font-size: 24px; font-weight: bold; padding-right: 20px; background: url(images/icon_download.png) no-repeat right;}
#downloadbutton a {color: white;}

.pagewidth.shadowed {background: url(images/bg_block_klein.png) bottom no-repeat; padding-bottom: 20px;}
.pagewidth.shadowBigTop {background: url(images/bg_block_big_reverse.jpg) top no-repeat; padding-top: 10px;}
.pagewidth.shadowBigBottom {background: url(images/bg_block_big.jpg) bottom no-repeat; padding-bottom: 20px;}
.toplink {display: block; margin: 35px 0; background: url(images/bg-block_linie.png) repeat-x top; padding-top: 3px; }
.toplink:after {content: '\2191  nach oben'; font-size: 12px; text-align: right; width: 950px; margin: 0 auto; display: block;}

/* columns */
.one {}
.one-thirds {float: left; width: 287px; padding: 0 10px; text-align: left;} 
.one-thirds.left   {padding-right: 33px; width: 259px;}
.one-thirds.middle {padding: 0 33px;     width: 259px;}
.one-thirds.right  {padding-left: 33px;  width: 259px;}

.two-thirds {float: left; width: 593px; padding: 0 10px; text-align: left;}
.two-thirds.left {padding-right: 33px; width: 585px;}
.two-thirds.right {padding-left: 33px; width: 585px;}

.one-half {float: left; width: 444px; padding: 0 10px; text-align: left;}
.one-half.left {padding-right: 33px; width: 422px;}
.one-half.right {padding-left: 33px; width: 422px;}
.one-fourth {float: left; width: 232px;}

#Features {text-align: center;}
#Features .shadowed {padding-bottom: 0;}
#Features .one-thirds {border: solid white; border-width: 0 1px; text-align: center; height: 180px; margin-top: 20px;}
#Features .one-thirds:first-child {border-left-color: transparent;}
#Features .one-thirds:last-child {border-right-color: transparent;}

#Features .one-thirds {position: relative;}
.feature {position: absolute; top: 0; left: 10px; height: 100%; padding-right: 10px;}

#allFeatures {display: none;}

#screenshots {text-align: center;}
#screenshots h5 {margin-bottom: 35px;}
#screenshots .one-thirds {text-align: left;}
#screenshots .two-thirds {margin-bottom: 21px;}
#screenshots .one-seventh img {width: 100%;}

/*
dl.tabbed {margin-top: 20px;}
dl.tabbed .padding {padding: 0 20px; background: url(images/bg_tabbed.png) no-repeat left bottom; margin: 0 -10px;}
dl.tabbed dt {float: left; color: red; border: 1px solid; border-bottom: 0; padding: 0 1em; line-height: 20px; position: relative; left: 20px;}
dl.tabbed dd {float: right; width: 100%; margin-top: 20px; margin-left: -100%; position: relative;}
*/
dt {font-weight: bold;}
dd {margin-bottom: 1em;}

#footer {background: url(images/bg_footer.png) repeat-x top; padding-top: 15px; padding-bottom: 21px; border-top: 1px solid #d8d8d8}
#subfooter {background: url(images/bg_subfooter.jpg) repeat-x bottom; color: #ccc; padding-top: 15px; padding-bottom: 21px;}

.block.module {margin: 30px 0;}
.module .pagewidth {background: url(images/bg_block_reverse_klein.png) no-repeat; padding: 10px; position: relative;}
/*.module:before {content: " "; display: block; background: url(images/bg_module_top.png) no-repeat; height: 5px; width: 950px; margin: 0 auto;}
.module:after {content: " "; display: block; background: url(images/bg_module_bottom.png) no-repeat; height: 5px; width: 950px; margin: 0 auto;}*/
.module .icon {float: left; width: 100px; text-align: center;}
.module .info, 
.module .details,
.module .notice,
.module .download,
.module .showdetails {width: 620px; padding-left: 100px;}
.module .buttons {position: absolute; top: 0; right: 20px; width: 126px; padding-top: 20px;}
.module .buttons img {margin: 5px 0;}
.module .notice div {margin: 10px 0; border: 1px solid #ccc; padding: 5px 10px; background: white;}

.hideNoJS {display: none;}

.tabbed .tabs {height: 48px; font-size: 18px; margin-top: 20px;}
.tabbed .tabs a {cursor: pointer; color: #143869; background: url(images/bg-border-tab-white.png) no-repeat; line-height: 48px; float: left; width: 187px; text-align: center; display: block;}
.tabbed .tabs a.active {color: white; background: url(images/bg-border-tab-blue.png) no-repeat;}
.tabbed .contentborder {margin: 0 -10px; padding: 10px; background: url(images/bg_block_big_reverse.jpg) no-repeat left top;}

/*
#screenshots .screenshot {margin-bottom: 20px;}
#screenshots .screenshot img {float: left; width: 593px;}
#screenshots .screenshot .caption {display: none;}
#screenshots .screenshot:after {content: '.'; height: 0; visibility: hidden; clear: both; display: block;}
#screenshots .big {text-align: left;}
#screenshots .big:after {content: '.'; height: 0; visibility: hidden; clear: both; display: block;}
#screenshots .big .screenshot .caption {display: none;}

#screenshots .previews .screenshot {float: left; width: 121px; margin-right: 10px;}
*/

.screenshot .big img {position: absolute; bottom: 0; margin-left: 20px;}
.screenshot .big, 
#screenshotshow {background: url(images/bg_screenshot.jpg) bottom no-repeat; height: 350px; position: relative; margin-bottom: 20px;}
#screenshotpreviews .big {display: none;}
.screenshot .small {display: none;}
.screenshot .small img {width: 100%;}
#screenshotpreviews {padding-left: 10px;}
#screenshotpreviews .small {display: block; float: left; width: 119px; margin-right: 10px; text-align: center; border: 1px solid transparent;}

.textbox h3 {text-align: left;}
.textbox.bottom {background: url(images/bg_textbox-bottom.png) no-repeat bottom; width: 402px; position: absolute; right: 35px; top: 50px;}
.textbox.top    {background: url(images/bg_textbox-top.png) no-repeat top; padding: 15px 25px 15px 45px;}

/* */
/*h2, h3, h4 {text-align: center;}*/
.one {padding: 0 10px 20px 10px; font-size: arger;}
.one-thirds h2, .one-thirds h3 {text-align: left;}

.one-thirds .news {background: url(images/icon_star.png) no-repeat top left; padding: 5px 0 0 25px;}
.community {background: url(images/icon_community.png) no-repeat; padding: 0 0 0 30px;}

.news .inline {display: none;}

.error {color: #c00;}
.readonly {border-color: transparent; border-style: solid; border-width: 2px; background: transparent; font-weight: bold;}

.carousel {overflow: hidden; position: relative;}
.carousel .nav {height: 28px; clear: both; text-align: center; position: relative;}
.carousel .nav img {padding: 0 10px; vertical-align: bottom;}
.carousel .navleft {/*position: absolute; left:   10px; top: 0;*/ cursor: pointer; z-index: 500;}
.carousel .navright {/*position: absolute; right: 10px; top: 0;*/ cursor: pointer; z-index: 500;}
.wagons {width: 999999px; position: relative; left: 0;}
.wagon {float: left;}
.projekt {width: 259px; text-align: center; padding-bottom: 1em;}
.reseller {width: 259px;}
.newswagon {width: 259px; margin-bottom: 1em;}


#footer {margin-top: 60px;}
#footer, #footer a {color: #183069;}
#footer h4, #moremodules h4 {padding-left: 40px; line-height: 35px; background-repeat: no-repeat;}
#footer ul, #moremodules p {list-style-type: none; margin-left: 40px;}

textarea {resize: none;}
textarea, input, select {border: 1px solid #b5c3d3; font-family: sans-serif; font-size: 14px; padding: 3px; }
input[type=image] {border: transparent;}
input[readonly], textarea[readonly] {border: transparent; background: transparent; padding: 0;}

.pager {text-align: center;}
