/***********    GENERAL    ***********    GENERAL    ***********/
body
{
	overflow-x: auto;
	overflow-y: scroll;
	font-family: "Segoe UI","Arial","PT Sans","Helvetica","sans-serif";
}

b
{
	font-weight:bold;
}

.sxsSiteContainer
{
	height:100%;
	width:998px; /*optimized for a 1024px resolution*/
	
	box-sizing: border-box;

	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width: 1023px)
{
	.sxsSiteContainer
	{
		width:100%;
		padding-left:16px;
		padding-right:16px;
	}
}

.btnMehrInfo
{
	width:120px;
	line-height: 32px;
	border: none;
	text-decoration:none;
	text-align:center;
	color:white;
	font-size:14px;
	float:right;
}

.btnMehrInfo.scadasystem
{
	background-color:#FF9800;
}

.btnMehrInfo.btnColOne
{
	background-color:#925a05;
}

.btnMehrInfo.btnColTwo
{
	background-color:#f9cc87;
}

.btnMehrInfo.btnColThree
{
	background-color:#c58a30;
}

/***********    GENERAL    ***********    GENERAL    ***********/

#subMenu
{
	display:none;
}



/***********    HEADER    ***********    HEADER    ***********/

header
{
	height:100px;
	width:100%;
	border-bottom: 2px solid #387bb7;
	float:left;
}

header .scadaLogo
{
	float:left;
	width:300px;
	margin-top:50px;
}

header .scadaLogo img
{
	height:85%;
	width:95%;
}

header nav#bigScreen
{
	float:right;
	width:650px;
	margin-top:64px;
	display:block;
}

header nav#bigScreen ul
{
	float: right;
}

header nav#bigScreen ul li
{
	float:left; 
	margin-right: 40px;
}

header nav#bigScreen ul li a
{
	color:#387bb7; 
	font-size:17px;
	text-decoration:none;
	outline: 0;
}

header nav#bigScreen ul li a:hover
{
	color:#FF9800; 
}

header nav#iPhone
{
	display:none; 
}

header #mobileSubmenu
{
	background:white; 
	position: absolute; 
	right: 19px; 
	top: 97px; 
	border: 2px solid #FF9903; 
	width:200px;
}

header #mobileSubmenu ul li
{
	float:left; 
	width:178px;
	padding:12px;
	border-bottom: 1px solid #FF9903;
	cursor:pointer;
}


header #mobileSubmenu ul li:last-child
{
	border-bottom: 0px solid #FF9903;
}

@media screen and (max-width: 1023px)
{
	header nav#bigScreen
	{
		display:none;
	}
	header nav#iPhone	
	{
		background: url('../img/menuIcon.png') no-repeat;
		width:55px;
		height:55px;
		float:right;
		margin-top:45px;
		display:block;
		cursor:pointer;
	}
}

/***********    HEADER    ***********    HEADER    ***********/






/***********    CONTENT    ***********    CONTENT    ***********/



section#upperContent 
{
	padding-top:20px;
	padding-bottom:20px;
	height:auto;
	float:left;
}

section#upperContent #text
{
	float:left;
	height:auto;
	width:50%;
}

section#upperContent #text div
{
	float:left;
	width:100%;
	padding-bottom:12px;
}

section#upperContent #text div.titleShort
{
	font-size:30px;
}

section#upperContent #text div.titleLong
{
	font-size:20px;
}

section#upperContent #text div.description
{
	line-height:1.5;
	border-top: 2px solid #FF9800;
	font-size:16px;
	padding-top:4px;
}

section#upperContent #text div.button
{
	float:right;
	width:250px;
}

section#upperContent #images
{
	float:right;
	height:400px;
	width:45%;
}

section#upperContent #images img
{
	width:450px;
	height:400px;
}

@media screen and (max-width: 1023px)
{
	section#upperContent #text
	{
		width:100%;
	}
	section#upperContent #images
	{
		display:none;
	}
}

section#lowerContent
{
	height:auto;
	width:100%;
	padding-bottom:20px;
	float:left;
}

section#lowerContent .colOne
{
	float:left;
	width:250px;
}

section#lowerContent .colTwo
{
	float:left;
	width:250px;
	margin-left:124px;
}

section#lowerContent .colThree
{
	float:right;
	width:250px;
}

@media screen and (max-width: 1023px)
{
	section#lowerContent .colOne
	{
		width:100%;
	}

	section#lowerContent .colTwo
	{
		width:100%;
		margin-left:0px;
	}

	section#lowerContent .colThree
	{
		width:100%;
		float:left;
	}
}

section#lowerContent .subSectionTitle
{
	float:left; 
	width:100%; 
	height:32px;
	font-size:20px; 
}

section#lowerContent  .colOne .subSectionTitle
{
	color: #925a05;
	border-bottom: 1px solid #925a05;
}

section#lowerContent  .colTwo .subSectionTitle
{
	color: #f9cc87; 
	border-bottom: 1px solid #f9cc87;
}

section#lowerContent  .colThree .subSectionTitle
{
	color: #c58a30;
	border-bottom: 1px solid #c58a30;
}

section#lowerContent .subSectionContent
{
	float:left;
	width:100%;
	line-height:1.3;
	padding-top:4px;
	padding-bottom:8px; 
}

section#lowerContent .subSectionButton
{
	float:left;
	width:100%;
}

section#impKonContent
{
	width:100%;
	height:auto;
	padding-bottom:20px;
	padding-top:20px;
	float:left;
}

section#impKonContent div
{
	width:100%;
	float:left;
	padding-bottom:20px;
}

section#impKonContent .header
{
	font-size:30px;
}

section#impKonContent .company
{
	font-size:16px;
	font-weight:bold;
}

section#impKonContent .description
{
	font-size:16px;
	line-height:1.5;
}

section#impKonContent .description a
{
	text-decoration:none;
	color:#387bb7;
	outline:none;
}

section#impKonContent .description a:hover
{
	text-decoration:underline;
	color:#FF9800;
}


/***********    CONTENT    ***********    CONTENT    ***********/








/***********    FOOTER    ***********    FOOTER    ***********/


footer
{
	float:left;
	width:100%;
	margin-top:4px;
	padding-top:8px;
	padding-bottom:8px;
	height:40px;
	border-top: 2px solid #387bb7;
	font-size:14px;
	color:#387bb7;
}

footer a
{
	padding-right:12px;
	text-decoration:none;
	color:#387bb7;
}

footer a:hover
{
	text-decoration:underline;
	color:#FF9800;
}

footer .imprKont
{
	width:490px;
	float:left;
}

footer .copyRight
{
	width:490px;
	float:right;
	text-align:right;
}

@media screen and (max-width: 1023px)
{
	footer a
	{
		padding-right:12px;
		padding-l:12px;
	}
	footer .imprKont
	{
		width:100%;
		text-align:center;
	}

	footer .copyRight
	{
		width:100%;
		text-align:center;
		padding-top:8px;
	}
}

/***********    FOOTER    ***********    FOOTER    ***********/

div.mail1 {float:left;width:auto !important;}
div.mail2 {float:left;display:none;}
