@charset "utf-8";

*{
	margin:0;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
}

img{border:none;}/*rids of blue border on all images*/

body{
margin:0;
padding:0;
background:#fff;
}

p{
font-family:Arial, Helvetica, sans-serif;
margin-bottom:5px;
font-size:12px;
color:#000;
}

p.long{
line-height:18px;
text-align:justify;
margin-bottom:15px;
}
img.center{
margin-left:auto;
margin-right:auto;
display:block;
margin-bottom:20px;
}

h2.address a{
font-size:14px;
}
#getInTouch{position:absolute; bottom:0px; right:0px;width:120px; height:40px; z-index:1000;}
.pBreak{
max-height:1px;
border-bottom:1px dotted #ccc;
margin-bottom:5px;
}

span.warning{
position:absolute;
left:320px;
float:left;
color:#aa0000;
margin-top:5px;
}

.mdRed{
color:#aa0000;
}

.mdRed:hover{
color:#aa0000;
text-decoration:underline;
}

a{
font-family:Arial, Helvetica, sans-serif;
color:#2F6681;
font-weight:bold;
text-decoration:none;
}
a:hover{
font-family:Arial, Helvetica, sans-serif;
color:#2F6681;
text-decoration:underline;
}
img.mdtChat{background:url(../_images/mdtChat.jpg); width:110px; height:23px; position:absolute; top:275px; right:0px;}

.left{
float:left;
}

.right{
float:right;
}

img.prodRight{
float:right;
margin: 0 0 5px 10px;
border:none;
}

.clearBoth {
line-height: 0px;
font-size: 0px;
clear: both;
height: 0px;
} 

.clearLeft {
line-height: 0px;
font-size: 0px;
clear: left;
height: 0px;
} 

.clearRight {
line-height: 0px;
font-size: 0px;
clear: right;
height: 0px;
} 

#top{
margin:0;
padding:0;
background:url(../_images/top_bg.jpg) repeat-x top left;
width:100%;
height:20px;
position:relative;
}
#topInside{
margin:0 auto;
padding:0;
width:770px;
height:20px;
position:relative;
}

#topInside h2.topLeft{
float:left;
font-family:Arial, Helvetica, sans-serif;
line-height:20px;
color:#fff;
}

#topInside h2.topRight{
float:right;
font-family:Arial, Helvetica, sans-serif;
line-height:20px;
font-size:13px;
color:#fff;
}

#topInside h2.topRight a{
color:#fff;
text-decoration:underline;
font-family:Arial, Helvetica, sans-serif;
}

#topInside h2.topRight a:hover{
color:#fff;
text-decoration:none;
}

#wrapper{
width:770px;
min-height:10px;
margin:0 auto;
position:relative;
}

#header{
width:770px;
height:67px;
}
/*not in use - (used html img src instead)*/
h1.logo{
width:222px;
height:47px;
background:url(../_images/logo.jpg) no-repeat top left;
margin:10px 0 10px 0;
float:left;
}
h1.logo span{
display:none;
}

.logo{
margin:10px 0 10px 0;
float:left;
}

h3.number{
color:#aa0000;
float:right;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
margin-right:0;
}

h5.description{
color:#2F6681;
float:right;
font-family:Arial, Helvetica, sans-serif;
margin-top:46px;
font-size:16px;
}


#nav{
position:relative;
height:29px;
width:770px;
max-height:29px;
line-height:29px;
background:url(../_images/_nav_bg.jpg) no-repeat top left;
clear:both;
margin-bottom:10px;
z-index:9;
}

#nav ul{
position:relative;
list-style:none;
width:770px;
float:right;
display:inline;
}

#nav li{
float:left;
display:inline;
line-height: 29px;
position:relative;
}

#nav ul li a{
position:relative;
line-height:29px;
text-decoration:none;
color:#2F6681;
padding: 7px 10px 6px 10px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
border-left:1px solid #ccc;

}

#nav ul li a.home{
border:none;
}

#nav li a:hover li a{
display:block;
}

#nav ul li a.home:hover{
background:url(../_images/nav_bg_left_on.jpg) no-repeat top left;
}

#nav ul li a.home_current{
background:url(../_images/nav_bg_left_on.jpg) no-repeat top left;
color:#fff;
border:none;
}

#nav ul li a.home_current:hover{
background:url(../_images/nav_bg_left_on.jpg) no-repeat top left;
color:#fff;
border:none;
}

#nav ul li a:hover{
background:url(../_images/nav_bg_on.jpg) repeat-x top left;
padding: 7px 10px 6px 10px;
color:#fff;
}

#nav ul li a.current{
background:url(../_images/nav_bg_on.jpg) repeat-x top left;
padding: 7px 10px 6px 10px;
color:#fff;
}

#nav ul li a.current:hover{
background:url(../_images/nav_bg_on.jpg) repeat-x top left;
padding: 7px 10px 6px 10px;
color:#fff;
}

#nav ul li a.contact{
padding:8px 16px 5px 18px;
}

