@charset "UTF-8";
/* CSS Document */

/***********************************************************************/
/* dirtyfork | juicyapple                                              */
/***********************************************************************/

body
{
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #FFF;
	font-size: 13px;
}

/* force a vertical scroll in firefox (prevents page jumping) */
html 
{
	min-height: 100%;
	margin-bottom: 1px;
}


/***********************************************************************/
/* main containers                                                     */
/***********************************************************************/

#wrap
{
	margin: 0px auto;
	padding: 0px;
	width: 801px;
}

#content
{
	float: left;
	margin: 10px 0px 3px 0px;
	padding: 0px 19px 0px 0px;
	width: 780px;
	border: solid 1px #7f7f7f;
}

#top
{
	float: left;
	margin: 0px;
	padding: 0px 0px 0px 19px;
	width: 761px;
}

#top h1
{
	margin: 0px;
	padding: 0px;
	font-size: 0px;
	float: left;
	width: 761px;
}

#banner
{
	float: left;
	margin: 0px;
	padding: 0px 0px 10px 19px;
	width: 761px;
}

#flashBox
{
	float: left;
	margin: 0px;
	padding: 0px 0px 10px 19px;
	width: 761px;
}

/***********************************************************************/
/* main Navigation                                                     */
/***********************************************************************/

#mainNavWrap
{
	float: left;
	margin: 0px;
	padding: 0px 0px 10px 19px;
	width: 761px;
	height: 23px;
}

#mainNavigation
{
	float: left;
	margin: 0px;
	padding: 0px 0px 10px 0px;
	width: 761px;
	height: 23px;
	background: url(/chelaguard/images/top_nav_bg.jpg) top left repeat-x;
}
	
#mainNavigation a 
{		
	float: left;
	color: #FFF;
	font-weight: normal;
	margin: 0px;
	padding: 0px;
	height: 23px;
	text-indent: -999999px;
}

.mNAbout
{
	border-right: 1px #FFFFFF solid;
	width: 148px;
	float: left;
}

a.mNAbout
{
	float: left;
	background: url(/chelaguard/images/nav_about_normal.jpg) top left no-repeat;
}

a.mNAbout:hover
{
	background: url(/chelaguard/images/nav_about_over.jpg) top left no-repeat;
}

.mNPurchase
{
	border-right: 1px #FFFFFF solid;
	width: 133px;
	float: left;
}

a.mNPurchase
{
	float: left;
	background: url(/chelaguard/images/nav_purchase_normal.jpg) top left no-repeat;
}

a.mNPurchase:hover
{
	background: url(/chelaguard/images/nav_purchase_over.jpg) top left no-repeat;
}

.mNCase
{
	border-right: 1px #FFFFFF solid;
	width: 104px;
	float: left;
}

a.mNCase
{
	float: left;
	background: url(/chelaguard/images/nav_case_normal.jpg) top left no-repeat;
}

a.mNCase:hover
{
	background: url(/chelaguard/images/nav_case_over.jpg) top left no-repeat;
}


.mNCost
{
	border-right: 1px #FFFFFF solid;
	width: 106px;
	float: left;
}

a.mNCost
{
	float: left;
	background: url(/chelaguard/images/nav_cost_normal.jpg) top left no-repeat;
}

a.mNCost:hover
{
	background: url(/chelaguard/images/nav_cost_over.jpg) top left no-repeat;
}

.mNTechnical
{
	border-right: 1px #FFFFFF solid;
	width: 159px;
	float: left;
}

a.mNTechnical
{
	float: left;
	background: url(/chelaguard/images/nav_technical_normal.jpg) top left no-repeat;
}

a.mNTechnical:hover
{
	background: url(/chelaguard/images/nav_technical_over.jpg) top left no-repeat;
}

.mNFAQ
{
	border-right: 1px #FFFFFF solid;
	width: 51px;
	float: left;
}

