/* 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;
}

html, body {
height:100%;
}

/* 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:1em;
font-weight:bold;
padding-top:10px;
padding-bottom:10px;
font-weight:100;
color:#EE1B2E;
}


h3{
font-size:1em;
font-weight:bold;
padding-top:10px;
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.9em;
font-weight:100;
}

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

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.black-bold{
font-weight:bold;
color:black;
}

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;
clear:both;
text-align: left;
background-color:#EE1B2E;
}

#nav, #nav ul {
	width: 900px;
	list-style: none;
	line-height: 1;
	font-weight: bold;
	font-size:0.95em;
/*FIX DROP NAV OVERLAY ISSUE WITH REVISED HOMEPAGE*/
	z-index:1000;
}

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

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

#nav li.shop {
	float:right;
	padding-left: 6px;
	padding-right: 18px;
	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: -6px; /*lowered from -8 to line up (Adam @ GM) */
	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: -2.2em 0 0 200;
	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;
}

/*#nav li li:hover a:visited, #nav li li.sfhover a:visited {
color:#808080;
}*/

.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
}

/*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:#999999;
}

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;
}

#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;
}*/

#home-title {
width: 100%;
min-height: 28px;
background: #EE1B2E;
margin-top:10px; /*added by Adam @ GM */
}

#home-title h2 {padding: 7px 6px 6px 20px; color: #FFFFFF; font-size: 1em; font-weight: bold}

#logo-holder { padding: 10px 0 10px 0}

#logos{
float: left; width: 49%; height: 154px; border: 
}

#news {float: left; width: 50%; min-height: 154px; border-right: 1px solid red }
#news p {padding: 13px 6px 6px 20px;}
#news p span {font-weight: bold; color: red}

#news a {color: #000000}
#news a:hover {color: #999999}

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

#home-features h4{
padding-bottom:20px;
font-size:0.9em;
}

#logos h4{
font-size:0.9em;
padding-left:24px;
}

#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-area.fmc{
background: none
}

/*content*/

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

#main-content-fmc{
width:700px;
min-height: 335px;
float:left;
}

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

div#main-content { 
float:left;
width:498px;
min-height:350px; 
*height: 400px;  /*IE only */
} 

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

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

#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:#999999;
margin-top:18px;
}

#features a{
color: #999999;
}

#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;
}

#features p.ocs-r2 a{
color:#EE1B2E!important;
padding:0px 0px 0px 0px;
}

#features p.ocs-r2 a:hover{
text-decoration:none;
}

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

#copyright{
padding-left:20px;
width:300px;
min-height:26px;
float:left;
margin-top:5px;
}

.bottom-nav{
width:465px;
min-height:26px;
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;
}

span.new-font {color: red; font-weight: bold}

