/* ================================================ 

 * ================================================= */

/* 

A javascript block is added in the lang.ssi where a test is done on the url name
in case the url ends with _alt.htm another layout is called based on the body id "alt"

*/

/* ====
 * = 1. Common Styling 
 * ======================= */

html
{
	text-align: center;
	background: #fff;
	height: 100%;
	background: #fff url(../images/css_body_bg.gif) repeat-y 50% 50%;
}

body
{
	font: 0.84em/1.333 arial, sans-serif;
	margin: 0;
	padding: 0;
	width: 960px;
	margin: 0 auto;
	position: relative;
	height: 100%
}

* html body
{
	width: 959px
}

*
{
	font-size: 100%;
	padding: 0;
	margin: 0
}

img
{
	border: none
}

a{color: #eb7d00}
#alt a{color: #003e84}
a:hover{color: #a1a1a1}




/* clear stuff */

div, ul, ol, li, table, td, th, tr, p, blockquote, #language p, #language
{
	margin: 0;
	padding: 0;
	border: none
}

/* to clear floated elements */

/* from http://www.positioniseverything.net/easyclearing.html */

.clearfix:after
{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden
}

.clearfix
{
	display: inline-block;
}

/* Hides from IE-mac \*/

* html .clearfix
{
	height: 1%;
}

.clearfix
{
	display: block;
}

/* End hide from IE-mac */

#container
{
	text-align: left;
	position: relative;
	overflow: hidden;
/* to keep opera and safari in control */
}

/* ====
 * = 2. General Block Positioning & Styling
 * ======================================= */

#header
{
	background: #fff url(../images/css_header_bg.jpg) no-repeat 0 0;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	height: 152px;
	width: 100%
}

#alt #header{background: #fff url(../images/css_header_bg_alt.jpg) no-repeat 0 0}

#language
{
	background: none;
	border: none;
	position: absolute;
	top: 106px;
	left: 0px;
	z-index: 20;
	width: 100px
}

#language a
{
	text-decoration: none
}

#language a:hover
{
	color: #C5DEA3 !important
}

#search
{
	position: absolute;
	left: 780px;
	top: 178px
}

#search-input-cell input
{
	width: 118px;
	margin-left: 19px;
	margin-right: 5px
}

/* ====
 * = 3. #extra Styling
 * ==================== */

#extra
{
	text-align: left;
	margin-top: 100px;
	color: #003E85;
	width: 150px
}

#extra ul
{
	margin: 0;
	list-style: none;
}

#extra ul li
{
	margin: 0;
	padding-left: 9px;
	background: url(../images/css_extra_bullet.gif) no-repeat 1px 5px;
}

#extra a
{
	color: #003E85;
	text-decoration: underline;
}

#extra a:hover
{
	color: #000;
	text-decoration: none
}

#extra h1, #extra h2,#extra h3, #extra h4, #extra b
{
	color: #7c8083;
}

#extra hr
{
	width: 170px;
	border: 0;
	background: none;
	height: 5px;
	display: none;
}

/* ====
 * = 4. Content Styling
 * ===================== */

#content
{
	padding-top: 152px
}

h1{color: #ea7d00; font-size: 16px}
h2{color: #003E85; font-size: 14px}

#alt h1{color: #003e84; font-size: 16px}
#alt h2{color: #00a277; font-size: 14px}

h3
{
	color: #000;
	font-size: 12px
}

p
{
	padding-bottom: 8px;
}

/* forms */

/* submit form */

.le-form-table
{
	width: 550px
}

.le-form-table td.full-width input, .le-form-table td textarea
{
	width: 340px !important
}

/* ====
 * = Navigation Styling
 * ===================== */

/*
#navigationblock{background: #fff; position: absolute; top: 175px; left: 0px; width: 160px; text-align: left; padding-top: 5px}
#navigationblock a{color: #0a407e}

.navlayer{padding-left: 20px}
.navlayer a{width: 119px; line-height: 18px; vertical-align: middle}
.level0 a{border-top: 1px solid #C5DEA3}
.level0 a, .level1 a{display: block; border-bottom: 1px solid #C5DEA3; color: #6CAC17 !important}

*/

/* privacy & terms */

#en1
{
	margin: 0 !important;
	margin-top: 00px !important;
	padding-top: 300px;
	padding-bottom: 20px
}

#en1 a
{
	display:none;
	font-size: 90%;
	color: #003e85;
	padding-left: 20px;
	display: block;
	width: 135px !important
}

#en1 a:hover
{
	color: #000
}

* html #en1 a
{
	display: inline-block
}

#en1 table img
{
	display: none
}

#en1 table tr
{
	background: url(../images/css_terms_bullet.gif) no-repeat 12px 5px;
}

/* == PARAM1: width of the naviagtion, default:136px == */

#navigationblock
{
	width: 160px;
	position: absolute;
	top: 170px;
	left: 0px;
	text-align: left
}

/* == PARAM2: color of the border between the level1 navigation-elements, default:#fff(white) == */

.navlayer a
{
	width: 119px;
	border-top: solid 1px #9bb5cb;
	margin: 0;
	margin-left: 20px;
	padding: 2px 3px 2px 0px;
	display: block;
	text-decoration: none;
	overflow: hidden
}

/* -- level 0 -- */

/* == PARAM3:background-color for the navigation-title (eg: "Stanyl Home"), default:transparent == */

/* == PARAM4:color for the navigation-title (eg: "Stanyl Home"), default:same color as level1-titles == */

.level0 a
{
	background-color: transparent;
	color: #eb7d00 !important;
	font-weight: bold !important;
	text-decoration: none;
	border-top: none
}

#alt .level0 a{color: #003e84 !important}

/* -- level 1 -- */

/* == PARAM5: background-color of the level1 titles (eq: "Innovation"), default:transparent == */

/* == PARAM6: color of the level1 titles (eq: "Innovation") == */

/* == PARAM7: color of the right border on the level1-elements, this is most likely the color of your background and NOT transparent == */

/* == PARAM8: background-color when you hover over a level1 title, default:#fff(white) == */

/* == PARAM9: color of the right border on the level1-elements that are hovered, this is most likely the same color as the background-
              color of the level1-elements being hovered(white) == */

.level1 a
{
	background-color: transparent;
	color: #06457d !important;
	border-right: none
}

#alt .level1 a{color: #003e84 !important}

.level1 a:hover
{
	color: #000 !important;
/*background-color:#fff; color:#666 !important; font-weight:bold; border-right:none*/
}

.has-child1
{
	background: transparent url(../images/arrowlevel1.gif) no-repeat 0em 0.5em !important
}

/* -- level 2 -- */

/* == PARAM10: background-color of the level2 titles (eq: "Product news"), default:#fff(white) == */

/* == PARAM11: color of the level2 titles (eq: "Product news"), default:#666(dark-gray) == */

/* == PARAM12: color of the right border on the level2-elements, this is most likely the same color as the background-
               color of the level2-elements(white) == */

/* == PARAM13: color of the border between the level2 navigation-elements, default:#eee(light-gray) == */

/* == PARAM14: background-color when you hover over a level2 title, default:#eee(light-gray) == */

/* == PARAM15: color of the right border on the level2-elements that are hovered, this is most likely the same color as the background-
               color of the level2-elements being hovered(white) == */

.level2
{
	margin-left: 5px
}

.level2 a
{
	background-color: #fff;
	color: #ee7d00 !important;
	border-top: none;
	border-right: none
}

#alt .level2 a{color: #00a277 !important}

.level2 a:hover
{
	color: #000 !important;

/*background-color:#eee; color:#333 !important; border-right:1px solid #eee;*/
}

.has-child2 a
{
	
}

.has-child1-expanded
{
	background-image: url(../images/arrowlevel1down.gif) !important
}

/* -- User terms and privacy statement -- */

/* == PARAM16: color of the user terms and privacy statement, default same as level1-titles == */

/*#en1 table tr td a{color:#fff !important;font-size:90% !important;}*/

#extra embed, #extra object
{
	width: 150px
}

/* ================================================ 
 *
 *    Version: 1.0
 *    Created by: kst@amplexor.com
 *	  Customer: DSM
 *	  Project: Light Endorsement: Sensarite
 *
 *   -----------------------------------                                 
 *   |      Table of Contents          |
 *   -----------------------------------
 *   | 1. Common Styling               |
 *   | 2. Block Positioning            |
 *   | 3. #extra Styling		       |
 *   | 4. Content Styling      		   |
 *   -----------------------------------
 * ================================================= */
/* ====
 * = 1. Common Styling 
 * ======================= */
html{text-align: center; background: #fff; height: 100%; background: #fff url(../images/css_body_bg.gif) repeat-y 50% 50%; }
body {font: 0.84em/1.333 arial, sans-serif; margin: 0; padding: 0; width: 960px; margin: 0 auto; position: relative; height: 100%}
* html body{width: 959px}

* {font-size: 100%; padding: 0; margin: 0}

img{border: none}

a{color: #003E85}
a:hover{}

/* clear stuff */
div, ul, ol, li, table, td, th, tr, p, blockquote, #language p, #language{margin: 0; padding: 0; border: none}

/* to clear floated elements */
/* from http://www.positioniseverything.net/easyclearing.html */
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

#container{text-align: left; position: relative; overflow: hidden; /* to keep opera and safari in control */}


/* ====
 * = 2. General Block Positioning & Styling
 * ======================================= */
#header{background: #fff url(../images/css_header_bg.jpg) no-repeat 0 0; position: absolute; top: 0; left: 0; z-index: 10; height: 175px; width: 100%}

#language{background: none; border: none; position: absolute; top: 106px; left: 0px; z-index: 20; width: 100px}
#language a{text-decoration: none}
#language a:hover{color: #C5DEA3 !important}

#search{position: absolute; left: 780px; top: 178px}
#search-input-cell input{width: 108px; margin-left: 15px; margin-right: 5px}

/* ====
 * = 3. #extra Styling
 * ==================== */
#extra{text-align: left; margin-top: 100px; color: #003E85; width: 150px}
#extra a{color: #003E85; text-decoration: underline}
#extra a:hover{text-decoration: none}
#extra h1, #extra h2,#extra h3, #extra h4{color: #003E85}

#extra hr{width: 170px; border: 0; background: none; height: 1px; border-bottom: 1px solid #C5DEA3}

/* ====
 * = 4. Content Styling
 * ===================== */
#content{padding-top: 152px}
h1{color: #003E85; font-size: 16px}
h2{color: #000; font-size: 14px}

/* forms */

/* submit form */
.le-form-table{width: 550px}
.le-form-table td.full-width input, .le-form-table td textarea{width: 340px !important}


/* ====
 * = Navigation Styling
 * ===================== */
/*
#navigationblock{background: #fff; position: absolute; top: 175px; left: 0px; width: 160px; text-align: left; padding-top: 5px}
#navigationblock a{color: #0a407e}

.navlayer{padding-left: 20px}
.navlayer a{width: 119px; line-height: 18px; vertical-align: middle}
.level0 a{border-top: 1px solid #C5DEA3}
.level0 a, .level1 a{display: block; border-bottom: 1px solid #C5DEA3; color: #6CAC17 !important}

*/

/* privacy & terms */
#en1{margin: 0 !important; margin-top: 20px !important; padding-top: 130px; padding-bottom: 20px}

#en1 a{font-size: 90%; color: #003e85; padding-left: 20px; display: block; width: 135px !important}
#en1 a:hover{color: #000}
* html #en1 a{display: inline-block}
#en1 table img{display: none}

#en1 table tr{background: url(../images/css_terms_bullet.gif) no-repeat 11px 5px; }


/* == PARAM1: width of the naviagtion, default:136px == */
#navigationblock{width: 160px; position: absolute; top: 175px; left: 0px; text-align: left}

/* == PARAM2: color of the border between the level1 navigation-elements, default:#fff(white) == */
.navlayer a{width:119px; border-top: solid 1px #C5DEA3; margin:0; margin-left: 20px; padding:2px 3px 2px 0px; display:block; text-decoration:none; overflow:hidden}

/* -- level 0 -- */
/* == PARAM3:background-color for the navigation-title (eg: "Stanyl Home"), default:transparent == */
/* == PARAM4:color for the navigation-title (eg: "Stanyl Home"), default:same color as level1-titles == */
.level0 a{background-color:transparent; color:#6CAC17 !important; font-weight:bold !important; text-decoration:none; border-top: none}

/* -- level 1 -- */
/* == PARAM5: background-color of the level1 titles (eq: "Innovation"), default:transparent == */
/* == PARAM6: color of the level1 titles (eq: "Innovation") == */
/* == PARAM7: color of the right border on the level1-elements, this is most likely the color of your background and NOT transparent == */
/* == PARAM8: background-color when you hover over a level1 title, default:#fff(white) == */
/* == PARAM9: color of the right border on the level1-elements that are hovered, this is most likely the same color as the background-
              color of the level1-elements being hovered(white) == */
.level1 a{background-color:transparent; color:#6CAC17 !important; border-right:none}
.level1 a:hover{color: #B6D68B !important; /*background-color:#fff; color:#666 !important; font-weight:bold; border-right:none*/}
.has-child1{background: transparent url(../images/arrowlevel1.gif) no-repeat 0em 0.5em !important}

/* -- level 2 -- */
/* == PARAM10: background-color of the level2 titles (eq: "Product news"), default:#fff(white) == */
/* == PARAM11: color of the level2 titles (eq: "Product news"), default:#666(dark-gray) == */
/* == PARAM12: color of the right border on the level2-elements, this is most likely the same color as the background-
               color of the level2-elements(white) == */
/* == PARAM13: color of the border between the level2 navigation-elements, default:#eee(light-gray) == */
/* == PARAM14: background-color when you hover over a level2 title, default:#eee(light-gray) == */
/* == PARAM15: color of the right border on the level2-elements that are hovered, this is most likely the same color as the background-
               color of the level2-elements being hovered(white) == */
.level2{margin-left: 5px}
.level2 a{background-color:transparent; color:#003E85 !important; border-top: none ;border-right:none}
.level2 a:hover{color: #809FC2 !important; /*background-color:#eee; color:#333 !important; border-right:1px solid #eee;*/}
.has-child2 a{/*background-color:#fff*/}

.has-child1-expanded{background-image:url(../images/arrowlevel1down.gif) !important}

/* -- User terms and privacy statement -- */
/* == PARAM16: color of the user terms and privacy statement, default same as level1-titles == */

/*#en1 table tr td a{color:#fff !important;font-size:90% !important;}*/


#extra embed, #extra object{width: 150px}