a.mNFAQ
{
	float: left;
	background: url(/chelaguard/images/nav_faq_normal.jpg) top left no-repeat;
}

a.mNFAQ:hover
{
	background: url(/chelaguard/images/nav_faq_over.jpg) top left no-repeat;
}

.mNContact
{
	width: 71px;
	float: left;
	border-right: solid 1px #FFFFFF;
}

a.mNContact
{
	float: left;
	background: url(/chelaguard/images/nav_contact_normal.jpg) top left no-repeat;
}

a.mNContact:hover
{
	background: url(/chelaguard/images/nav_contact_over.jpg) top left no-repeat;
}

/* body set roll over for Main Nav here */

body#aboutSelected #mainNavigation a.mNAbout
{
	background: url(/chelaguard/images/nav_about_over.jpg) top left no-repeat;
}

body#purchaseSelected #mainNavigation a.mNPurchase
{
	background: url(/chelaguard/images/nav_purchase_over.jpg) top left no-repeat;
}

body#caseSelected #mainNavigation a.mNCase
{
	background: url(/chelaguard/images/nav_case_over.jpg) top left no-repeat;
}

body#costSelected #mainNavigation a.mNCost
{
	background: url(/chelaguard/images/nav_cost_over.jpg) top left no-repeat;
}

body#technicalSelected #mainNavigation a.mNTechnical
{
	background: url(/chelaguard/images/nav_technical_over.jpg) top left no-repeat;
}

body#FAQSelected #mainNavigation a.mNFAQ
{
	background: url(/chelaguard/images/nav_faq_over.jpg) top left no-repeat;
}

body#contactSelected #mainNavigation a.mNContact
{
	background: url(/chelaguard/images/nav_contact_over.jpg) top left no-repeat;
}

/***********************************************************************/
/* SUB Navigation                                                      */
/***********************************************************************/

#subNav
{
	float: left;
	margin: 0px;
	padding: 0px 16px 150px 0px;
	width: 183px;
}
	
#subNav a
{		
	float: left;
	margin: 0px;
	padding: 0px;
	width: 183px;
	text-indent: -999999px;
}

.sNTrain
{
	width: 183px;
	float: left;
	height: 46px;
}

a.sNTrain
{
	float: left;
	background: url(/chelaguard/images/sub_nav_trains_normal.gif) top left no-repeat;
}

a.sNTrain:hover
{
	background: url(/chelaguard/images/sub_nav_trains_over.gif) top left no-repeat;
}

.sNBus
{
	width: 183px;
	float: left;
	height: 46px;
}

a.sNBus
{
	float: left;
	background: url(/chelaguard/images/sub_nav_buses_normal.gif) top left no-repeat;
}

a.sNBus:hover
{
	background: url(/chelaguard/images/sub_nav_buses_over.gif) top left no-repeat;
}

.sNApps
{
	width: 183px;
	float: left;
	height: 60px;
}

a.sNApps
{
	float: left;
	background: url(/chelaguard/images/sub_nav_apps_normal.gif) top left no-repeat;
}

a.sNApps:hover
{
	background: url(/chelaguard/images/sub_nav_apps_over.gif) top left no-repeat;
}


/* body set roll over here */

body#trainsSelected #subNav a.sNTrain
{
	background: url(/chelaguard/images/sub_nav_trains_over.gif) top left no-repeat;
}

body#busSelected #subNav a.sNBus
{
	background: url(/chelaguard/images/sub_nav_buses_over.gif) top left no-repeat;
}

body#appsSelected #subNav a.sNApps
{
	background: url(/chelaguard/images/sub_nav_apps_over.gif) top left no-repeat;
}

/* finish sub nav */

#brochureLink a
{
	float: left;
	margin: 0px;
	padding: 15px 0px 0px 19px;
	display: block;
	width: 164px;
	height: 38px;
	text-indent: 0px !important;
}

#brochureLink a:hover img
{
	filter: alpha(opacity=75); -moz-opacity:.75; opacity:.75;
}