.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; padding-left:4px; padding-top:4px;}
.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}
.link-ocs-red:hover {color: #EE1B2E; 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:none; }
.styledesign3 { display:block;  }

blockquote {
font-style:italic;
margin-left:10px;
margin-right:10px;
font-size:0.95em;
margin-bottom:10px;
}

.quote1 {
	background-image:url(../images/training-quote1.gif);
	background-repeat: no-repeat;
	padding-left:50px;
	padding-right:50px;
}

.quote2 {
	background-image:url(../images/training-quote2.gif);
	background-repeat: no-repeat;
	padding-left:50px;
	padding-right:50px;
}


/*blockquote.trainingquote {
	font-style:italic;
	margin-left:20px;
	margin-right:20px;
	font-size:0.95em;
	margin-bottom:10px;
	width:498px;
	height:100px;
	padding-left:50px;
	padding-right:50px;
}


blockquote.trainingquote p {
	margin-left:0px;
	font-size:0.95em;
	margin-bottom:10px;
	width:498px;
	height:100px;
	padding-left:50px;
	padding-right:50px;
	padding-top:20px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	background-image:url(../images/training-quote1.gif);
	background-repeat: no-repeat;

}
*/

/* This is the property before the quote starts
blockquote.trainingquote {
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:22px}

blockquote.trainingquote:before {
content: open-quote;
height:0px;
margin-top:-10px;
margin-left:-5px}

This is the property for when the quote ends
blockquote.trainingquote:after {
content: close-quote;
height:50px;
margin:-60px 10px 0px 420px;}

blockquote.trainingquote:before, blockquote.trainingquote:after {
color: #ccc;
display: block;
font-size: 5em;
width: 50px;
}

blockquote.trainingquote p {
padding-left:50px;
padding-right:50px;
padding-top:20px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}
*/

.attribute { margin-left:50px; margin-top:10px;font-weight:bold; font-size:11px; }

.tdcentre {
text-align:center
}

.trainingtable {
border:1px solid #000000 !important;
}

.trainingtable td{
padding: 3px;	
border:1px solid #000000 !important;
}

.trainingtable th {
	color:#FFFFFF;
	font-size: 0.95em;
	text-align: left;
	background-color: #000000;
	padding: 3px;		

}

.trainingtable a {
	color:#333333; 
	text-decoration:none;
}
.trainingtable a:hover {text-decoration:underline; 	color:#333333; 
}

.trainingtable a:visited {
	color:#999999; 
}

.trainingsheettable td{
	padding: 8px;	
	border:3px solid #FFFFFF !important;
	background-color:#000000;
	color:#FFFFFF !important;
}

.trainingsheettable a{
	color:#FFFFFF !important;
	font-size:1em;
	font-weight:bold;
}

.trainingtable-grey {
	background-color: #999999;
}
.trainingtable-grey a {
	color:#FFFFFF!important;
}

/*.trainingsheettable-grey {
	background-color: #e6e6e6;
}
.trainingsheettable-grey a {
	color:#808080 !important;
}

.trainingsheettable-blue {
	background-color: #bebed4;
}
.trainingsheettable-blue a {
	color:#836699 !important;
}

.trainingsheettable-green {
	background-color: #ccffcc;
}
.trainingsheettable-green a {
	color:#339966 !important;
}

.trainingsheettable-pink {
	background-color: #ffd1d1;
}
.trainingsheettable-pink a {
	color:#ff5050 !important;
}
*/

#gallery {position:relative; width:450px; margin:40px auto; padding:10px; border:6px solid #fff; background:#AAA}
#images {border:2px solid #9ac1c9; height:225px; background:#eef5f6; margin-bottom:20px}
#image {position:relative; width:450px; height:225px; padding:5px; background:#FFF url(images/loading.gif) center center no-repeat}
#image img {position:absolute; top:5px; left:5px}
#thumbwrapper {margin-top:10px; padding:5px 0; width:450px; height:100px; border:2px solid #666; background:#FFF}
#thumbarea {position:relative; overflow:hidden; height:100px; width:450px; }
#thumbs {position:absolute; list-style:none; margin-left:5px; height:100px; width:10000px; border-right:5px solid #FFF}
#thumbs li {float:left; margin-right:5px; cursor:pointer}
.imgnav {position:absolute; height:375px; width:20%; z-index:100; height:375px; width:20%; z-index:100; outline:none; cursor:pointer}
#previmg {left:0; background:url(images/left.gif) left center no-repeat; border-left:5px solid #FFF}
#previmg:hover {opacity:1; filter:alpha(opacity=100)}
#nextimg {right:0; background:url(images/right.gif) right center no-repeat; border-right:5px solid #FFF}
#nextimg:hover {opacity:1; filter:alpha(opacity=100)}

.blacklink a {
	color:#000000; 
}

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

.blacklink a:visited {
	color:#999999; 
}

.blacklink li {
	padding-bottom: 5px;
}

.training li {
	padding-bottom: 10px;
}

#greybox {
	width:160px;
	float:right;
	font-size:0.9em;
	margin-right:20px;
	margin-top:10px;
	margin-bottom:10px;
	background-color: #999999;
}

.greyboximg {
	margin-left:15px;
	margin-top:5px;
	margin-bottom:10px
}

