﻿@import url(reset.css);



body
{
	background: #b3bdca;
	border: none;
	font: normal 11px/15px helvetica,arial;
	margin: 0;
	padding: 0;
	position: relative;
	height: 100%;
}
form
{
	background: #b3bdca;
	display: block;
	height: 588px;
	margin: 0;
	padding: 0;
	width: 720px;
}
h1, h2, h3, h4 
{
	margin: 0;
	padding: 0;
}
img 
{
	border: none;
}

.transparent {
	/* Required for IE 5, 6, 7 */
	/* ...or something to trigger hasLayout, like zoom: 1; */
	width: 100%; 
		
	/* Theoretically for IE 8 & 9 (more valid) */	
	/* ...but not required as filter works too */
	/* should come BEFORE filter */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	
	/* This works in IE 8 & 9 too */
	/* ... but also 5, 6, 7 */
	filter: alpha(opacity=50);
	
	/* Older than Firefox 0.9 */
	-moz-opacity:0.5;
	
	/* Safari 1.x (pre WebKit!) */
	-khtml-opacity: 0.5;
    
	/* Modern!
	/* Firefox 0.9+, Safari 2?, Chrome any?
	/* Opera 9+, IE 9+ */
	opacity: 0.5;
}

.header 
{
	background: url(../images/menuGrad.gif) repeat-x 0 0;	
	display: block;
	width: 720px;
	height: 62px;
	position: relative;
	z-index: 99;
}
#nav 
{
	display: block;
	background: url(../images/mymasternaut.png) no-repeat 3px 10px;
	width: 715px;
	height: 24px;
	padding: 38px 0 0 10px;
	margin: 0;
	list-style-type: none;
	position: relative;
	z-index: 99;
}
#nav li
{
	display: block;
	float: left;
	padding: 0;
	position: relative;	
	overflow: visible;
	z-index: 99;
	height: 24px;
}
#nav li ul
{
	display: none;
	position: absolute;
	top: 24px;
	left: -8px;
}
#nav li ul li
{
	clear: both;
	z-index: 99;
	position: relative;	
}
#nav li ul li a 
{
	background: #ddd none;	
	color: #353535;
	width: 95px;
	height: 25px;
	line-height: 25px;
	padding: 0 5px;
	border-bottom: 1px solid #fff;	
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;	
	clear: both;		
}
#nav li ul li a  
{
	width: 110px;
}
#nav li ul li a:active,
#nav li ul li a:hover 
{
	color: #ddd;	
	background: #353535 none;		
	text-decoration: none;
}

#nav li a,
#nav li
{
	color: #fff;
	display: block;
	text-decoration: none;
	float: left;
	overflow: visible;	
	z-index: 99;
	position: relative;
	padding: 0;
	margin: 0;
}
#nav li a 
{
	font-size: 120%;	
}
#nav li span
{
	display: block;
	float: left;
	margin: 0 5px;
	color: #fff;
}
#nav li a:active,
#nav li a:hover,
#nav li a.selected:active,
#nav li a.selected:hover,
#nav li a.selected
{
	color: #fff;
	text-decoration: underline;
	cursor: pointer;
}
li a#ctl00_mainContent_topNav_cs:hover,
li a#ctl00_mainContent_topNav_training:hover
{
	text-decoration: none;
}
#innerContainer
{
	margin: 0;
	width: 720px;
	background: #fff url(../images/crosshairs.gif) repeat-x 0 0;
	height: 538px;
	overflow-y: scroll;
	overflow-x: hidden;
	position: relative;
	z-index: 1;
}

.contentAbove
{
	margin-top: 10px;
}

.column 
{
	float: left;
}
#leftColumn
{
	width: 465px;
}
#rightColumn
{

}

.panel
{
	padding: 0; 
}
.panel a
{
	display: block;
}

#promoPanel 
{
	display: block;
	background: url(../images/adsus.png) no-repeat 0 0;
	height: 165px;
	width: 433px;
	text-decoration: none;	
	margin: 15px 0 0 15px;	
}
#promoPanel span 
{
	display: block;
	margin-left: 20px;
	color: #fff;
	text-decoration: none;
	font-size: 100%;
	line-height: 120%;
	padding-top: 95px;
	width: 60%;
}
#promoPanel span.moreText
{
	padding-top: 5px;
	color: #de8830;
	font-weight: bold;
}
#supportingPromoPanel 
{
	display: block;
	background: url(../images/techfund.gif) no-repeat 0 0;
	height: 165px;
	width: 220px;
	text-decoration: none;	
	margin: 15px 0 0 0;	
}
#supportingPromoPanel span 
{
	display: block;
	visibility: hidden;
	margin-left: 20px;
	color: #fff;
	text-decoration: none;
	font-size: 100%;
	line-height: 120%;
	padding-top: 95px;
	width: 60%;
}