/***********************************************************************/
/* home video and buttons build                                        */
/***********************************************************************/

#videoBox
{
	float: left;
	width: 324px;
	height: 196px;
	margin: 0px;
	padding: 11px 0px 0px 18px;
	background: url(/chelaguard/images/video_bg.jpg) top left no-repeat;
}

#videoBox span
{
	float: left;
	padding: 0px 10px;
	margin: 0px;
	color: #FFFFFF;
	width: 90px;
	font-size: 11px;
}

#videoBox span a strong
{
	font-size: 14px;
	font-weight: bold;
	/*padding-bottom: 10px !important;*/
}

#videoBox span a
{
	float: left;
	color: #FFFFFF;
	text-decoration: none;
}

#videoBox span a:hover
{
	float: left;
	color: #FFFFFF;
	text-decoration: underline;
}

#videoBox .left
{
	float: left;
}

#videoBox span a .right
{
	text-align: right;
}

#videoBox img
{
	padding: 0px;
	margin: 0px;
	float: left;
}

#flashContainerHome
{
	float: left;
}

.homeButtonsLeft
{
	float: left;
	width: 239px;
	margin: 0px;
	padding: 0px;
}

.homeButtonsLeft a
{
	float: left;
	margin: 0px;
	padding: 0px 0px 2px 0px;
	display: block;
	width: 237px;
	height: 48px;
}

.homeButtonsLeft a:hover img
{
	filter: alpha(opacity=75); -moz-opacity:.75; opacity:.75;
}

/* home link bottom of page */

#chelaHome
{
	float: left;
	padding: 0px 0px 0px 19px;
	width: 761px;
}

#chelaHome a
{
	color: #000000;
	text-decoration: underline;
	font-size: 10px;
}

#chelaHome a:hover
{
	color: #000000;
	text-decoration: none;
}


/***********************************************************************/
/* body build up                                                       */
/***********************************************************************/

#bodyAndBG
{
	float: left;
	margin: 0px;
	padding: 0px 0px 10px 0px;
	width: 780px;
}

#bodyContent
{
	float: left;
	margin: 0px;
	padding: 0px 0px 20px 0px;
	width: 581px;
}

/***********************************************************************/
/* BreadCrumbs                                                         */
/***********************************************************************/

#breadCrumbs
{
	float: left;
	margin: 0px;
	padding: 0px 0px 10px 0px;
	width: 581px;
	font-size: 11px;
	color: #666666;
}

#breadCrumbs a
{
	text-decoration: underline;
	color: #666666;
}

#breadCrumbs a:hover
{
	text-decoration: none;
	color: #666666;
}

/* general page container for  top nav pages */

#topLevelPageBuild
{
	float: left;
	margin: 0px;
	padding: 0px 0px 15px 0px;
	width: 581px;
}

/* end */

#pictureButtons
{
	float: left;
	margin: 0px;
	padding: 0px 0px 15px 0px;
	width: 588px;
}

#pictureButtons img
{
	padding: 0px 10px 0px 0px;
}

#pictureButtons a
{
	filter: none;
}

#pictureButtons a:hover img
{
	filter: alpha(opacity=75); -moz-opacity:.75; opacity:.75;
}

#level4
{
	float: left;
	margin: 0px;
	padding: 0px 50px 15px 0px;
	width: 404px;
}

#level4 h2
{
	font-size: 26px;
	color: #999999;
	margin: 0px;
	display: block;
	padding: 0px 0px 10px 0px;
	width: 404px;
}

#level4Right
{
	float: left;
	margin: 0px;
	padding: 0px 0px 15px 0px;
	width: 127px;
	font-size: 10px;
}

#level4Right a
{
	color: #000000;
	text-decoration: none;
}

#level4Right a:hover
{
	color: #000000;
	text-decoration: underline;
}

/* creative area */

