﻿/* CSS Document 
margin: oben rechts unten links
*/

html { height: 100.1%; }

body {
	height: 100%;
	margin-top: 0px;
	background: url("./images/mainBG.png") #FFFFFF repeat-x;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

div#mainBGContainer {
	margin: auto;
	margin-top: 0px;
	padding-top: 40px;
	background: url("./images/BGab.png") #FFFFFF no-repeat;
	min-height: 724px; /** kennt IE nicht deshalb important-Lösung */
	height:auto !important;
	height:724px;
	width: 1279px;
}

div#mainContainer {
	
}

div#startContainer {
	position:absolute;
	background: url("./images/startNew.png") no-repeat;
	width: 1104px;
	height: 267px;
	margin-left: -100px;
	margin-top: 0px;
}

div#upperShadow {
	margin:auto; /** center **/	
	background: url("./images/topShadow.png") no-repeat;
	height: 18px;
	width: 1030px;
}

div#mainShadow {
	margin:auto; /** center **/
	background: url("./images/mainShadow.png") repeat-y;
	padding-left: 2px;
	width: 1047px;
}

div#bottomShadow {
	margin:auto; /** center **/
	background: url("./images/bottomShadow.png") no-repeat;
	height: 22px;
	width: 1046px;
}

div#footer {
	margin:auto; /** center **/
	background: url("./images/footer.png") #FFFFFF no-repeat;
	height: 25px;
	width: 1001px;
	margin-top: 0px;
	margin-left: 0px;
	padding-top:10px;
}

div#oceanFooter {
	margin:auto; /** center **/
	background: url("./images/oceanFooter.png") no-repeat;
	width:1279px;
	height: 159px;
}

div#oceanBG {
	position:static;
	background: url("./images/ocean.png") repeat-x;
	height: 159px;
	width: 100%;	
}

div#ships {
	position:absolute;
	background: url("./images/ships.png") no-repeat;
	width: 125px;
	height: 93px;
	margin-left: 1175px;
	margin-top: -28px;
}

/*
div#graficBottom {
	position:fixed;
	background: url("./images/ocean.png") repeat-x;
	height: 159px; 
	left:0px;
	width: 100%;
	z-index: -1;
}

div#ocean {
	margin: auto;
	background: url("./images/BGocean.png") no-repeat;
	width: 1279px;
	height: 227px;
	margin-top: -10px;
}*/


div#mainBox {
	margin:auto; /** center **/
	width: 1005px;
	
}

div#header {
	margin:auto; /** center **/
	background: url("./images/Header.png") no-repeat;
	margin-left: -5px;
	height: 247px;
	width: 1030px;
}

div#contentBG {
	margin:auto; /** center **/
	margin-top: 0px;
	background: url("./images/ContentBG.png") #edf4f9 repeat-x;
	margin-left: 0px;
	min-height: 501px; /** kennt IE nicht deshalb important-Lösung */
	height:auto !important;
	height:501px;
	width: 1001px;
	overflow: hidden;
	
}

.footerBox {
	padding-left: 140px; 
	padding-top: 22px;
}

.languageLink {
	position:absolute;
	width: 32px;
	height: 32px;
	margin-top: -10px;
}

.english {
	margin-left: 955px;
	background: url("./images/english.png") no-repeat;
}

.german {
	margin-left: 920px;
	background: url("./images/german.png") no-repeat;
}

div#energyBall {
	position: absolute;
	margin-top: -40px;
	margin-left: -20px;
	width: 337px;
	height: 275px;
	background: url("./images/EnergyballHover.png") no-repeat;
}

div#sideMenuImage {
	background: url("./images/SidemenuGraphic.png") no-repeat;
	width: 150px;
	height: 298px;
}

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

	Content Boxes
	 
************************/

.box {
	background-color: transparent;
	overflow:hidden;
	padding-bottom: 15px;
}

.one {
	margin-left: 15px;
}

.two {
	margin-left: 180px;
}

.three {
	margin-left: 345px;
}

.four {
	margin-left: 510px;
}

.five {
	margin-left: 675px;
}

.six {
	margin-left: 840px;
}

.o1 {
	width: 150px;
}

.o2 {
	width: 315px;
}

.o3 {
	width: 480px;
}

.o4 {
	width: 645px;
}

.o5 {
	width: 810px;
}

.o6 {
	width: 975px;
}

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

	Content Elements
	 
************************/

div#content {
	
	overflow: hidden;
}

.divContentBoxA {
	padding-bottom: 12px;
}

.divContentBoxBig {
	width: 480px;
	height: 70px;
}

.greenContentBoxBig {
	background: url("./images/boxPartnerBigLink.png") no-repeat;
}

.greenContentBoxBig:hover {
	background: url("./images/boxPartnerBigHover.png") no-repeat;
}

.greenContentBoxBig:hover .subs {
	display:block;	
}

.redContentBoxBig {
	background: url("./images/boxSoftwareBigLink.png") no-repeat;
}

.redContentBoxBig:hover {
	background: url("./images/boxSoftwareBigHover.png") no-repeat;
}

.redContentBoxBig:hover .subs {
	display:block;	
}

.orangeContentBoxBig {
	height: 86px;
	padding-top: 10px;
	background: url("./images/boxOrangeBigLink.png") no-repeat;
}

.orangeContentBoxBig:hover {
	background: url("./images/boxOrangeBigHover.png") no-repeat;
}

.orangeContentBoxBig:hover .subs {
	display:block;	
}


.softwareContentBox_middle {
	background: url("./images/boxSoftwareMiddleLink.png") no-repeat;
	width: 315px;
	height: 70px;
}

.softwareContentBox_middle:hover {
	background: url("./images/boxSoftwareMiddleHover.png") no-repeat;
}