#nav ul li a.contact:hover{
background:url(../_images/nav_bg_right_on.jpg) no-repeat top right;
}

#nav li ul{
display:none;
z-index:1000;
}



#nav li:hover ul {
	display:block;
	color:#0033CC;
	position:absolute;
	top:29px;
	left:0;
	z-index:1000;
	height:25px;
	line-height:25px;
	width:0;
}


#nav ul ul:hover li{
	z-index:1000;
}

#nav ul ul li.last{
border-bottom:1px solid #ccc;
}

#nav ul ul li{
clear:both;
display:block;
width:180px;
border:1px solid #ccc;
border-bottom:0;
position:relative;
}

#nav ul ul li:hover{
color:#fff;
}

#nav li ul li a{
background:url(../_images/subNav_bg.gif) repeat-x top left;
}

#nav li ul li a:hover{
background:url(../_images/subNavOn_bg.jpg) repeat-x top left;
}

#nav li:hover ul li a{
display:block;
z-index:600;
border:0;
max-height:25px;
margin:0;
padding:0;
line-height:25px;
padding-left:10px;
}

/* Fix IE. Hide from IE Mac \*/
* html #nav ul li { float: left; }
* html #nav ul li a { height: 1%; }
/* End */


#nav li:hover ul, #nav li.over ul {
display:block;
}


#contentContainer{
width:770px;
min-height:50px;
position:relative;
}

#leftContent{/*is actually the right content....  (design change late in the game!)*/
width:600px;
float:right;
position:relative;
}

.watchVideo{}

#splash{
width:600px;
position:relative;
margin-bottom:5px;
}

.splashBorder{
border: 1px solid #ccc;
}

#enterprise{
width:293px;
min-height:79px;
float:left;
border:1px solid #ccc;
}

#smb{
width:293px;
min-height:79px;
float:right;
border:1px solid #ccc;
}

.bgGrad{
background:#fff url(../_images/box_bg.jpg) repeat-x top left;
padding:4px 8px 0 8px;
}

.bgGrad a{
font-weight:bolder;
}

h1.bg{
background:#aeaeae;
color:#fff;
line-height:20px;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
padding-left:10px;
border-bottom:1px solid #ccc;
}

.border{
padding:2px;
border:1px solid #000;
}

#rightContent{
width:160px;
float:left;
}

.rightBg{
width:158px;
float:right;
border:1px solid #ccc;
margin-bottom:10px;
}

#promo{
/*width:158px;*/
float:left;
display:inline;
}

#enterprise p, #smb p{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000;
}

#footer{
position:relative;
width:770px;
height:40px;
margin-top:10px;
border-top:1px solid #ccc;
}


#footer{
clear:both;
width:770px;
position:relative;
padding-top:5px;
}

#footer p{
margin-bottom:0;
padding-bottom:0;
color:#666666;
}

.black{
color:#000;
}

#footer ul{
position:relative;
list-style:none;
width:770px;
float:left;
display:block;
}

#footer li{
float:left;
display:block;
text-align:center;
line-height:30px;
position:relative;
}

#footer ul li a{
position:relative;
line-height:20px;
text-decoration:none;
color:#aeaeae;
padding:0 10px 0 10px;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
border-right:1px solid #aeaeae;
}

#footer ul li a.last{
position:relative;
line-height:20px;
text-decoration:none;
color:#aeaeae;
padding:0 10px 0 10px;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
border:none;
}

#footer ul li a:hover{
text-decoration:underline;
}

#footer a{
color:#666666;
text-decoration:none;
font-weight:normal;
}

#footer a:hover{
text-decoration:underline;
}

#subSplash{
margin-top:2px;
width:598px;
height:55px;
max-height:55px;
border: 1px solid #ccc;
background:#fff url(../_images/subSplashBg.jpg) repeat-y top left;
}

#competencies{
height:55px;
float:right;
}

#competenciesTech{
float:left;
border:1px solid #ccc;
width:598px;
}

#subSplashTech{
margin-top:2px;
}



/*start of image replacement/mouseover trick on home page*/
.rollover img{
padding-bottom:2px;
border-bottom:2px solid #aeaeae;
margin:2px 2px 0px 2px;
}

.rollover:hover{
background-color: transparent;
}

.rollover:hover img{
padding-bottom:2px;
border-bottom:2px solid #2F6681;
margin:2px 2px 0px 2px; 
}

.rollover span{ /*CSS for enlarged image*/
position: absolute;
left: -1000px;
visibility: hidden; 
color: #000;
text-decoration: none;
}

.rollover:hover span img{ /*CSS for enlarged image*/
border: 0;
}
.rollover span img{ /*CSS for enlarged image*/
border: 0;
}

.rollover:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: -1px;
left: -1px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

h1.mdt{
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
color:#2F6681;
margin-bottom:2px;
font-weight:normal;
}
h2.mdt{
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
color:#2F6681;
/*font-weight:normal;*/
font-weight:bold;
}
h3.mdt{
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#2F6681;
/*font-weight:normal;*/
}