#level5
{
	float: left;
	margin: 0px;
	padding: 0px 50px 15px 0px;
	width: 298px;
}

#level5 h2
{
	font-size: 26px;
	color: #999999;
	margin: 0px;
	display: block;
	padding: 0px 0px 10px 0px;
	width: 298px;
}

#level5Right
{
	float: left;
	margin: 0px;
	padding: 0px 0px 15px 0px;
	width: 210px;
}

#level5Right p
{
	font-size: 10px !important;
	font-weight: bold;
}

#level5Right a
{
	color: #9966ff;
	text-decoration: none;
	font-size: 10px;
	font-weight: bold;
}

#level5Right a:hover
{
	color: #9966ff;
	text-decoration: underline;
	font-weight: bold;
}

#level5Right a.selected, #level5Right a.selected:hover
{
	color: #9966ff;
	text-decoration: underline;
	font-weight: bold;
}

html:lang(en)>body .Displays { /* for Gecko (inc.ns7), Opera*/		
	display:block;
	height: auto;
}

/**+html shoppingBody
{	
	display: block; 
	height: auto; 
	min-height: 370px;
}*/

.Displays
{	
	float: left;
	width: 298px;
}

/* end */

/* prod list */
.prodList
{
	width: 404px;
	float: left;
	padding: 0px 0px 10px 0px;
	margin: 0px;
}

.prodList ul
{
	list-style: none;
	display: inline;
	float: left;
	margin : 0px;
	width: 404px;
	padding: 0px 0px 0px 0px;
}

.prodList li
{
	list-style: none;
	display: inline;
	float: left;
	margin : 0px;
	color: #000;
	font-size: 13px;
	font-weight: normal;
	width: 394px;
	padding: 1px 0px 1px 10px;
	background: url(/images/bullet.gif) top left no-repeat;
}

.prodList li strong
{
	font-size: 9px;
	font-weight: normal;
}

/* about list */
.aboutList
{
	width: 404px;
	float: left;
	padding: 0px;
	margin: 0px;
}

.aboutList ul
{
	list-style: none;
	display: inline;
	float: left;
	margin : 0px;
	width: 404px;
	padding: 0px 0px 0px 0px;
}

.aboutList li
{
	list-style: none;
	display: inline;
	float: left;
	margin : 5px 0px 9px 0px;
	color: #000;
	font-size: 16px;
	font-weight: normal;
	width: 394px;
	padding: 0px 0px 0px 10px;
	background: url(/images/bullet.gif) top left no-repeat;
}

.aboutList li strong
{
	color: #3399cc;
}

.aboutList .small
{
	font-size: 9px;
}

/***********************************************************************/
/* wLight footer                                                       */
/***********************************************************************/

#footerWlight
{
	float: left;
	margin: 0px;
	padding: 0px;
	width: 801px;
	color: #666;
	text-align: right;
	font-size: 10px;
}

#footerWlight a
{
	color: #000;
	text-decoration: none;
	font-size: 10px;
}

#footerWlight a:hover
{
	color: #000;
	text-decoration: underline;
	font-size: 10px;
}

/***********************************************************************/
/* basic xhtml settings                                                */
/***********************************************************************/

img
{
	border: none;
}

.clear
{
	clear: both;
	height: 1px;
	font-size: 1px;
}

.clearLine
{
	clear: both;
	height: 1px;
	font-size: 1px;
	border-top: solid 1px #000000;
	margin-bottom: 5px;
}

.float
{
	float: left;
}

.rightImg
{
	float: right;
	padding-left: 29px;
}

.smallCopy
{
	font-size: 10px;
	font-weight: bold;
}

.greyLink
{
	background: url(/chelaguard/images/pdf_icon_small.gif) top left no-repeat;
	padding-left: 29px;
}

.greyLink a
{
	color: #666666;
}

/***********************************************************************/
/* pop up settings for form                                            */
/***********************************************************************/