.softwareContentBox_middle:hover .subs {
	display:block;	
}

.softwareContentBox_small {
	background: url("./images/boxSoftwareSmallLink.png") no-repeat;
	width: 150px;
	height: 70px;
}

.softwareContentBox_small:hover {
	background: url("./images/boxSoftwareSmallHover.png") no-repeat;
}

.softwareContentBox_small:hover .subs {
	display:block;	
}

/** Übernimmt die configs von box two o3 - deshalb teilw. Korrektur */
.subs {
	display:none;
	position:absolute;
}

.subs.box {
	padding-left: 20px;
	padding-right: 20px;
	overflow: hidden;
	width: 275px;
	height: 315px;
	background: url("./images/InfoBox.png") no-repeat;
}

.marginLeft495 {
	margin-left: 495px;
}

span#fontSubBoxSoftware {
	position:absolute;
	height: 30px;
	margin-top: 23px;
	margin-left: 35px;
	margin-right: 15px;
	margin-bottom: 17px;
	overflow: hidden;
}

span#fontSubBoxPartner {
	position:absolute;
	width: 410px;
	height: 30px;
	margin-top: 20px;
	margin-left: 35px;
	margin-right: 35px;
	margin-bottom: 20px;
	overflow: hidden;
}

span#infoBoxHeader {
	position:absolute; 
	margin-top: 185px;
	margin-left: 165px;
	padding-top: 20px;
	padding-left: 20px;
	padding-right: 15px;
	background: url("./images/headlinerHeader.png") no-repeat;
	width: 828px;
	height: 55px;
	color: #000000;
	font-size: 14px;
	font-weight: bold;
	overflow: hidden;
}

.headliner {
	background: url("./images/headliner.png") no-repeat;
	width: 818px;
	height: 42px;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 10px;
	padding-bottom: 10px;
}

.downloadBox {
	background: url("./images/DownloadButton.png") no-repeat;
	height: 50px;
	padding-left: 79px;
	padding-top: 10px;
	font-size: 16px;
	margin-top: 10px;
}

div#box480redTop {
	background: url("./images/Box480Red_Top.png") no-repeat;
	width: 480px;
	height: 39px;
}

div#box480redMiddle {
	background: url("./images/Box480Red_Middle1px.png") repeat-y;
	width: 480px;
}

div#box480redBottom {
	background: url("./images/Box480Red_Bottom.png") no-repeat;
	width: 480px;
	height: 13px;
}

div#box315redTop {
	background: url("./images/Box315Red_Top.png") no-repeat;
	width: 315px;
	height: 40px;
}

div#box645redTop {
	background: url("./images/Box645Red_Top.png") no-repeat;
	width: 645px;
	height: 40px;
}

div#box645redMiddle {
	background: url("./images/Box645Red_Middle1px.png") repeat-y;
	width: 645px;
}

div#box645redBottom {
	background: url("./images/Box645Red_Bottom.png") no-repeat;
	width: 645px;
	height: 16px;
}


div#box315redMiddle {
	background: url("./images/Box315Red_Middle1px.png") repeat-y;
	width: 315px;
}

div#box315redBottom {
	background: url("./images/Box315Red_Bottom.png") no-repeat;
	width: 315px;
	height: 16px;
}

div#box315greenTop {
	background: url("./images/Box315Green_Top.png") no-repeat;
	width: 315px;
	height: 40px;
}

div#box315greenMiddle {
	background: url("./images/Box315Green_Middle1px.png") repeat-y;
	width: 315px;
}

div#box315greenBottom {
	background: url("./images/Box315Green_Bottom.png") no-repeat;
	width: 315px;
	height: 16px;
}

div#box315blueTop {
	background: url("./images/Box315Blue_Top.png") no-repeat;
	width: 315px;
	height: 40px;
}

div#box315blueMiddle {
	background: url("./images/Box315Blue_Middle1px.png") repeat-y;
	width: 315px;
}

div#box315blueBottom {
	background: url("./images/Box315Blue_Bottom.png") no-repeat;
	width: 315px;
	height: 16px;
}

div#boxInBox {
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
}

div#boxInHeader40 {
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 1px;
	padding-bottom: 5px;
}

.hookText {
	background: url("./images/hook.png") no-repeat;
	height: 20px;
	padding-left: 30px;
}

.startBoxesMinHeight {
	min-height: 175px; /** kennt IE nicht deshalb important-Lösung */
	height: auto !important;
	height: 175px;
}

div#softwareBottomGrafic {
	background: url("./images/BottomgraficSoftware.png") no-repeat;
	width: 810px;
	height: 157px;
}

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

	Fonts
	 
************************/

.bigfontInBox {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #000000;
}

.divContentBoxA:hover .bigfontInBox {
	color: #FFFFFF;
	font-weight: bold;	
}

.smallfontInBox {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
}

.divContentBoxA:hover  .smallfontInBox {
	color: #FFFFFF;	
	font-weight: bold;
}

.normalText {
	font-size: 12px;
	line-height: 20px;
}

.infoBoxHeaderFont {
	font-size: 16px;
	line-height: normal;
	margin-top: 10px;
	margin-bottom: 22px;
}

.p_adjustment {
	padding-left: 15px;
	padding-right: 15px;
	overflow: hidden; /* ohne width eigentlich hinfällig **/
}

.footerText {
	font-size: 11px;
	text-decoration:underline;
	color:#333333;
}

.footerText:hover {
	color:#999999
}

.imgDesc {
	font-size: 11px;
	color:#666666;
}

.startSiteLinks {
	font-size: 12px;
	text-decoration:underline;
	color:#333333;
}

.miniText {
	font-size: 10px;
	color:#333333;
}