#supportingPanel 
{
	margin: 15px 0 0 25px;
}

#supportingPanel .innerPanel
{
	background: #d7d7d7;
	width: 220px;
	height: 145px;
	border-left: 1px solid #d5d6d6;
	border-right: 1px solid #d5d6d6;	
}
#supportingPanel img.title 
{
	margin: 10px 0 25px 15px;
}
#supportingPanel p 
{
	color: #616971;
	text-align: left;
	padding: 0 5px 6px 0;
	margin: 0 0 0 15px;
	font-size: 120%;
}
#supportingPanel strong
{
	font-weight: bold;	
}
#supportingPanel a
{
	display: inline;
	color: #ca0d89;
	text-decoration: none;
	padding: 0;
}
#supportingPanel a:active,
#supportingPanel a:hover 
{
	text-decoration: underline;
}
#supportingPanel img.smallarrow 
{
	position: relative;
	right: 2px;
	top: 1px;
}

.panel ul,
.panel li
{
	display: block;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
#newsPanel,
.newsPanel,
#productsPanel,
.productsPanel
{
	background: url(../images/topPanel.gif) no-repeat 0 0;	
	width: 327px;
	padding-top: 62px;
	margin: 15px 0 15px 15px;
	position: relative;
	z-index: 1;	
}

.panelItems 
{
	overflow: hidden;
	margin-top: -67px;	
}
.frontPage .panelItems 
{
	height: 250px;
}
.frontPage #newsPanel .panelItems 
{
	overflow-y: scroll;
	width: 310px;
	position: relative;
	right: -1px;
}
#newsPanel .innerPanel,
.newsPanel .innerPanel,
#productsPanel  .innerPanel,
.productsPanel  .innerPanel
{
	background:  #fcfcfc;
	border-left: 1px solid #d5d6d6;
	border-right: 1px solid #d5d6d6;
	padding: 20px 0 0 15px;
	width: 288px;
	position: relative;
	z-index: 90;

}
#newsPanel .innerPanel, 
.newsPanel .innerPanel,
#productsPanel  .innerPanel,
.productsPanel  .innerPanel 
{
	padding-right: 0;
	width: 310px;
}
.productsPage #vtPanel .innerPanel 
{
	background:  #fcfcfc url(../images/vehicles.gif) no-repeat 200px bottom;
}
.productsPage #mwaPanel .innerPanel 
{
	background:  #fcfcfc url(../images/mobileDevice.gif) no-repeat 230px bottom;
}
.productsPage #vlPanel .innerPanel 
{
	background:  #fcfcfc url(../images/people-eye.gif) no-repeat 180px bottom;
}
.productsPage #bmsPanel .innerPanel 
{
	background:  #fcfcfc url(../images/microsoft-dynamics.gif) no-repeat 190px bottom;
}
.productsPage #gfPanel .innerPanel 
{
	background:  #fcfcfc url(../images/greenerfleet.gif) no-repeat 190px bottom;
}
#newsPanel h2, 
.newsPanel h2,
#productsPanel h2,
.productsPanel h2
{
		
	margin-bottom: 15px;
	padding-left: 24px;	
	position: relative;
	top: -62px;	
	width: 286px;
}
#newsPanel ul,
.newsPanel ul,
#productsPanel ul,
.productsPanel ul
{
}
#newsPanel *, 
.newsPanel *, 
#productsPanel *,
.productsPanel *
{
	position: relative;
	z-index: 90;
}

#contactPanel li 
{
	padding-bottom: 4px;
}
#newsPanel h2,
.newsPanel h2,
#productsPanel h2,
.productsPanel h2,
#storyPanel h1,
#storyPanel h2
{
	color: #616971;
	font-size: 1.5em;	
	padding-bottom: 8px;
}

#newsPanel h2, 
.newsPanel h2 
{
	background: url(../images/pinkGrid.gif) no-repeat 0 0;
}
#productsPanel h2, 
.productsPanel h2 
{
	background: url(../images/orangeGrid.gif) no-repeat 0 0;
}
#storyPanel h1 
{
	font-size: 1.4em;		
}
#storyPanel h2 
{
	font-style: normal;	
}
#newsPanel li, 
.newsPanel li, 
#productsPanel li,
.productsPanel li
{	
	padding: 5px 10px 10px 0;
}
#innerContainer .userguidesPage .productPanel li,
#innerContainer .productsPage .productPanel li
{	
	padding: 5px 10px 10px 25px;
}
#newsPanel li, 
.newsPanel li 
{
	background: url(../images/pinkArrow.gif) no-repeat 10px 10px;
}
#productsPanel li, 
.productsPanel li
{
	background: url(../images/orangeArrow.gif) no-repeat 10px 10px;
}
.frontPage #newsPanel li,
.frontPage #productsPanel li
{
	padding-left: 0;	
	padding-bottom: 0;
	background: none;
	height: 58px;
}
#newsPanel ul, 
.newsPanel ul, 
#productsPanel ul,
.productsPanel ul
{	
	padding-bottom: 0;
}
#newsPanel li a,
.newsPanel li a,
#productsPanel li a,
.productsPanel li a
{
	color: #616971;
	font-size: 1.2em;
	text-decoration: none;
}
#newsPanel li span,
.newsPanel li span,
#productsPanel li span,
.productsPanel li span
{
	display: block;
	float: left;
	margin-right: 5px;
	margin-bottom: 10px;
	width: 50px;
}
#productsPanel li span
,productsPanel li span 
{
	padding: 2px 2px 3px 2px;
	width: 50px;
	text-align:center;
}
#newsPanel li img,
.newsPanel li img
{
	border: 1px solid #616971;	
}
#newsPanel li#newsItem1 img,
.newsPanel li#newsItem1 img 
{
	display: block;
}
#productsPanel li a,
.productsPanel li a
{
	padding-top: 8px;
}
#productsPanel li span,
.productsPanel li span
{
	margin-top: -8px;
	overflow: visible;
}
#newsPanel li#newsItem1 a, 
.newsPanel li#newsItem1 a 
{
	font-size: 1.4em;
	font-weight: bold;
}
#newsPanel li#newsItem1, 
.newsPanel li#newsItem1 
{
	padding-bottom: 5px;
	margin-bottom: 5px;
	border-bottom: 1px dashed #616971;
	clear: both;
}
.productsPage #newsPanel li a,
.productsPage #productsPanel li a,
.userguidesPage #newsPanel li a,
.userguidesPage #productsPanel li a
{
	font-size: 1.0em;
}
#newsPanel li a:active,
#newsPanel li a:hover,
.newsPanel li a:active,
.newsPanel li a:hover
{
	color: #ca0d89;
}
#productsPanel li a:active,
#productsPanel li a:hover,
.productsPanel li a:active,
.productsPanel li a:hover
{
	color: #ffa600;
}
.productPanel li 
{
	display: block;
	float: left;
	width: 38%;
}
.productPanel li.clear 
{
	clear: both;
	width: 80%;
}

.clearafter:after { content: ""; display: block; height: 0; clear: both; }
.clearafter { height: 100%; }

#topMenu
{
	background: url(../images/topMenu.gif) no-repeat 0 0;
	height: 90px;
	width: 100%;	
}
#bottomMenu
{
	background: url(../images/bottomMenu.gif) no-repeat 0 0;	
	height: 26px;
	width: 100%;
}


#storyPanel 
{
	font-size: 1.4em;
}
#storyPanel h1
{
	color: #888;
	line-height: 1.0em;	
	margin-top: -25px;	
	padding: 0 20px;
	position: relative;
}
#storyPanel h1 a
{
	position: absolute;
	top: 0px;
	right: 15px;
	font-style: normal;
	font-weight: normal;
	font-size: 0.7em;
}
#storyPanel h2 
{
	line-height: 1.0em;		
	overflow: visible;
	color: #233a84;
	padding: 10px 15px 15px 20px;
}
#storyPanel .storyDateCat 
{
	color: #6a6971;
}
#storyPanel .storyDate
{
	padding: 0 0 0 0;	
}
#storyPanel .storyCat
{
	padding: 0 0 0 20px;	
}
#storyPanel .storyBody
{
	padding: 20px 15px 10px 20px;
	line-height: 1.25em;
}
#storyPanel .storyBody a
{
	color: #ef9c00;
	font-weight: bold;
}
#backToNews
{
	padding: 20px 15px 10px 20px;	
	text-align: right;
}
#backToNews a,
#storyPanel h1 a,
#newsarea h1 a
{
	color: #ef9c00;	
}
#storyPanel
{
	background: #b3bdca url(../images/storyGrad.gif) repeat-y 0 0;
}

#clearbottom 
{
	clear: both;
	font-size: 1px;
	height: 1px;
	line-height: 1px;	
	width: 100%;
}

.clear 
{
	clear: both;
}

.storyPage #newsarea 
{
	padding: 30px;
}
.storyPage #newsarea h1,
#popup h1 
{
	background: url(../images/orangeGrid.gif) no-repeat 0 0;
	color: #6a6971;
	width: 95%;
	font-size: 150%;
	padding: 3px 0 8px 25px;
	border-bottom: dotted 1px #898f95;
	position: relative;
}
.storyPage #newsarea h1 a 
{
	position: absolute;
	right: 0;
	padding-right: 0;
	font-size: 66%;
}
.storyPage #newsarea h2 
{
	font-size: 200%;
	line-height: 130%;
	padding: 20px 0;
	color: #6a6971;
	font-weight: bold;
}
.storyPage #newsarea .storyBody img.storyImg,
.storyPage #newsarea .storyBody #imgWrapper
{
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
	width: 285px;
	display: block;
}
.storyPage #newsarea .storyBody #imgWrapper img 
{
	margin: 0;
}
.storyPage #newsarea .storyBody #imgWrapper span 
{
	font-size: 80%;
	font-weight: bold;
	display: block;
	background-color: #f0f0f0;
	padding:10px;
}
.storyPage #newsarea .storyBody 
{
	font-size: 130%;
	line-height: 140%;
	color: #6a6971;
}
.storyPage #newsarea .storyDateCat 
{
	color: #6a6971;
}

.customerServicesPage p 
{
	font-size: 1.9em; 
	font-weight: bold; 
	width: 100%; 
	text-align: center; 
	padding-top: 150px;	
}

.requestRingBack 
{
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	width: 135px;
	height: 19px;
	background: url(../images/callback.gif) no-repeat 0 0;
	position: absolute;
	top: 12px;
	right: 5px;
	z-index: 1000;
}

.autocomplete_completionListElement 
{  
	margin : 0px!important;
	background-color : #ffffff;
	color : windowtext;
	border : buttonshadow;
	border-width : 1px;
	border-style : solid;
	cursor : 'default';
	overflow : auto;
	height : 200px;
    text-align : left; 
    list-style-type : none;
}

/* AutoComplete highlighted item */

.autocomplete_highlightedListItem
{
	background-color: #ffff99;
	color: black;
	padding: 1px;
}

/* AutoComplete item */

.autocomplete_listItem 
{
	background-color : window;
	color : windowtext;
	padding : 1px;
}

#innerContainer .jobsTable 
{
	margin: 10px 0 0 0;
	width: 100%;
}
#innerContainer .jobsTable th, 
#innerContainer .jobsTable td 
{
	padding: 4px 4px 6px 4px;
	border: none;
	text-align: center;
}

.instructions 
{
	display: block;
	padding-top: 13px;	
}
.instructions img 
{
	padding-left: 10px;
}

.questionMark
{
	padding-left: 10px;
}

#jobTableNav 
{
	display: block;
	width: 100%;
	height: 19px;
	line-height: 19px;
	overflow: hidden;
	margin-bottom: -10px;
	padding-top: 13px;
}
#jobTableNav li 
{
	background: url(../images/tabOut.gif) no-repeat 0 0;
	cursor: pointer;
	display: block;
	height: 19px;
	float: left;
	text-align: center;
	width: 125px;
	text-transform: uppercase;
}
#jobTableNav li.over, 
#jobTableNav li.selected
{
	background: url(../images/tabOver.gif) no-repeat 0 0;	
	color: #ffa800;
}

.toolTip
{
	display:none;
	border: solid 1px black;
	width: 250px;
	background-color: #3F3F3F;
	color: White;
	position: absolute;
	padding: 10px 10px 10px 10px;
	left: 25px;
	top: 20px;
	text-align: left;
}

.noteToolTip
{
	display:none;
	border: solid 1px black;
	width: 400px;
	background-color: #3F3F3F;
	color: White;
	position: absolute;
	padding: 10px 10px 10px 10px;
	left: 25px;
	top: 20px;
	overflow: auto; 
	height: 250px;
	text-align:left;
}



.toolTip a
{
	color: White;
	
}


.toolTip p
{
	display: block;
	padding: 0 0 5px 0;
	font-weight:bold;
}

.noteToolTip a
{
	color: White;
	
}

.requestFormTableLeft
{
	float:left;
	padding-right:15px;
}

.requestFormTable td
{
	padding-right:10px;
	padding-bottom:5px;
	text-align:right;
	vertical-align:top;
}

.noteToolTip p
{
	display: block;
	padding: 0 0 5px 0;
	font-weight:bold;
}

.noteCloseX
{
	display: block;
	cursor: pointer;
	font-weight:bold;
	font-family:Arial;
	font-size:12pt;
	text-align:right;
}

.gridImage img
{
	 text-align: center;
}

.toolTipContainer 
{
	position: relative;

}

.popUp table
{
	border-spacing: 4;
}