#backgroundPopup
{
	display:none;
	position:fixed;
	_position:absolute; /* hack for internet explorer 6*/
	height:100%;
	width:100%;
	top:0;
	left:0;
	background:#000000;
	z-index:1;
}

#popupContact
{
	display:none;
	position:fixed;
	_position:absolute; /* hack for internet explorer 6*/
	height:384px;
	width:408px;
	background:#FFFFFF;
	border:2px solid #cecece;
	z-index:2;
	padding:12px;
	font-size:13px;
}

#popupContactClose
{
	font-size:14px;
	line-height:14px;
	right:6px;
	top:4px;
	position:absolute;
	color:#6fa5fd;
	font-weight:700;
	display:block;
}

#button
{
	float: left;
}

/***********************************************************************/
/* form set up                                                         */
/***********************************************************************/

#formsetUp
{
	width: 460px;
	margin: 0px;
	padding: 20px;
}

form
{
  margin: 0;
  padding: 0;
}

fieldset
{
   border: 0;
   margin: 0;
   padding: 10px 0;
}

div.inlineform label
{
   float: left;
   clear: left;
   display: block;
   width: 115px;
   padding: 3px 3px 3px 0;
   text-align: left;
   margin-top: 7px;
   font-size: 1.1em;
   font-weight: bold;
}

div.inlineform input,
div.inlineform textarea
{
   float:left;
   width: 195px;
   padding: 2px;
   margin-top:7px;
   font-size: 1.1em;
}

div.inlineform input.text,
div.inlineform textarea
{
   border: 1px solid #B0B0B0;
}

div.inlineform input.button
{
   float: none;
   clear: both;
   text-align: center;
   background: url(/images/submit-back.jpg);
   color: #FFFFFF;
   border: 0;
   width: 56px;
   height: 25px;
   font-size: 1em;
   padding: 0;
   line-height: 23px;
   margin: 10px 0 10px 265px;
}

/***********************************************************************/
/* ZEBRA STYLING FOR TABULAR DATA                                      */
/***********************************************************************/

table.short {
	border-collapse: collapse;
	width: 500px;
	margin: 0px;
	font-size: 11px;
}

table.short th {
	background: #f2f2f2;
	color: #000;
	font-weight: bold;
	padding: 2px 11px;
	text-align: left;
	border-right: 1px solid #fff;
	line-height: 1.2em;
}

table.short td {
	padding: 6px 11px;
	border: 1px solid #babcbe;
	vertical-align: top;
	color: #000;
}

table.short td * {
	padding: 6px 11px;
}

table.short tr.alt td {
	background: #f2f2f2;
}

table.short tr.over td {
	background: #bcd4ec;
}

/***********************************************************************/
/* basic font settings                                                 */
/***********************************************************************/

h2
{
	font-size: 0px;
	margin: 0px;
	padding: 0px;
	display: block;
	float: left;
}

h2.guard
{
	font-size: 28px;
	color: #009999;
	margin: 0px 0px 15px 0px;
	width: 581px;
	display: block;
}

h3
{
	font-size: 16px;
	line-height: 17px;
	margin-top: 0px;
	margin-bottom: 8px;
	color: #3399cc
}

h4
{
	font-size: 16px;
	line-height: 17px;
	margin-top: 0px;
	margin-bottom: 8px;
	color: #000000
}

h4 strong
{
	color: #3399cc
}

h5
{
	font-style: italic;
	font-size: 15px;
	line-height: 17px;
	margin-top: 6px;
	margin-bottom: 3px;
	color: #3399cc
}

h6
{
	text-align: right;
	font-style: normal;
	font-size: 13px;
	line-height: 15px;
	color: #3399cc
}

p
{
	color: #000;
	font-size: 13px;
	line-height: 14px;
	margin: 0px;
	padding: 0px 0px 13px 0px;
}

p a
{
	color: #000000;
	text-decoration: none;
}

p a:hover
{
	color: #000000;
	text-decoration: underline;
}