/* -------------------------------------------
project:	Remote Controlled Lighting
date:		2008/05/08
------------------------------------------- */

html { overflow: -moz-scrollbars-vertical; font-size: 100.01%; height: 100%;}
body { margin: 0; padding: 0px 0 0px; background: #333333; color: #383637; font: 62.5%/1.3 Arial,Helvetica,sans-serif; height: 100%;}
textarea, input, select, option, optgroup, button { font: 1em Arial,Helvetica,sans-serif; }

/* RE-SETS
------------------------------------------- */
* { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; }

li, dt, dd, p, th, td, caption { font-size: 1.1em; }
ul, ol, dl { margin-bottom: 1.5em; }
p { margin-bottom: 1.25em; }
li *, li p, dt *, dd *, p * { font-size: 1em; }

fieldset, img { border: none; }
button { overflow: visible; cursor: pointer; }
legend { display: none; }

pre { font: 1.1em "Courier New",monospace; white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ }

a { color: #555; text-decoration: none; }
a:hover, a:focus, a:active { color: #000; text-decoration: underline; }

/* HEADINGS
------------------------------------------- */
h1, h2, h3, h4, h5, h6 { margin: 0 0 10px; font: normal 2.4em Arial,Helvetica,sans-serif; color: #383637; }
h1 { position: relative; margin: 0 -5px 10px; padding: 0 5px 2px; border-bottom: 1px solid #333; font-size: 1.8em; }
h1.a { margin: 0 0 10px; padding: 0; border: none; }
 h1 small { font-size: 0.67em; font-style: italic; }
h2 { font-size: 1.6em; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1.0em; }

/* HELPERS
------------------------------------------- */
.wrapper { width: 100%; overflow: hidden; }
.center { margin-left: auto; margin-right: auto; text-align: center; }
.offset { position: absolute; left: -10001px; overflow: hidden; height: 0; margin: 0; line-height: 0; }

legend.offset { display: none; }

/* LAYOUT
------------------------------------------- */
#root { width: 999px; margin: 0 auto; background: #CCCCCC; height: 100%; margin-bottom: 20px;}
 #top { position: relative; z-index: 10; width: 100%; height: 39px; padding: 80px 0 0; background: #010201 url(../img/bg-top.jpg) no-repeat; border-bottom: 1px solid #000; }
  #logo { position: absolute; left: 25px; top: 15px; z-index: 15; width: 415px; height: 105px; margin: 0; padding: 0; border: none; }
   #logo a { display: block; overflow: hidden; width: 100%; height: 100%; text-indent: -10001px; }
  #nav { position: relative; z-index: 20; list-style: none; width: auto; margin: 0; padding: 0; }
 #content { /* overflow: hidden; */ width: 100%; /* background: url(../img/bg-side.gif) repeat-y; */ background: none repeat scroll 0 0 #CCCCCC; height: 100%;}
  #main { display: inline; float: left; width: 839px; height: 100%; min-height: 400px; margin: 0 0 0 159px; border-left: 1px solid #000; background: none repeat scroll 0 0 #CCCCCC;}
  * html #main { height: 400px; }
   #main div.content { width: 100%; padding: 10px 0 5px; background: #ccc; }
   #main div.full { min-height: 375px; }
   #main div.half { min-height: 65px; }
   * html #main div.full { height: 375px; }
   #main div.primary { padding-top: 20px;/*  min-height: 320px;  */}
   #main div.secondary { padding-top: 15px; }
   #main div.text { padding-left: 20px; padding-right: 20px; width: 799px; }
   #main ul.tabs-a { margin: 0px 0 0 -1px; background-color: #000000;}
  #side { float: left; width: 145px; margin: 0 -160px 0 0; padding: 15px 7px 0 7px; border-right: 1px solid #000; height: 100%; background: #CCCCCC;}
  #home { background: #ccc; }
  
/* SKIP LINKS
------------------------------------------- */
#skip-links { position: absolute; top: 0; left: -10001px; list-style: none; margin: 0; padding: 0; }
 #skip-links li a:focus, #skip-links li a:active { display: block; position: absolute; left: 10001px; top: 0; z-index: 10001; width: 1000px; padding: 2px 0; background: #222; color: #fff; font-size: 1.4em; text-align: center; }

/* GENERAL
------------------------------------------- */
p.paging-a { color: #555; word-spacing: 2px; }
 p.paging-a a { color: #555; word-spacing: 0; }
 p.paging-a a:hover { color: #000; }
 p.paging-a strong { color: #333; }

p.photo-a { padding: 0 0 0 25px; /* background: url(../img/bg-photo-a.jpg) 0 100% no-repeat; */ }
p.photo-b { padding: 0; text-align: center; }
 p.photo-b div { margin: 0 auto; }
 p.photo-b img { margin: 0 auto; }
p.photo-c { margin: 0px 0px 15px 22px; }
 
/* lists */
ul.tabs-a { overflow: hidden; list-style: none; margin: 0 0 15px; padding: 0; }
* html ul.tabs-a { width: 840px; }
 ul.tabs-a li { display: inline; float: left; border-left: 1px solid #000; background: url(../img/bg-nav-a.png) repeat-x; font-size: 1.4em; line-height: 39px; }
 ul.tabs-a li.double { line-height: 18px; }
  ul.tabs-a li a { float: left; width: 110px; background: url(../img/bg-nav-b.png) -1px 0 no-repeat; color: #d3cdcd; text-align: center; text-decoration: none; }
  ul.tabs-a li.double a { padding: 2px 0 1px; }
  ul.tabs-a li a:hover,
  ul.tabs-a li a:focus,
  ul.tabs-a li a:active { background-repeat: repeat-x; color: #383637; text-decoration: none; }
  ul.tabs-a li a.active,
  ul.tabs-a li a.active:hover { background-repeat: repeat-x; color: #000; }
  ul.tabs-a li em { position: absolute; left: -1001em; top: -1001em; }
 ul.tabs-a li.home { border-left: none; }
  /*ul.tabs-a li.home a { overflow: hidden; width: 159px; background: url(../img/bg-nav-home-a.jpg) no-repeat; text-indent: -10001em; }*/
  /*ul.tabs-a li.home a.active { background: url(../img/bg-nav-home-b.jpg) no-repeat; }*/
  
ul.tree-a { overflow: hidden; list-style: none; width: 100%; margin: -5px 0 15px; padding: 0; border-bottom: 1px solid #333; }
 ul.tree-a li { margin: -1px 0 1px; padding: 7px 0 7px 20px; border-top: 1px solid #333; background: url(../img/bullet-a.gif) 3px 11px no-repeat; font-size: 1.2em; }
 ul.tree-a li.parent { background-image: url(../img/bullet-b-b.gif); }
 ul.tree-a li.expanded { background-image: url(../img/bullet-b-c.gif); }
  ul.tree-a li a { color: #555; text-decoration: none; }
  ul.tree-a li a:hover { color: #333; text-decoration: underline; }
  ul.tree-a li.active a,
  ul.tree-a li.active a:hover { color: #000; text-decoration: none; }
  ul.tree-a li ul { display: none; list-style: none; margin: 0; padding: 5px 0 0 5px; }
  ul.tree-a li.active ul { display: block; }
   ul.tree-a li.active ul li { padding: 2px 0; border: none; background: none; font-size: 0.83em; }
    ul.tree-a li.active ul li a { color: #777; }
    ul.tree-a li.active ul li a:hover { color: #555; text-decoration: underline; }
    ul.tree-a li.active ul li.active a,
    ul.tree-a li.active ul li.active a:hover { color: #333; text-decoration: none; }
 
ul.a { margin: 0 0 5px; padding: 0 0 0 25px; }
 ul.a li { margin: 0 0 10px; }
 
ul.clean-a { list-style: none; margin: 0 0 15px; padding: 0; }
 ul.clean-a li { margin: 0 0 3px; }
  ul.clean-a li a.active { color: #000; }
   /*ul.clean-a li a { color: red; }*/
   ul.clean-a li a.highlight {font-weight: bold;}
  
ul.news-a { list-style: none; margin: 0 0 10px; padding: 0; }
 ul.news-a li { margin: 0 0 10px; font-size: 1.2em; font-weight: bold; }
  ul.news-a li a { font-weight: normal; }
 
ul.showcase-a { overflow: hidden; list-style: none; margin: 0 0 15px; padding: 0 0 0 15px; }
* html ul.showcase-a { zoom: 1; }
 ul.showcase-a li { display: inline; float: left; width: 195px; margin: 0 0 0 9px; font-size: 1.8em; text-align: center; }
  ul.showcase-a li a { position: relative; float: left; width: 100%; /* background: url(../img/bg-shade-a.png) -1001px -1001px no-repeat; */ font-size: 14px;}
  ul.showcase-a li br { display: none; }
  ul.showcase-a li div { display: inline; margin: 0 auto; line-height: 1; font-size: 10px; }
   ul.showcase-a li div img,
   ul.showcase-a li div canvas { display: block; margin: 0 auto; }
 
ul.showcase-b { overflow: hidden; list-style: none; margin: 0 0 15px; padding: 0 0 0 15px;}
* html ul.showcase-b { zoom: 1; }
 ul.showcase-b li { display: inline; float: left; width: 195px; margin: 0 0 0 8px; font-size: 1.8em; text-align: center; }
  ul.showcase-b li a { position: relative; float: left; width: 100%;/*  background: url(../img/bg-shade-a.png) -1001px -1001px no-repeat;  */ font-size: 14px;}
  ul.showcase-b li br { display: none; }
  ul.showcase-b li div { display: inline; margin: 0 auto; line-height: 1; font-size: 10px; }
   ul.showcase-b li div img,
   ul.showcase-b li div canvas { display: block; margin: 0 auto; }
   
ul.showcase-c { overflow: hidden; list-style: none; margin: 0 0 15px; padding: 0 0 0 5px; /* background: url(../img/bg-shade-a.png) 0 100% repeat-x;  */}
* html ul.showcase-c { zoom: 1; }
 ul.showcase-c li { display: inline; float: left; width: 198px; margin: 5px 0 13px 0px; font-size: 1.8em; text-align: center; }
  ul.showcase-c li a { position: relative; float: left; width: 100%;/*  background: url(../img/bg-shade-a.png) -1001px -1001px no-repeat;  */}
  ul.showcase-c li br { display: none; }
  ul.showcase-c li div { display: inline; margin: 0 auto; line-height: 1; font-size: 10px; }
   ul.showcase-c li div img,
   ul.showcase-c li div canvas { display: block; margin: 0 auto; }
   
ul.showcase-d { overflow: hidden; list-style: none; margin: 0 0 15px; padding: 0 0 0 5px; /* background: url(../img/bg-shade-a.png) 0 70px repeat-x;  */}
* html ul.showcase-d { zoom: 1; }
 ul.showcase-d li { display: inline; float: left; width: 130px; margin: 0 0 0 7px; font-size: 14px; text-align: center; }
  ul.showcase-d li a { position: relative; float: left; width: 100%; /* background: url(../img/bg-shade-a.png) -1001px -1001px no-repeat;  */}
  ul.showcase-d li br { display: none; }
  ul.showcase-d li em { display: block; font-size: 0.86em; }
  ul.showcase-d li div { overflow: hidden; margin: 0 auto; line-height: 1; font-size: 10px; }
   ul.showcase-d li div img,
   ul.showcase-d li div canvas { display: block; margin: 0 auto; }
   
ul.showcase-e { overflow: hidden; list-style: none; margin: 0 0 15px; padding: 0; /* background: url(../img/bg-shade-a.png) 0 100% repeat-x; */ }
* html ul.showcase-e { zoom: 1; }
 ul.showcase-e li { display: inline; float: left; width: 385px; margin: 0 0 0 20px; font-size: 1.8em; text-align: center; }
  ul.showcase-e li a { position: relative; float: left; width: 100%; /* background: url(../img/bg-shade-a.png) -1001px -1001px no-repeat; */ }
  ul.showcase-e li br { display: none; }
  ul.showcase-e li em { display: block; font-size: 0.86em; }
  ul.showcase-e li div { overflow: hidden; margin: 0 auto; line-height: 1; font-size: 10px; }
   ul.showcase-e li div img,
   ul.showcase-e li div canvas { display: block; margin: 0 auto; }
   
/* containers */
div.hcard-a { margin: 0 0 15px; color: #777; }
 div.hcard-a h3 { margin: 0 0 1px; color: #383637; font: 1.1em Arial,sana-serif; }
  div.hcard-a h3 a { color: #383637; }
 div.hcard-a p { margin: 0 0 7px; }
 div.hcard-a .lab { float: left; width: 15px; }
  div.hcard-a abbr { border: none; }
  div.hcard-a a { color: #777; }
 
div.docs-a { }
 div.docs-a h2 { margin: 0 0 -16px; font-size: 1.3em; }
 div.docs-a ul { list-style: none; margin: 19px 0 14px; padding: 0; }
 div.docs-a ul.no-label { margin-top: 0; }
  div.docs-a ul li { margin: 0 0 1px; padding: 2px 0 2px 25px; background: url(../img/icon-pdf-a.png) 0 1px no-repeat; color: #555; }
   div.docs-a ul li a { color: #555; }
   div.docs-a ul li a:hover { color: #333; text-decoration: underline; }
 div.docs-a ul.clean-a { margin-top: 21px; }
  div.docs-a ul.clean-a li { margin: 0 0 3px; padding: 0 0 0 5px; background: none; }

table.news-list { width: 100%; margin: 10px 0 20px 0; }
table.news-list td.thumb {padding: 10px 0px 10px 20px;}
table.news-list td.thumb img {border: 1px solid #666;}
table.news-list td.title {padding: 10px 20px 10px 0px;}
 table.news-list img {}
 table.news-list p.date {margin: 0 0 3px 0; padding: 0; font-size: 11px; font-weight: bold;}
 table.news-list p.more a:link {margin: 0 0 3px 0; padding: 0; font-size: 10px; font-weight: normal;} 
 table.news-list p.more a:visited {margin: 0 0 3px 0; padding: 0; font-size: 10px; font-weight: normal;} 
table.news-list h4 {}
 table.news-list h4 a {text-decoration: none;}
 table.news-list h4 a:hover {color: #000; text-decoration: none;}
 table.news-list paging-a {}

div.news-a { overflow: hidden; width: 100%; margin: 0 0 25px; }
 div.news-a p.image { float: left; width: 150px; margin: 0 -185px 0 0; padding: 0 0 0 25px; background: url(../img/bg-photo-a.jpg) 100% 100% no-repeat; }
  div.news-a p.image div { display: inline; }
 div.news-a h2 { margin: 0 20px 10px 180px; padding: 0 5px 2px; border-bottom: 1px solid #333; color: #333; }
 div.news-a h4 { margin: 0 20px 10px 180px; padding: 0 5px 2px; }
  div.news-a h2 a { color: #333; }
 div.news-a p { margin: 0 40px 15px 185px; }
 div.news-a p.paging-a { margin-top: 30px; }
 
/* columns */
div.columns-two-a { overflow: hidden; width: 100%; }
 div.columns-two-a div.column { float: right; width: 345px; padding: 0 20px 0 0; }
 div.columns-two-a div.first { float: left; width: 470px; padding: 0; }
  div.columns-two-a div.first p.photo-a { padding: 0 0 0 25px; /* background: url(../img/bg-photo-a.jpg) 0 100% no-repeat;  */}
  div.columns-two-a div.first form.a { padding: 0 0 0 25px;/*  background: url(../img/bg-photo-a.jpg) 0 100% no-repeat; */ }
  
div.columns-two-b { overflow: hidden; width: 100%; }
 div.columns-two-b div.column { float: right; width: 49%; }
 div.columns-two-b div.first { float: left; margin: 0 1.9% 0 0; }
  div.columns-two-b div.first form.a { padding: 0 0 0 25px; background: url(../img/bg-photo-a.jpg) 0 100% no-repeat; }
  
div.columns-three-a { overflow: hidden; width: 100%; }
 div.columns-three-a div.column { display: inline; float: left; width: 30%; margin: 0 3% 0 0; }
  
div.columns-three-b { overflow: hidden; width: 100%; }
 div.columns-three-b div.column { display: inline; float: left; width: 32%; margin: 0 0 0 1.3%; }
 
div.columns-a { overflow: hidden; width: 100%; }
 div.columns-a .column {  float: left; margin: 0 35px 0 0; padding: 0 0 7px; }
  
/* forms */
form.a { }
 form.a fieldset { margin: 0; padding: 0; }
  form.a fieldset legend { }
  form.a fieldset p { overflow: hidden; width: 100%; margin: 0 0 3px; }
  form.a fieldset p.error { margin-bottom: 10px; color: #ca0002; font-weight: bold; }
   form.a fieldset p label { float: left; width: 105px; padding: 3px 10px 0 0; }
   form.a fieldset p input { width: 280px; padding: 1px 3px; }
   form.a fieldset p textarea { overflow: auto; width: 280px; height: 50px; padding: 1px 3px; }
   * html form.a fieldset p textarea { width: 282px; }
   form.a fieldset p select { width: 290px; }
   form.a fieldset p button { margin: 0 0 0 115px; padding: 1px 10px; border: 1px solid #ababab; background: #e9e9e9; color: #333; font-weight: bold; }
   * html form.a fieldset p button { margin-left: 118px; }
   form.a fieldset p button:hover { background-color: #f3f3f3; }
 
/* tables */
table.a { width: 100%; }
 table.a th { padding: 5px 2px; color: #555; vertical-align: top; }
 table.a td { padding: 5px 2px; color: #888; text-align: center; vertical-align: top; }
  table.a em { display: block; font-size: 0.82em; }
 
table.b { width: 100%; }
 table.b th { padding: 2px; color: #555; text-align: left; vertical-align: top; }
 table.b td { padding: 2px; color: #888; vertical-align: top; }
 
/* ELEMENTS
------------------------------------------- */
#showcase { overflow: hidden; position: relative; z-index: 10; width: 100%; background: url(../img/indicator-a.gif) -10001px -10001px no-repeat; }
* html #showcase { height: 240px; }
 #showcase img { position: relative; z-index: 20; display: block; }
 #showcase img.loading { position: absolute; left: 0; top: 0; z-index: 10; }
 #showcase span { display: none; position: absolute; left: 0; top: 0; z-index: 30; width: 100%; height: 100%; background: #000 url(../img/indicator-a.gif) 50% 50% no-repeat; opacity: 0.9; text-indent: -10001em; }
 
#slideshow { position: relative; overflow: hidden; list-style: none; width: 100%; margin: 0; padding: 0; border-bottom: 1px solid #000; }
 #slideshow img { display: block; }
 
#home { }
 #home div.wrapper { overflow: hidden; width: 100%; height: 100%;}
  #home div.wrapper div.movie { float: left; width: 565px; height: 413px; margin: 0 -565px 0 0; }
  #home div.wrapper div.news { margin: 0 0 0 565px; padding: 20px 15px 5px 0; }
   #home div.wrapper div.news h1 { margin-bottom: 12px; }
 
/* SCROLLED DIV
------------------------------------------- */
div.scrolled { overflow: hidden; height: 175px; }

.jScrollPaneContainer { position: relative; z-index: 1; overflow: hidden; }
.jScrollPaneTrack { position: absolute; right: 0; top: 0; height: 100%; border: 1px solid #999; border-width: 0 1px; cursor: pointer; }
.jScrollPaneDrag { position: absolute; overflow: hidden; background: #999 url(../img/scrollbar-point.gif) 50% 50% no-repeat; cursor: pointer; }
.jScrollPaneDragTop { position: absolute; top: 0; left: 0; overflow: hidden; }
.jScrollPaneDragBottom { position: absolute; bottom: 0; left: 0; overflow: hidden; }
a.jScrollArrowUp { display: block; position: absolute; z-index: 1; top: 0; right: 0; overflow: hidden; width: 16px !important; height: 16px; border: 1px solid #ccc; border-width: 0; background: url(../img/scrollbar-arrows.jpg) no-repeat; text-indent: -2000px; }
a.jScrollArrowDown { display: block; position: absolute; z-index: 1; bottom: 0; right: 0; overflow: hidden; width: 16px !important; height: 16px; border: 1px solid #ccc; border-width: 0; background: url(../img/scrollbar-arrows.jpg) 0 -16px no-repeat; text-indent: -2000px; }

/* SOCIAL ICONS
------------------------------------------- */
#sociallinks {
	position: absolute; left: 847px; top: 23px; z-index: 30; width: 152px; height: 33px;
	background-image: url(../img/socialbg.jpg);}
	
.twitter {
	background-image: url(../img/tw1.jpg);
	margin-left: 10px;
	width: 34px;
	height: 33px;
	float: left;	
	}
.twitter:hover {
	background-image: url(../img/tw2.jpg);
	}
.linkedin {
	background-image: url(../img/li1.jpg);
	margin-left: 10px;
	width: 34px;
	height: 33px;
	float: left;
	}
.linkedin:hover {
	background-image: url(../img/li2.jpg);
	}
.youtube {
	background-image: url(../img/yo1.jpg);
	margin-left: 10px;
	width: 34px;
	height: 33px;
	float: left;
	}
.youtube:hover {
	background-image: url(../img/yo2.jpg);
	}
.dr8interactive {
margin-bottom: 30px; 
	margin-left: 128px;
}
.mediapage {
	height: 800px; background: none repeat scroll 0 0 #CCCCCC;}
.mediatext {
font-size: 1.2em;
color: #555555;
	margin-left: 149px;}
.mediah2 {
	font-weight: bold;
	}
.abouttext {
font-size: 1.2em;
color: #555555;
}