
/* 1.1 Reset
-----------------------------------------------------------------------------------------------*/

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, samp, small, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th  { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
a, ins, del { text-decoration: none; }
table { border-collapse: collapse; border-spacing: 0; }
th, td { vertical-align: top; }
th { text-align: left; }

/* 1.2 Accessibility Navigation & Hide
-----------------------------------------------------------------------------------------------*/

ol#accessibility-nav, .hide { position: absolute; top: -999em; left: -999em; height: 1px; width: 1px; }


/* 1.3 Clearfix
-----------------------------------------------------------------------------------------------*/

.clearfix:after,
#header .container:after,
#content .container:after, 
#subpage-content:after,
#contact-form label:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
/* 1.4 Default Styles
-----------------------------------------------------------------------------------------------*/

body { background: #fff; color: #333; font: 62.5%/1.3 "Arial", "Helvetica", sans-serif; text-align: left; }
hr { display: none; }
strong { font-weight: bold; }
em { font-style: italic; }
del { text-decoration: line-through; }
th { font-weight: normal; }
address, cite, dfn { font-style: normal; }
li { list-style: none; }
abbr, acronym { border-bottom: 1px dotted #999; cursor: help; }
input, textarea, select { font-family: "Arial", "Helvetica", sans-serif; }
a, a:visited { color: #0083B6; text-decoration: none; font-weight:300;  }
a:hover, a:active { color: #0000FF; text-decoration: none; font-weight:300; }




/* 2. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/

/* 2.0 Global Elements */
span.tl, span.tr, span.bl, span.br { position: absolute; overflow: hidden; }

/* 2.1 Structure
-----------------------------------------------------------------------------------------------*/

.container 
{ 
  width: 960px; 
 /*position: relative; conflict with page multi level menu*/
  margin: 0 auto; 
  text-align: left; 
  font-size: 1.2em;
 }


#footer { clear: both; }
body.subpage #content { float: left; width: 600px; display: inline; margin: 20px 0 0 34px;}
body.subpage #sidebar { float: left; width: 306px; display: inline; margin: 20px 0 0 0; background: #EFFCFF; }

/* 2.2 Header
-----------------------------------------------------------------------------------------------*/
#header { background: #00B9FE url(../images/bg_header.jpg) repeat-x bottom left; padding-bottom: 18px; padding-top: 8px; z-index: 2; position: relative;}
#header .site-name,
#header .site-name span { display: block; overflow: hidden; width: 440px; height: 80px; }
#header .site-name { position: relative; text-indent: -999em; float: left; }
#header .site-name span { background: url(../images/logo.png) no-repeat; position: absolute; top: 0; left: 0; z-index: 10; }
#header a.site-name span { cursor: pointer; }

#header .contact-info { float: right; clear: right; width: 500px; text-align: right; }
#header .contact-info a { color: #000; font-size: 1.5em; }
#header .contact-info a:hover { color: #fff;  }

/* 2.3 Navigation
-----------------------------------------------------------------------------------------------*/
#navigation { float: right; position: relative; background: #fff; margin: 15px 0 11px 0; max-width: 450px; z-index: 99;}
#navigation span.tl, #navigation span.tr,
#navigation span.bl, #navigation span.br { background: url(../images/bg_nav-corner.gif) no-repeat 0 0; width: 4px; height: 4px; }
#navigation span.tl { top:0; left:0; }
#navigation span.tr { top:0; right:0; background-position: -4px 0; }
#navigation span.bl { bottom:0; left:0; background-position: 0 -4px;}
#navigation span.br { bottom:0; right:0; background-position: -4px -4px;}
#navigation ul { padding: 0 14px 0 14px; }
#navigation li { float: left; padding-right: 28px; position: relative; }
#navigation li.last { padding-right: 1px; }
#navigation li a { float: left; padding: 8px 0px 9px 0; font-size: 1.5em; color: #000; }
#navigation li a.current, #navigation li a:hover, #navigation li.hover a { color: #0083B6; background: url(../images/bg_nav-li.gif) repeat-x bottom left;}

/* sub navigation */
#navigation li ul { display: none; width: 160px; position: absolute; left:0; top: 40px; margin: 0; padding: 1px; }
#navigation li ul li { float: none; padding: 0; border-bottom:1px solid #0083B6; background: #fff; }
#navigation li ul li a{ float: none; font-size: 1.2em; display: block;padding: 3px 0 3px 12px; }
#navigation li ul li a:hover { background: #009BD6;color: #fff; }
#navigation li.hover ul { display: block; }
#navigation li.hover li a { background: transparent; }


#banner { background: #fff url(../images/bg_banner.jpg) repeat-x bottom left;  }
#banner .container { position: relative; background: url(../images/banner.jpg) no-repeat 0 0; height: 470px;}
#banner .list { position: absolute; top:0; width: 160px;} 
#banner .list h2 { font-family: "Lucida Grande", "Lucida Sans Unicode"; font-size: 1.2em; color: #737373; font-weight: bold;  }
#banner .list p { font-family: "Lucida Grande", "Lucida Sans Unicode"; font-size: 0.92em; color: #737373;  }
#banner .access { top: 35px; left: 786px; }
#banner .hvac { top: 140px; left: 800px; }
#banner .lights { top: 220px; left: 790px; }
#banner .cameras { top: 310px; left: 810px; }
#banner .sensors { top: 375px; left: 795px; }
#banner .icon_point { color: black; }

#banner #slideshow { position: relative; width: 335px; height: 190px; top: 116px; left:318px; }

a.banner_more_link:link
{font-weight: bold; font-size:10px; font-style:italic; text-decoration: none; color: black!important;}
a.banner_more_link:visited
{font-weight: bold; font-size:10px; font-style:italic; text-decoration: none; color:  black!important;}
a.banner_more_link:active
{font-weight: bold; font-size:10px; font-style:italic; text-decoration: none; color: red!important;}
a.banner_more_link:hover
{font-weight: bold; font-size:10px; font-style:italic; text-decoration: none; color: red!important;}



#banner #slideshow .slide-item {
    position:absolute;
    width: 315px; height: 170px; background: #3d3d3d;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}


#banner #slideshow .slide-item img 
{ 
  position: absolute; 
  top:0; 
  left:0;
}


#banner #slideshow .slide-item p 
{ 
  width: 300px; 
  text-align: center; 
  font-family: "Lucida Grande", "Lucida Sans Unicode"; 
  position: absolute; 
  bottom:40px; 
  z-index: 0; 
  color: #000; 
  font-size: 1.3em;  
  padding: 12px 24px 0 10px;
}


#banner #slideshow .slide-item p.pure 
{ 
/*
  color: white; 
  bottom: 40px; 
  */
}

/*
295454

*/




#banner #slideshow .slide-item.active {
    z-index:10;
    opacity:1.0;
}

#banner #slideshow  .slide-item.last-active {
    z-index:9;
}

/* 2.4 Content
-----------------------------------------------------------------------------------------------*/
#home-body { padding: 28px 0 55px 0; }
#home-body h1 { font-size: 2em; color: #000; font-weight: normal; margin-bottom: 15px; }
#home-body p { font-size: 1.2em; color: #000; margin-bottom: 12px; }

body.home #content { background: #E5E5E5 url(../images/bg_content.gif) repeat-x 0 0; }
body.home #content .inner { background: url(../images/bg_content.gif) repeat-x bottom left; } 
body.home #content .group { min-height: 447px; background: #EFFCFF; float: left; width: 292px; margin-right: 19px; padding: 36px 5px 10px 10px; display: inline; }
body.home #content .group.last { margin-right: 0; }
body.home #content .group h2 { line-height: 18px; margin-bottom: 22px; font-size: 1.33em; text-transform: uppercase; font-weight: bold; }
body.home #content .group li {  padding-bottom: 18px;  font-size: 1.2em; }
body.home #content .group li p { background: url(../images/ico_list.gif) no-repeat 0 -68px; padding-left: 28px; display: block; }
body.home #content .group li a:hover,
body.home #content .group li a.current { color: #0083B6; background: url(../images/ico_list.gif) no-repeat -20px -27px;  } 

/* 2.5 Sidebar
-----------------------------------------------------------------------------------------------*/
#sidebar .side-list { padding: 8px 12px; }
#sidebar .side-list li {  padding-bottom: 18px;  font-size: 1.33em; line-height: 20px;}
#sidebar .side-list li a { font-weight: bold; background: url(../images/ico_list.gif) no-repeat 0 -68px; padding-left: 28px; display: block;}
#sidebar .side-list li a:hover,
#sidebar .side-list li a.current { color: #0083B6; background: url(../images/ico_list.gif) no-repeat -20px -27px;  } 


/* 2.6 Footer
-----------------------------------------------------------------------------------------------*/
#footer { margin-top: 42px; background: #E5E5E5 url(../images/bg_footer.jpg) repeat-x 0 0; min-height: 20px;padding: 32px 0;}
#footer .container { padding:0 15px; width: 930px; }
#footer h2 { font-size: 1.5em; margin-bottom: 12px; font-weight: normal;}
#footer p { font-size: 1.2em; }

/*  Sub Page */
body.subpage #header {  background: #00B9FE url(../images/bg_header-sub.jpg) repeat-x bottom left;  }
#sub-body { min-height: 136px; background: #fff url(../images/bg_content-sub.jpg) repeat-x 0 0; /* border-bottom: 1px solid #E5E5E5; */ padding: 25px 0 17px 0;}
#sub-body h1 { font-size: 2em; color: #000; font-weight: normal; margin-bottom: 5px;}
#sub-body p { line-height: 18px; margin-bottom: 10px; margin-top: 0px;}
#sub-body div { line-height: 18px; margin-bottom: 10px; padding-left: 30px; }
body.tour #content ol { margin: 50px 0 0 0px; padding-left: 20px;}
body.tour #content li {  list-style: decimal outside; font-size: 1.2em; color: #686666; margin-bottom: 7px;}
body.tour #content li p { padding-left: 30px; margin-left: -20px; border-bottom: 1px solid #DCDCDC; padding-bottom: 9px; }

body.tour .tour-list { margin: 18px 0; }
body.tour .tour-list li { padding-bottom: 42px; }
body.tour .tour-list li a {  font-size: 1.5em; font-weight: bold; text-decoration: underline; }
body.tour .tour-list li  img { display: block; margin: 12px auto; }

body.architecture #subpage-content, 
body.about #subpage-content,
body.difference #subpage-content { padding: 20px 0 0 0; }
body.architecture #subpage-content ol { padding: 35px 46px; }
body.architecture #subpage-content li {  list-style: decimal outside; font-size: 1.2em; color: #686666; padding-left: 11px; margin-bottom: 19px;}



body.default #sub-body p { font-size: 1.2em; }
body.default #sub-body p a { color: #0083B6; }
body.default #sub-body p a:hover { color: #0000FF; }
body.default #sub-body p.em { font-style: italic; }
body.default #sub-body ul { margin-top: 22px; }

body.default #sub-body li {  padding-bottom: 16px; background: url(../images/ico_list.gif) no-repeat 0 -68px; }



body.default #sub-body li p { padding-left: 28px; display: block;}


body.default #sub-body  li.st1 {  padding-bottom: 18px; padding-left: 10px; background: url(../images/bullet_hand_r1.gif) no-repeat 0 -5px; }


body.default #sub-body  li.st2 {  padding-bottom: 18px; padding-left: 10px; background: url(../images/bullet_tick_1.gif) no-repeat 0 -5px; }


/*
*/

body.dynamic #sub-body p, 
body.support #sub-body p { width: 880px;  font-size: 1.2em;!important; }
body.dynamic #sub-body p.first,
body.about #sub-body p.first,
body.support #sub-body p.first  { margin-bottom: 38px; }
body.dynamic .dynamic-list { padding: 20px 12px; }
body.dynamic .dynamic-list li { padding: 0 0 20px 30px;  font-size: 12px!important; }
body.dynamic .dynamic-list li {  background: url(../images/ico_list.gif) no-repeat -20px -28px; }
body.dynamic .dynamic-list li h3 { font-weight: normal; color: #0083B6; cursor: pointer; font-size: 15px!important;}

body.dynamic .dynamic-list li p { display: none; color: #666; cursor: pointer; font-size: 1.2em!important; }

body.dynamic .dynamic-list li p a a:visited  { color: #0083B6; }
body.dynamic .dynamic-list li p a:hover a:active { color: #0000FF;  }
body.dynamic .dynamic-list .show-answer { background-position: -40px 0; }
body.dynamic .dynamic-list .show-answer p { display: block; }

/*
body.normal li p { background: url(../images/ico_list.gif) no-repeat 0 -68px;   padding: 0 0 20px 30px; display: block; font-size: 1.2em;  }

body.normal p {font-size: 1.2em;}

*/
/*

body.faq #sub-body p, 
body.support #sub-body p { width: 880px; }
body.faq #sub-body p.first,
body.about #sub-body p.first,
body.support #sub-body p.first  { margin-bottom: 38px; }
body.faq .faq-list { padding: 25px 11px; }
body.faq .faq-list li { padding: 0 0 38px 38px;  font-size: 1.2em; }
body.faq .faq-list li {  background: url(../images/ico_list.gif) no-repeat -20px -28px; }
body.faq .faq-list li h3 { font-weight: normal; color: #0083B6; cursor: pointer;}
body.faq .faq-list li p { display: none; color: #666; cursor: pointer;}
body.faq .faq-list li p a { color: #0083B6; }
body.faq .faq-list li p a:hover { color: #000;  }
body.faq .faq-list .show-answer { background-position: -40px 0; }
body.faq .faq-list .show-answer p { display: block; }


*/

#contact-form{ padding: 20px 4px; }
#contact-form label { display: block; font-size: 1.2em; color: #666; margin-bottom: 12px }
#contact-form label.email { margin-top: 38px; }
#contact-form label.phone { margin-bottom: 38px; }
#contact-form label.phone input { width: 200px; }
#contact-form span { float: left; width: 160px; }
#contact-form input { float: left; margin-right: 12px; display: inline; width: 320px; font-size: 1em; }
#contact-form textarea { width: 320px; height: 120px;  margin-right: 12px; font-size: 1em; }
#contact-form textarea.address { height: 23px; }
#contact-form button { border: 0; cursor: pointer; background: url(../images/btn_submit.gif) no-repeat 0 0; width: 95px; height: 25px; vertical-align: middle; line-height: 25px; text-align: center; font-size: 1.2em; color: #fff; margin-left: 350px; }

body.about .the-about { text-align: center; }

body.about #sub-body p { font-size: 1.2em; }
body.about #sub-body p a { color: #0083B6; }
body.about #sub-body p a:hover { color: #000; }
body.about #sub-body p.em { font-style: italic; }
body.about #sub-body ul { margin-top: 22px; }

body.about #sub-body  li {  padding-bottom: 18px; background: url(../images/ico_list.gif) no-repeat 0 -68px; }
body.about #sub-body  li.st1 {  padding-bottom: 18px; background: url(../images/paragraf.gif) no-repeat 0 0px; }
body.about #sub-body li p { padding-left: 28px; display: block;}



body.difference .the-difference { text-align: center; }
body.difference #sub-body li h3 { margin-left: 28px; font-size: 1.2em;  }
body.difference #sub-body li ul { margin-left: 28px; margin-top: 0; }
body.difference #sub-body li ul li { background: url(../images/bg_dot.gif) no-repeat 0 7px;padding-bottom: 3px  } 
body.difference #sub-body li ul li p { padding-left: 12px; }
body.difference #sub-body li p.em { margin-bottom: 32px; }















ul.normal_ul
{
 !important; 
}

ul.normal_li
{
 !important; 
}






/****************************** new menu 22/07/2010 4:25:01 PM ******************/
#page-menu	
{ 
  font: 13px Helvetica, Sans-Serif;
  text-align: left;
   list-style: none;
  
   
   z-index:-10;
}  


/* 
	LEVEL ONE
*/
ul.dropdown                         { position: relative; }
ul.dropdown li                      { font-weight: bold; float: left; zoom: 1; background: #ccc; }
ul.dropdown a:hover		            { color: #000; }
ul.dropdown a:active                { color: #ffa500; }
ul.dropdown li a                    { display: block; padding: 4px 8px; border-right: 1px solid #333;
	 								  color: #222; }
ul.dropdown li:last-child a         { border-right: none; } /* Doesn't work in IE */
ul.dropdown li.hover,
ul.dropdown li:hover                { background: #F3D673; color: black; position: relative; }
ul.dropdown li.hover a              { color: black; }


/* 
	LEVEL TWO
*/
ul.dropdown ul 						{ width: 220px; visibility: hidden; position: absolute; top: 100%; left: 0; }
ul.dropdown ul li 					{ font-weight: normal; background: #f6f6f6; color: #000; 
									  border-bottom: 1px solid #ccc; float: none; }
									  
                                    /* IE 6 & 7 Needs Inline Block */
ul.dropdown ul li a					{ border-right: none; width: 100%; display: inline-block; } 

/* 
	LEVEL THREE
*/
ul.dropdown ul ul 					{ left: 100%; top: 0; }
ul.dropdown li:hover > ul 			{ visibility: visible; }


/*****************************************************/
