/* CSS Document */

/* set all padding and margins to 0 */
*{
	padding:0;
	margin:0;
}

#container, #left-nav, #features, #content-area, #main-content{
overflow:hidden;
}

/* container */

#container{
width:900px;
margin:0 auto;
text-align:left;
}


/* Main styles */

body{
text-align:center;
font-family:verdana, arial, helvetica;
font-size:76%;
}

h1{

font-weight:bold;
padding-top:20px;
font-size:15px;
color:#000000;
padding-top:10px;
padding-bottom:10px;
line-height:0.2em;
}

h2{
font-size:0.9em;
font-weight:bold;
padding-top:20px;
padding-bottom:8px;
font-weight:100;
color:#EE1B2E;
}

h3{
font-size:1em;
font-weight:bold;
padding-top:20px;
text-transform:capitalize;
}

h4{
font-size:1.1em;
font-weight:bold;
padding-top:6px;
padding-bottom:6px;
padding-right:8px;
padding-left:8px;
color:white;
}

h5{
font-size:1.3em;
font-weight:bold;
padding-top:30px;
color:black;
}

p.home{
padding-top:10px;
font-size:0.8em;
font-weight:100;
}



p{
padding-bottom:8px;
font-size:0.85em;
}

div.strapline{
font-size:1em;
padding-top:10px;
width:460px;
}

div.breadcrumb{
font-size:0.85em;
font-weight:bold;
color:#EE1B2E;
}

div.breadcrumb a{
text-decoration:none;
color:#EE1B2E;
}

img{
border:0;
}

a{
color:#EE1B2E;
text-decoration:none;
}

a:hover{
color:#999999; 
}


p.italic{
font-style:italic;
color:#666666;
}


#logo{
width:400px;
height:65px;
float:left;
}

.welcome {
height:30px;
font-size:1.5em;
font-weight:400;
text-align:right;
margin-left: 270px;
}

#search{
width:400px;
height:50px;
float:right;
text-align:right;
padding-bottom:12px;
padding-top:20px;
}

ul.search-nav{
padding-top:20px;
}

ul.search-nav-home{
padding-top:5px;
}

ul.search-nav li, ul.search-nav-home li{
list-style:none;
display:inline;
padding-left:34px;
font-weight:bold;
}

ul.search-nav a, ul.search-nav-home a{
color:black;
text-decoration:none;
}

ul.search-nav a:visited, ul.search-nav-home a:visited{
color:black;
text-decoration:none;
}

ul.search-nav a:hover, a:visited a:hover{
color:#EE1B2E;
text-decoration:none;
}

.field {

width:100px;

}

/*dropdown navigation styles*/

#navigation{
width:900px;
height:24px;
background-color:#EE1B2E;
clear:both;
text-align: left;
}

#nav, #nav ul {
	width: 900px;
	list-style: none;
	line-height: 1;
	font-weight: bold;
	font-size:0.95em;
}

#nav a {
	display: block;
	color: white;
	text-decoration: none;
	padding: 0.25em 2em;
	border:2px;
}

#nav li {
	float: left;
	padding-left: 6px;
	padding-right: 12px;
	border:1px solid #EE1B2E;
	background-color: #EE1B2E;
}

#nav li a{
padding-bottom:8px;
}

#nav li ul {
	position: absolute;
	left: -999em;
	height: auto;
	width: 15.4em;
	w\idth: 13.9em;
	font-weight: normal;
	border-width: 0.25em;
	margin-left: -8px;
	margin-top:1.8px;
	font-size:0.85em;
}

#nav li li {
	width: 18.8em;
	w\idth: 18.9em;
	border:1px solid white;
	background-color:#e6e6e6;
	filter:alpha(opacity=95);
	-moz-opacity:0.95;
	-khtml-opacity: 0.95;
	opacity: 0.95;
	

}

#nav li ul a {
	width: 18.4em;
	w\idth: 18.9em;
	color:#808080;
}

#nav li ul a:hover {
	width: 18.4em;
	w\idth: 18.9em;
	color:#FFFFFF;
	background: url(../images/listbg_over_off.gif) no-repeat left top;

}



#nav li ul ul { /* position of 3rd level navigation */
	position: absolute;
	margin: -2em 0 0 198;
	font-size:1em;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
	left: auto;
}

#nav li:hover, #nav li.sfhover {
	background: #DADADA;
}

#nav li li:hover, #nav li li.sfhover {
	background: #EE1B2E;
	color:#FFFFFF;	
}

#nav li li:hover a, #nav li li.sfhover a {

color:#FFFFFF;

}

.level3 a {

color:#808080!important;

}

.level3 a:hover {

color:#FFFFFF!important;

}









/*banner*/

#banner{
width:900px;
height:130px;
margin-bottom:15px;
background-position: right;
background-repeat:no-repeat;
border-bottom: 1px solid #CCCCCC;
color:#999999!important;
}

/*Sub nav*/

#left-nav{
float:left;
width:165px;
font-size:0.85em;

}

ul.sub-nav li{
list-style:none;
padding-bottom:6px;
}

ul.sub-nav li a{
list-style:none;
text-decoration:none;
color:#000000;
}

ul.sub-nav li a:hover{
list-style:none;
text-decoration:none;
color:#EE1B2E;
}

ul.sub-nav li ul{
padding-left:20px;
padding-top:5px;
}

ul.sub-nav li ul li{
list-style-image: url(../images/arrow.gif);
list-style-type: circle;
}

ul.sub-nav li ul li a{
color:#EE1B2E;
}

ul.sub-nav li ul li a:hover{
color:#999999;
}


ul.sub-nav li ul li a.subnav-active{
text-decoration:underline;
}

ul.sub-nav li a.subnav-active{
color:red;
}