.uppercase{text-transform:uppercase; font-weight:bold; margin-top:6px; margin-bottom:0px;}
.paragraphMargin{margin-top:10px;}

h2.address{
color:#666;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}

.borderBottom{
border-bottom:1px solid #ccc;
max-height:2px;
width:100%;
height:2px;
}

/*creates padded border around right side images*/
.imgPaddedBorder{
float: right;
border: 1px solid #ccc;
padding: 5px 5px 5px 5px;
margin-left:10px;
}

.copesan-banner{
float: right;
/*border: 1px solid #ccc;
padding: 5px 5px 5px 5px;*/
margin-left:10px;
}

.imgBorder{
border:1px solid #ccc;
}
/*end of 'creates padded border around right side images'*/

.top10{margin-top:10px;}
ul.list{margin-left:30px; margin-bottom:6px;}/*puts the left margin back into bulleted lists.  it was removed at the *{margin:0;}declaration.*/
ol.list{margin-left:30px; margin-bottom:6px;}
p.justify{text-align:justify;}

.vidPreview{
float:right;
margin:5px 0px 5px 10px;
}
.prodThumbsRight{
float:right;
border:1px solid #ccc;
padding:5px;
margin:0 0 5px 5px;
}

.prodThumbsLeft{
float:left;
border:1px solid #ccc;
padding:5px;
margin:0 5px 5px 0;
}

#block{width:372px;position:relative;}

.prodBlock{width:372px;}
.zebraProdBlock{width:600px;}
.imgFeatProdBorder{
border:1px solid #cccccc;
}

img.mc{
padding:2px;
border-bottom:2px solid #aeaeae;
margin:4px;
}
img.mc:hover{
border-bottom:2px solid #2F6681;
}

.rightTerminals{
width:294px; float:right;
}

.leftTerminals{
width:306px; float:left;
}

#contactDemo{
width:600px;
height:160px;
}

form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
  font:100% verdana,arial,sans-serif;
  margin: 0;
  padding: 0;
  min-width: 598px;
  max-width: 598px;
  width: 598px; 
}

form fieldset {
  /* clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
  border-color: #ccc;
  border-width: 1px;
  border-style: solid;
  padding: 10px;        /* padding in fieldset support spotty in IE */
  margin: 0;
  /*background:url(../_images/fieldsetbg.jpg) repeat-x top left;*/
}

form fieldset legend {
	font-size:1.1em; /* bump up legend font size, not too large or it'll overwrite border on left */
                       /* be careful with padding, it'll shift the nice offset on top of border  */
}

form label { 
	display: block;  /* block float the labels to left column, set a width */
	float: left; 
	width: 150px; 
	padding: 0; 
	margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right; 
}

form fieldset label:first-letter { /* use first-letter pseudo-class to underline accesskey, note that */
	text-decoration:none;    /* Firefox 1.07 WIN and Explorer 5.2 Mac don't support first-letter */
                                    /* pseudo-class on legend elements, but do support it on label elements */
                                    /* we instead underline first letter on each label element and accesskey */
                                    /* each input. doing only legends would  lessens cognitive load */
                                   /* opera breaks after first letter underlined legends but not labels */
}

form input, form textarea, form select {
	/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin:5px 0 0 10px; /* set margin on left of form elements rather than right of
                              label aligns textarea better in IE */
}

form input#reset {
	margin-left:0px; /* set margin-left back to zero on reset button (set above) */
}

.checkbox{font-size:12px; font-weight:bolder;}

textarea { overflow: auto; }

form small {
	display: block;
	margin: 0 0 5px 160px; /* instructions/comments left margin set to align w/ right column inputs */
	padding: 1px 3px;
	font-size: 88%;
}

form .required{} /* uses class instead of div, more efficient */

form br {
	clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */
}


.imgleft {
float: left;
padding: 6px 10px 6px 0px;
}

#qcContainer{
	margin:0 auto;
	width:600px;
	padding:40px;
	background-color:#fff;
}

#cn3specs{
clear:right;
float:right;
margin:10px 0 0 10px;
width:165px;
}

.video-center-object{text-align:center;margin:20px;}











.caption-right{
clear:both;
font-style:normal;
font-size:12px;
text-align:center;
width:215px;
float:right;
margin-top:5px;
margin-bottom:5px;
}
.caption-right a{
font-weight:normal;
text-decoration:underline;
}

.caption-right a:hover{
text-decoration:none;
}

.splash-image-border{
border:1px solid #ccc;
margin-bottom:16px;
}
#nav ul li a.job-openings{
	color:#aa0000;
}
#nav ul li a.job-openings:hover{
	color:#ff0000;
	background:none;
	padding: 7px 10px 6px 10px;
	text-decoration:underline;
}
.event-image-container{margin-bottom:10px;}
a img.event-image{
	padding:3px;
	border:1px solid #ccc;
}