﻿body
{
    font-family:Arial;
    background-image: url(images/bg_body.gif);
    padding: 0px;
    margin: 0px;
    color:#5C5F64;
}
.link
{
    display:block;
    height:100%;
    width:100%;
}

a:link {color:#005A9C; text-decoration:none;}      /* unvisited link */
a:visited {color:#005A9C; text-decoration:none;}  /* visited link */
a:hover {color:#000000; text-decoration:none;}  /* mouse over link */
a:active {color:#0000FF; text-decoration:none;}  /* selected link */

ul
{
    display:inline;
}

li
{
    list-style: circle inside;
}

h1{color:#005A9C;}

h2
{
    margin-top:10px;
    font-style:italic;
    font-size:larger;
    color: #72baf6;
    padding-bottom:8px;
}

h1
{
    margin-top:10px;
    font-style:italic;
    font-size:larger;
    color: #72baf6;
    padding-bottom:8px;
}

h4
{
    font-style:italic;
    font-size:smaller;
    margin-bottom:2px;
}

.ExcitableText
{
    font-style:italic;
    font-weight:bold;
    color:#243A6A;
}

.TForm
{
    padding-top:20px;
    padding-left:15px;
    width:220px;
}

.quote
{
    margin-left: 30px;
    margin-right: 30px;
    font-style:italic;
    font-weight:bold;
    color: #005A9C;
}

img {border: none 0px;}

.validator{ font-size:smaller; }

.floatRight{float:right;}
.floatLeft{float:left;}
.center{margin-left:auto; margin-right:auto;}
.nBottom{margin-top:-15px;}

form
{

}

.All
{   
	margin-top:20px;
	margin-left: auto;
	margin-right: auto;
    width:950px;
    height:700px;
    background:White no-repeat;
    padding:10px;
}
.AllContent
{   
    margin-top:20px;
    margin-bottom:20px;
	margin-left: auto;
	margin-right: auto;
    width:950px;
    background:White;
    padding:10px;
}

/*.Page
{
    border: solid 2px red;
    margin: 5px;
    width:980px;
    height:10px;
}*/

.Header
{
    height:85px;
    margin-left:10px;
    margin-right:10px;
}

.Logo
{
    float:left;
    height:65px;
    width:160px;
    position:relative;
    cursor: pointer;
}

.clearLeft {clear:left;}
.clearRight {clear: right;}
.clearBoth {clear:both;}

/****HEADER NAVIGATION****/

.HeadNav
{
    float:right;
    height:85px;
    width:770px;
}

	.HeadNav ul  
	{
		float: right;
		margin: 0px;
		padding: 0px;
	}

	.HeadNav li
	{
		list-style-type: none ;
		float: left;
		margin: 4px 6px 4px 6px;
	}

	.HeadNav li a  
	{
		text-decoration: underline;
		color:Black; 
	}

	.HeadNav li a:hover 
	{
		color: #aaaaaa; 
		text-decoration: none;
	}
	.HeadNav li a:visited 
	{
		color:Black; 
		text-decoration: none;
	}

/****END Header Navigation****/

.PhoneNumber
{
    float:left;
    text-align:left;
    font-size:large;
}
/****MAIN NAVIGATION BAR****/
.NavBar
{
    width: 720px;
    float: right;
    background-image:url('images/topbar.png');
}

.NavBar ul  
	{
		float: right;
		margin: 5px 15px 0px 0px;
		padding: 0px;
	}

	.NavBar li
	{
		list-style: none;
		float: left;
		margin-right: 16px; 
		margin-left: 16px;
	}

	.NavBar li a 
	{ 
		text-decoration: none;
		color: White; 
	}

	.NavBar li a:hover 
	{
		color: #aaaaaa; 
		text-decoration: none;
	}
	.NavBar li a:visited 
	{
		color:White; 
		text-decoration: none;
	}

/****END Main Navigation Bar****/

.LongHead
{
    height:40px;
    text-align:right;
}

    .LongHead img
    {
        top:4px;
    }

.HoldLeftnRight
{
    margin-left:10px;
    width:930px;
    height:605px;
}

.HoldLeftnRightContent
{
    margin-left:10px;
    width:930px;
}


.LeftContent
{
    Width:660px;
    height:588px;
    Float:left;
    font-size: smaller;
}
.LeftContentContent
{
    Width:660px;
    Float:left;
    font-size: smaller;
}

.cimMainContent
{
    height:300px;
}

.Content
{
    width:650px;
}

.divider
{
    margin-bottom:14px;
    height:25px;
    width:660px;
    background-image:url('images/header.png');
    
    background-repeat:no-repeat;
}

.ButtonHolder
{
    margin-top:15px;
    height:230px;
    width:660px;
}

.mainBtn
{
    height:110px;
    width:150px;
    margin-bottom:0px;
    margin-left:11px;
    background-image:url('images/imageonebutton.png');
    background-position: 0px 0px;
    float:left;
    cursor:pointer;
}

.mainBtn:hover
{
	background-position: 0px 110px;
}

.BtnTxt
{
    padding: 9px 8px 0px 30px;
    font-size: x-small;
    font-weight:bold;
}

.BtnImg 
{
	height: 100px;
	width: 140px;
	background-position: right bottom;
	background-repeat: no-repeat;
}

.BtnImg1
{
	background-image:url('images/smallButtons/MES.gif');
}
.BtnImg2
{
	background-image:url('images/smallButtons/TrakSYS3.gif');
}	
.BtnImg3
{
	background-image:url('images/smallButtons/vmware.gif');
}	
.BtnImg4
{
	background-image:url('images/smallButtons/RFID2.gif');
}	
.BtnImg5
{
	background-image:url('images/smallButtons/Automation.gif');
}	
.BtnImg6
{
	background-image:url('images/smallButtons/Partners.gif');
}	
.BtnImg7
{
	background-image:url('images/smallButtons/Customers.gif');
}	
.BtnImg8
{
	background-image:url('images/smallButtons/LEANTrak2.gif');
}		

/****RIGHT HAND CONTENT STYLES****/
.RightContent
{
	float:right;
    Width:240px;
}

.RightButtons
{
    height:313px;
}

	.RightBtn
	{
		height:100px;
		width:235px;
		cursor:pointer;
	}
	
	    .RightBtn a:hover
	    {
	        color: Black;
	    }
	    .RightBtn a:visited
	    {
	        color: Black;
	    }
		.RightBtnHead
		{
			padding: 10px 10px 10px 10px;	
			font-weight: bold;
		}
		
		.RightBtnDesc
		{
			padding: 10px 10px 10px 10px;
			font-size: smaller;	
		}
		
		.RightBtn a
		{
			text-decoration: none;
			color: Black;	
		}
		
		.RightBtnImg1
		{
			background-image:url('images/lbutton01.png');
		}
		.RightBtnImg2
		{
			background-image:url('images/lbutton02.png');
		}
		.RightBtnImg3
		{
			background-image:url('images/lbutton03.png');
		}
	
/*BOTTOM RIGHT CONTENT - Testimonials and News*/
	
	.rightTests
	{     
		height: 150px;
		padding:0px;
        margin:0px;
        border:solid thin #CCCCCC;
        color:#666666;
	}
	    .rightTests h3 /*Main Headings*/
	    {
	        padding:0px;
	        margin:0px;
	        font-size:small;
	        color:#FFFFFF;
	    }
	    .rightTests h3 a /*Main Headings*/
	    {
	        color:#FFFFFF;   
	    }
	    .rightTests h3 a:hover  /*Main Headings*/
	    {
	        color: #005a9c;
	        text-decoration:underline; 
	    }
		.rightTests h1 /*Customer quote words*/
		{
			padding:0px;
			margin:0px;
	        color: #666666;
	        text-indent:10px;
			text-align:justify;
			padding:0px;
			margin:4px 0 0 0 ;
			font-size:x-small;
		}
		.rightTests h2 /*Name and Job role*/
		{
			
			color:#666666;
			padding:0px;
	        margin: 5px 0px 0px 0px;
	        text-align: right;
			padding:0px;
			font-weight: bold; 
			font-size:x-small;
			font-style:normal;
			
		}
	    
	    .Headline   /*News Headline*/
        {
            color:#666666;
            font-size:smaller;
            font-weight:bold;
            text-decoration:none;
            margin: 0px 0px 5px 0px;
            padding:0px;
        }
            .Headline a
            {
                color:Black;
                font-size:smaller;
                font-weight:bold;
                text-decoration:none;
            }
            .Headline a:visited
            {
                color:Black;
                font-size:smaller;
                font-weight:bold;
                text-decoration:none;
            }
            .Headline a:hover
            {
                color:Black;
                font-size:smaller;
                font-weight:bold;
                text-decoration:underline;
            }
            .Headline a:active
            {
                color:Black;
                font-size:smaller;
                font-weight:bold;
                text-decoration:none;
            }

    .Snippet    /*First 2 lines of news story*/
    {
        
        margin-left: 8px;
        font-size:xx-small;
        
        background-color: #ffffff;
        color:#666666;
        display:inline-block;
    }

.Footer
{
    float:left;
    text-align:center;
    color: White;
    padding-top: 1px;
    height:25px;
    width:660px;
    background-image:url('images/footer.png');
}
.FooterContent
{
    margin-top:10px;
    float:left;
    text-align:center;
    color: White;
    padding-top: 1px;
    height:25px;
    width:100%;
    background-color:#005a9c;
}

/*****INNER CONTENT STYLES***/
.innerContent
	{ 

		width: 100%;
		height: 560px;
		border: solid 2px #dddddd;
		background: #eeeeee;
	}
	.innerContent img
	{
		border: none 0px;
	}

    .LeftContent	
	{
		float:left;
	}
	
	
	

.innerForm
{
    padding:10px;
}
    .innerForm table
    {   
        
        margin: 0px auto;
    }
    .innerForm td
    {   
        padding:8px;
        font-size:small;
        font-weight:bold;
    }
.PagingButtons
{
    height: 22px;
}

.RightPaging
{
    border-top:solid thin #025397;
	float:right;
	font-size:small;
	width:200px;
}

	.RightPaging li
	{
		list-style-type: none;
	}

	.RightPaging li a
	{
		color: black;
	}
	.RightPaging li a:hover
	{
		color: #aaaaaa;
	}
	
.LeftPaging
{
    border-top:solid thin #025397;
	float:Left;
	font-size:small;
	width:200px;
}

	.LeftPaging li
	{
		list-style-type: none;
	}

	.LeftPaging li a
	{
		color: black;
	}
	.LeftPaging li a:hover
	{
		color: #aaaaaa;
	}
	
.NewsBar
{
    width:210px;
    padding:10px;
    height:92%;
    margin-top:10px;
    border:solid 1px #025397;
}
    .NewsBar a
    {
        color:Black;
        font-size:smaller;
        font-weight:bolder;
        text-decoration:none;
    }
    .NewsBar a:visited
    {
        color:Black;
        font-size:smaller;
        font-weight:bolder;
        text-decoration:none;
    }
    .NewsBar a:hover
    {
        color:Black;
        font-size:smaller;
        font-weight:bolder;
        text-decoration:none;
    }
    .NewsBar a:active
    {
        color:Black;
        font-size:smaller;
        font-weight:bolder;
        text-decoration:none;
    }
    
.NewsBody
{
    width:400px;
    padding:10px;
    height:92%;
    margin-top:10px;
    word-wrap: break-word;
}

.allowSpaceForMoreOn
{
    width:650px;
    height:500px;
}

.NavBox 
{
    background: #ffffff;
    width:140px;
    padding:0px;
    height: 92%;
    float:left;
    border:none 0px #025397;
}

.NavBox ul
{
	margin-left: 0;	
}

.NavBox li
{
	margin-bottom: 4px;
	float:left;
	width: 142px;
	background-image: url(images/BoxNavBtn.png);
	background-repeat:no-repeat;
	background-color: Transparent;
	/*border: solid 1px #025397;*/
	background-position: -4px -4px;
	font-size:smaller;
	list-style:none;
	list-style-position:outside;
	height: 37px;
}

.NavBox li:hover
{
    background-position: -4px -49px; 
}

.NavBox li a
{
	display:block;
	padding: 3px 2px 4px 19px;
	margin: 0px;
	height: 30px;
}

.CentreWrapper
{
    width: 500px;
    float: right;
}

.CentreContent
{
	width: 500px;
	
}

    .CentreContent p
	{
	    margin: 8px 0px 8px 12px;
	    text-align:justify;
	    padding:0px;
	}
	
	.CentreContent ul
	{
	    padding:0px;
	    margin: 0px;
	}
	.CentreContent li
	{
	    margin-left: 50px;
	    margin-top:0px;
	    margin-bottom:0px;
	    text-indent: 0px;
	    list-style-position:outside;
	    padding: 0px 0px 5px 2px;
	    list-style-image: url(images/plainbullet.gif);
	}
	
    .sub li
    {
        margin-left:20px;
        list-style-image: url(images/bullet2.gif);
    }
		
	.CentreContent h3
	
    {
        color:#243A6A;
        font-size: small;
        margin-bottom: 10px;
	}
    
    .CentreContent h2 /*Main Center Content Header*/
    {
        color: #72baf6;
        margin-bottom: 5px;
    }
    
    .CentreContent .quote
    {
        margin-left: 30px;
        margin-right: 30px;
        font-style:italic;
        font-weight:bold;
        color: #ff9000;
    }
    
    .CentreContent img
    {
        padding: 5px;
    }
    
    .CentreContent img.noPadding
    {
        padding:0px;
    }
    
.TextCentre
{
    width:100%;
    text-align:center;
}
    
.Scrollable
{
    overflow-x:hidden;
    overflow-y: auto;
    padding-right:10px;
}

.NavBox li.NavSelected
{
    background-position: -4px -94px;
}

.NavBox li:hover
{
	background-color: #fafaff;
	
}

.paddedImg
{
    margin-left:5px;
    margin-right:5px;
}

.TestAndNewsHead
{
    background-color:#F47F04;
    padding:2px;
}

.DashedUnder
{
    border-bottom:dashed thin #CCCCCC;
}

.Job
{
    /*font-size:smaller;*/
}
    .Job h2
    {
        /*font-size:medium;*/
    }
    
.ErrorText
{
    color:Red;
    font-size:x-small;
}

/**
Stylesheet: Slideshow.css
	CSS for Slideshow.

License:
	MIT-style license.

Copyright:
	Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/).
	
HTML:
	<div class="slideshow">
		<div class="slideshow-images" />
		<div class="slideshow-captions" />
		<div class="slideshow-controller" />
		<div class="slideshow-loader" />
		<div class="slideshow-thumbnails" />
	</div>
	
Notes:
	These next four rules are set by the Slideshow script.
	You can override any of them with the !important keyword but the slideshow probably will not work as intended.
*/

.slideshow {
	display: block;
	position: relative;
	z-index: 0;
	
}
.slideshow-images {
	display: block;
	overflow: hidden;
	position: relative;
}		
.slideshow-images img {
	display: block;
	position: absolute;
	z-index: 1;
}		
.slideshow-thumbnails {
	overflow: hidden;
}

/**
HTML:
	<div class="slideshow-images">
		<img />
		<img />
	</div>
	
Notes:
	The images div is where the slides are shown.
	Customize the visible / prev / next classes to effect the slideshow transitions: fading, wiping, etc.
*/

.slideshow-images {
	height: 200px;
	width: 250px;
}		
.slideshow-images-visible { 
	opacity: 1;
}	
.slideshow-images-prev { 
	opacity: 0; 
}
.slideshow-images-next { 
	opacity: 0; 
}
.slideshow-images img {
	float: left;
	left: 0;
	top: 0;
}	

/**
Notes:
	These are examples of user-defined styles.
	Customize these classes to your usage of Slideshow.
*/

.slideshow {
	position: relative; 
	height: 200px;
	margin: 0 auto;
	width: 350px;
	border: solid 2px black;
}
.slideshow a img {
	border: 0;
}

/**
HTML:
	<div class="slideshow-captions">
		...
	</div>
	
Notes:
	Customize the hidden / visible classes to affect the captions animation.
*/

.slideshow-captions {
	background: #000;
	bottom: 0;
	color: #FFF;
	font: normal 12px/22px Arial, sans-serif;
	left: 0;
	overflow: hidden;
	position: absolute;
	text-indent: 10px;
	width: 100%;
	z-index: 10000;
}
.slideshow-captions-hidden {
	height: 0;
	opacity: 0;
}
.slideshow-captions-visible {
	height: 22px;
	opacity: .7;
}

/**
HTML:
	<div class="slideshow-controller">
		<ul>
			<li class="first"><a /></li>
			<li class="prev"><a /></li>
			<li class="pause play"><a /></li>
			<li class="next"><a /></li>
			<li class="last"><a /></li>
		</ul>
	</div>
	
Notes:
	Customize the hidden / visible classes to affect the controller animation.
*/

.slideshow-controller {
	background: url(controller.png) no-repeat;
	height: 42px;
	left: 50%;
	margin: -21px 0 0 -119px;
	overflow: hidden;
	position: absolute;
	top: 50%;
	width: 238px;
	z-index: 10000;
}
.slideshow-controller * {
	margin: 0;
	padding: 0;
}
.slideshow-controller-hidden { 
	opacity: 0;
}
.slideshow-controller-visible {
	opacity: 1;
}
.slideshow-controller a {
	cursor: pointer;
	display: block;
	height: 18px;
	overflow: hidden;
	position: absolute;
	top: 12px;
}
.slideshow-controller a.active {
	background-position: 0 18px;
}
.slideshow-controller li {
	list-style: none;
}
.slideshow-controller li.first a {
	background-image: url(controller-first.gif);
	left: 33px;
	width: 19px;
}
.slideshow-controller li.last a {
	background-image: url(controller-last.gif);
	left: 186px;
	width: 19px;
}
.slideshow-controller li.next a {
	background-image: url(controller-next.gif);
	left: 145px;
	width: 28px;
}
.slideshow-controller li.pause a {
	background-image: url(controller-pause.gif);
	left: 109px;
	width: 20px;
}
.slideshow-controller li.play a {
	background-position: 20px 0;
}
.slideshow-controller li.play a.active {
	background-position: 20px 18px;
}
.slideshow-controller li.prev a {
	background-image: url(controller-prev.gif);
	left: 65px;
	width: 28px;
}

/**
HTML:
	<div class="slideshow-loader" />
	
Notes:
	Customize the hidden / visible classes to affect the loader animation.
*/

.slideshow-loader {
	height: 28px;
	right: 0;
	position: absolute;
	top: 0;
	width: 28px;
	z-index: 10001;
}
.slideshow-loader-hidden {
	opacity: 0;
}
.slideshow-loader-visible {
	opacity: 1;
}

/**
HTML:
	<div class="slideshow-thumbnails">
		<ul>
			<li><a class="slideshow-thumbnails-active" /></li>
			<li><a class="slideshow-thumbnails-inactive" /></li>
			...
			<li><a class="slideshow-thumbnails-inactive" /></li>
		</ul>
	</div>
	
Notes:
	Customize the active / inactive classes to affect the thumbnails animation.
	Use the !important keyword to override FX without affecting performance.
*/

.slideshow-thumbnails {
	bottom: -65px;
	height: 65px;
	left: 0;
	position: absolute;
	width: 100%;
}
.slideshow-thumbnails * {
	margin: 0;
	padding: 0;
}
.slideshow-thumbnails ul {
	height: 65px;
	left: 0;
	position: absolute;
	top: 0;
	width: 10000px;
}
.slideshow-thumbnails li {
	float: left;
	list-style: none;
	margin: 5px 5px 5px 0;
	position: relative;
}
.slideshow-thumbnails a {
	display: block;
	float: left;
	padding: 5px;
	position: relative; 
}
.slideshow-thumbnails a:hover {
	background-color: #FF9 !important;
	opacity: 1 !important;
}
.slideshow-thumbnails img {
	display: block;
}
.slideshow-thumbnails-active {
	background-color: #9FF;
	opacity: 1;
}
.slideshow-thumbnails-inactive {
	background-color: #FFF;
	opacity: .5;
}