/*homepage content area*/

#home{
width:900px;
height:300px;
}


#home-mp3{
background: url(../images/ipod.jpg) no-repeat top left;
width:178px;
height:220px;
float:left;
margin-left:10px;
margin-top:20px;
}

#home-mp3 ul{
list-style-type:none;
padding-left:10px;
padding-top:110px;
}

/*#home-strapline2{
width:500px;
float:right;
text-align:right;
padding-top:192px;
}*/

#logos{
width:50%;
height:202px;
float:left;
background: url(../images/red-bg.gif) repeat-x;
}

#logos img{
margin-top:15px;
}

#home-features{
width:50%;
height:202px;
float:right;
background: url(../images/red-bg.gif) top repeat-x;
}

#home-features h4{
padding-bottom:20px;
}

#home-features h4 a{
color:white;
}

#home-features a{
color:black;
}

#home-feature1{
height:210px;
width:230px;
float:left;
margin-top:2px;
border-left:1px solid #EE1B2E;
padding-left:4px;
}

#home-feature2{
height:210px;
width:210px;
float:right;
margin-top:2px;
border-left:1px solid #EE1B2E;
padding-left:4px;
}

#home-bottom{
width:900px;
height:26px;
background-color:#EE1B2E;
clear:both;
font-weight:bold;
font-size:0.8em;
color:white;
border-top:1px solid #EE1B2E;
}





#content-area{
width:710px;
float:right;
background: url(../images/border.jpg) right repeat-y;

}

/*content*/


#main-content{
width:498px;
min-height: 335px;


float:left;
}

*html #main-content{
height: 335px;
}

    div#main-content
         { 
            float:left;
			width:498px;
            min-height:350px; 
            *height: 350px;  /*IE only */
         } 
         div#main-content /* here's the hack child selector ignored by <= IE 6.0 */ 
         { 
            height:auto !important; /*override 100px height*/
         }

#main-content ul{
padding-left:16px;
padding-bottom:5px;
font-size:0.85em;
}

#main-content ul li{
list-style-image: url(../images/bullet-line.gif);
list-style-type: circle;
}

#main-content h3, #main-content h3 a {
font-size:1em;
color:#000000;
}

#features{
width:190px;
float:right;
font-size:0.9em;
color:#000000;
padding-top:10px;

margin-top:20px;


}

#features a{
color: #000000;
}

#features p{
padding:10px;
}

#features p.black{
color:#000000;
padding:0px 0px 10px 15px;
}

#features p.professional-services{
/*color:#978080!important;*/
color:#221449!important;
padding:0px 0px 0px 15px;
font-weight:bold;
}

#features p.professional-services a{
/*color:#978080!important;*/
color:#660066!important;
padding:0px 0px 0px 0px;
}

#features p.project-support{
color:#3366ff;
padding:0px 0px 0px 15px;
font-weight:bold;
}

#features p.project-support a{
color:#3366ff;
padding:0px 0px 0px 0px;
}
 
 
#features p.business-support{
/*color:#abd590;*/
color:#00B050;
padding:0px 0px 0px 15px;
font-weight:bold;
}

#features p.business-support a{
/*color:#abd590;*/
color:#00B050;
padding:0px 0px 0px 0px;
}
 
#features p.operational-support{
/*color:#ff0000;*/
color:#A47D00;
padding:0px 0px 0px 15px;
font-weight:bold;
}

#features p.operational-support a{
/*color:#ff0000;*/
color:#A47D00;
padding:0px 0px 0px 0px;
}

#bottom{
width:900px;
height:26px;
background-color:#EE1B2E;
clear:both;
border-top:solid white 4px;
font-weight:bold;
font-size:0.8em;
color:white;
}

#copyright{
padding-left:20px;
width:300px;
float:left;
margin-top:4px;

}

#bottom-nav{
width:500px;
float:right;
margin-top:4px;
}

ul.bottom-nav li {
list-style:none;
display:inline;
padding-right:16px;


}

ul.bottom-nav a {
color:white;
text-decoration:none;
}

p img, h2 img {

float:right;
margin:5px;
}

p .text-flow {

float:left!important;
margin:5px;

}

.clear{
clear:both;
}

.datasheettable td{border:1px solid #FFFFFF;}
.datasheettable a {color:#000000; text-decoration:none;}
.datasheettable a:hover {text-decoration:underline;}
.datasheettable-grey {background-color: #e6e6e6}
.datasheettable-blue {background-color: #bebed4}
.datasheettable-green {background-color: #ccffcc}
.datasheettable-pink {background-color: #ffd1d1}
.datasheettable-greyheading {color: #808080}
.datasheettable-blueheading {color: #836699}
.datasheettable-greenheading {color: #339966}
.datasheettable-pinkheading {color: #ff5050}


.link-grey:hover { color:#221449; text-decoration: underline}
.link-blue:hover {color: #3366ff; text-decoration: underline}
.link-green:hover {color: #abd590; text-decoration: underline}
.link-red:hover {color: #ff0000; text-decoration: underline}

td {font-family:verdana, arial, helvetica; font-size:76%;}

/*FLASH REPLACEMENT*/

/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
	font-size:5px;
	line-height:0.3em;
}

.sirf-hasFlash #features h3 {

visibility: hidden;
	font-size:1px;
	
	}


.black a, .black {

color:#000000;

}

table .toprow {

background-color:#EE1B2E;
color:#FFFFFF;
font-weight:bold;

}

table .toprow td {

border:0px!important;

}

.pagetable td{

border:1px solid #CCCCCC;
padding:3px;


}

/*Used by switch.html*/

.styledefault { display:none; }
.stylearial { display:none; }
.styledesign2 { display:block; }
.styledesign3 { display:none; }