.greyboxlogo {
	margin-top: 10px;
	margin-bottom: 5px;
	margin-left: 30px;
}

#greybox p {
	color:#FFFFFF
}

#greybox a {
	color: #C10000;
	text-decoration:underline;
}

.internallink {
	color: #999999;
}

.redarrow ul{
padding:0px !important;
}	

.redarrow li{
list-style-image: url(../images/redarrow.gif) !important;
list-style-type: circle;
padding-left:0px;
}

/* New Homepage Nov 09 */

#shell {background:url(../images/bg.jpg) no-repeat; width: 950px; height: 163px; padding: 0px 0 0 15px; margin: 5px 0 5px 0}
#shell img {margin-top: 17px}

.clear {clear: both;}   

#menu-system, #menu-system ul, #menu-system2, #menu-system2 ul {
list-style:none;
font: 10px verdana, sans-serif;
text-align: center;
height:128px;
}

#menu-system li, #menu-system2 li {
float:left;
height:auto;
margin-left:8px;
width:170px;
}

#menu-system li, #menu-system2 li {
_margin-left:0.6em;
}

#menu-system li li, #menu-system2 li li {
background:#000000;
filter:alpha(opacity=80);
opacity: 0.8;
-moz-opacity:0.8;
}

/* a hack for IE5.x and IE6 */
* html #menu-system li li, * html #menu-system2 li li {
float:left;
}

#menu-system li a, #menu-system2 li a {
float:left;
color:#FFFFFF;
width: 170px;
line-height:18px;
text-decoration:none;
}

#menu-system li li a, #menu-system2 li li a {
min-height:21px;
line-height:15px;
padding: 3px 0 3px 0;
}

#menu-system li li a:hover, #menu-system2 li li a:hover {
color:#ee1b2e;
}

#menu-system li a:hover, #menu-system2 li a:hover {
color:#ee1b2e;
}

#menu-system li:hover, #menu-system2 li:hover {
position:relative;
color:#ee1b2e;
text-decoration: none;
}

#menu-system li:hover ul, #menu-system2 li:hover ul {
left:-8px;
bottom:auto;
top:0px;
height:5px;
}

* html #menu-system li:hover ul, * html #menu-system2 li:hover ul {
bottom:7px;
left:-12px;
color:#ee1b2e;
text-decoration: none;
padding-bottom:1px;
}

* html #menu-system li li, * html #menu-system2 li li {
height: 1px;
line-height: 21px;
}


* html li.bottom {
margin-bottom:-1px;
}

* html #menu-system li li a, * html #menu-system2 li li a {
height: 1px;
line-height: 21px;
}

/* positioning the menu */
#menu-system ul, #menu-system2 ul {
position:absolute;
left:-9999px;
top:-9999px;
}

/* yet another hack for IE5.x and IE6 */
* html #menu-system ul, * html #menu-system2 ul {
width:1px;
left:-8px;
}


#menu-system li:hover li:hover > ul, #menu-system2 li:hover li:hover > ul {
left:-8px;
margin-left:100%;
bottom:2px;
top:auto;
color:#ee1b2e;
text-decoration: none;
}

/* keep further levels hidden */
#menu-system li:hover > ul ul, #menu-system2 li:hover > ul ul {
display:none;
width:auto;
}

/* show path followed */
#menu-system li:hover > a, #menu-system2 li:hover > a {
text-decoration:underline;
color:#ee1b2e;
text-decoration: none;
}

/*New Styles (Adam @ GM) */

/* urgh! IE damn you and your annoying bugs! */
* html .section-mid {
margin-bottom: 0px;
}

.section-top {
height:15px;
background:url(../images/home-section/bg_01.gif);
margin-top:10px;
}

.section-mid {
padding-left:1px;
height:128px;
background:url(../images/home-section/bg_02.gif) top repeat;
}

.section-bottom {
height:14px;
background:url(../images/home-section/bg_03.jpg);
}

* html .box {
margin-left: 7px;
}

/* END */