@charset "utf-8";
/* CSS Document */

h1,h2,h3,h4,h6,p,blockquote,ol,ul,li,img {
	margin: 0px;
	padding: 0px;
} 

/* body ---------------------------------------------*/

body {
	margin: 0px;
	background-color: #E2E2E2;
	font-family: MyriadWebRegular;
	font-size: 13px;
	color: #333;
}

a:link {
	color: #333;
}
a:visited {
	color: #333;
}
a:hover {
	color: #e50d5c;
}
a:active {
	color: #333;
}

#navlist
{
	margin-left: 0;
	padding-left: 0;
	list-style: none;
}

#navlist li
{
	padding-left: 15px;
	background-image: url(backgrounds/nav-arrow.png);
	background-repeat: no-repeat;
	background-position: 0 0.2em;
}

/* text ---------------------------------------------*/

@font-face {
    font-family: 'MyriadWebRegular';
    src: url('fonts/myriad-webfont.eot');
    src: url('fonts/myriad-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/myriad-webfont.woff') format('woff'),
         url('fonts/myriad-webfont.ttf') format('truetype'),
         url('fonts/myriad-webfont.svg#MyriadWebRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

p {
	font-family: 'MyriadWebRegular';
	font-size: 13px;
	line-height: 1.5em;
	color: #333;
	margin-bottom: 10px;
}

.p {
	font-family: 'MyriadWebRegular';
	font-size: 11px;
	line-height: 1.5em;
	color: #333;
}

.bodytext {
	font-family: 'MyriadWebRegular';
	font-size: 13px;
	line-height: 1.5em;
	color: #333;
}

h1 {
	font-family: 'MyriadWebRegular';
	font-size: 18px;
	line-height: 1.5em;
	color: #e50d5c;
	margin-bottom: 10px;
	font-weight: normal;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
}

h2 {
	font-family: MyriadWebRegular;
	font-size: 16px;
	line-height: 1.5em;
	color: #003163;
	margin-bottom: 5px;
	font-weight: normal;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
}

/* wrapper ------------------------------------------*/

#wrapper {
	width: 880px;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 20px;
	margin-left: auto;
	padding: 0px 20px 10px 20px;
	background-color: #FFF;
}

/* header -------------------------------------------*/

#header {
	width: 880px;
	height: 100px;
	background-image: url(backgrounds/bg-header.gif);
}

#flagWrap {
	float: right;
	width: 110px;
	margin-top: 27px;
	margin-right: 20px;
}

.flagBox a {
	display: block;
	background-color: #003163;
	width: 47px;
	margin-left: 6px;
	float: right;
	text-align: center;
	color: #FFF;
	font-family: 'MyriadWebRegular';
	font-size: 10px;
	text-decoration: none;
	padding-top: 4px;
	padding-bottom: 2px;
	}
	
.flagBox a:hover {
	background-color: #e50d5c;
	}


/* nav -------------------------------------------*/

#nav { 
	width: 880px;
	height: 30px;
	background-color: #fff;
	/* full details at base */
}

/* banner -------------------------------------------*/

#banner {
	width: 880px;
}

#slideshow {
    position:relative;
    height:250px;
}

#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}

#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}

#slideshow IMG.last-active {
    z-index:9;
}

/* colWrap ------------------------------------------*/
/* colWrap ------------------------------------------*/
/* colWrap ------------------------------------------*/
/* colWrap ------------------------------------------*/


#colWrap {
	width: 880px;
	height: 310px;
}


/* leftCol ------------------------------------------*/
/* leftCol ------------------------------------------*/
/* leftCol ------------------------------------------*/
/* leftCol ------------------------------------------*/

#leftCol {
	width: 600px;
	height: 290px;
	float: left;
	padding: 20px 20px 0px 0px;
}

/* board styles ------------------------------------------*/

.boardWrap {
	width: 600px;
	height: 70px;
	margin-bottom: 10px;
}

.boardWrap h1 {
	font-family: 'MyriadWebRegular';
	font-size: 14px;
	color: #003163;
	margin: 0px;
	font-weight: normal;
}

.boardWrap h2 {
	font-family: MyriadWebRegular;
	font-size: 10px;
	color: #003163;
	margin: 0px 0px 5px 0px;
	font-weight: normal;
}

.boardWrap h3 {
	font-family: MyriadWebRegular;
	font-size: 12px;
	color: #E50D5C;
	margin: 0px;
	font-weight: normal;
	font-style: italic;
}

.boardBox {
	width: 275px;
	height: 60px;
	padding: 5px;
	background-color:#eee;
	margin-right: 30px;
	float: left;
}

.boardBox .pic {
	width: 60px;
	height: 60px;
	margin-right: 10px;
	float: left;
}

.boardBox .text {
	width: 205px;
	min-height: 20px;
	float: left;
}

/* contact styles ------------------------------------------*/

.contactMap {
	width: 295px;
	height: 240px;
	margin-right: 20px;
	float: left;
}

.contactFrame {
	width: 285px;
	height: 240px;
	float: left;
}








/* rightCol -----------------------------------------*/
/* rightCol -----------------------------------------*/
/* rightCol -----------------------------------------*/
/* rightCol -----------------------------------------*/

#rightCol {
	width: 220px;
	height: 290px;
	padding: 20px 20px 0px 20px;
	float: left;
	background-color: #d5dce9;
}

#rightCol h1 {
	font-family: 'MyriadWebRegular';
	font-size: 16px;
	line-height: 1.5em;
	color: #E50D5C;
	margin-bottom: 8px;
	font-weight: normal;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
}

#rightCol h2 {
	font-family: 'MyriadWebRegular';
	font-size: 14px;
	line-height: 1.5em;
	color: #003163;
	margin-bottom: 8px;
	font-weight: normal;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
}

#rightCol p {
	font-family: 'MyriadWebRegular';
	font-size: 14px;
	line-height: 1.5em;
	color: #003163;
	margin: 0px;
	font-weight: normal;
}

/* recruitment styles -----------------------------------*/

.vacancyWrap {
	width: 220px;
	height: 22px;
}

.vacancyWrap .job {
	width: 150px;
	margin-right: 20px;
	float: left;
}

.vacancyWrap .apply {
	width: 50px;
	float: left;
}





#serviceWrap {
	width: 220px;
	height: 20px;
}

#serviceWrap .left {
	margin-right: 5px;
	float: left;
}

#serviceWrap .right {
	float: left;
}

/* Menu 1 starts here */

#menu1 {
	width: 220px;
	float:left;
}

#menu1 ul
{
	font-family: 'MyriadWebRegular';
	list-style-type:none;
	margin:0;
	padding:0;
}

#menu1 li
{
display: inline;
/* for IE5 and IE6 */
}

#menu1 a
{
	color: #003163;
	text-decoration: none;
	font-size: 13px;
	display: block;
	padding: 7px 0px 7px 15px;
	background-image: url(backgrounds/nav-arrow.png);
	background-repeat: no-repeat;
	background-position: 0px 9px;
	width: 205px;
	border-bottom: 1px solid #fff;
}

#menu1 a:link, #menu a:visited
{
	color: #003163;
	text-decoration: none;
}

#menu1 a:hover
{
	color: #e50d5c;
}

#menu1 li a#current
{
	border-bottom: 1px solid #fff;
	color: #003163;
	background-image: url(backgrounds/nav-arrow.png);
	background-repeat: no-repeat;
	background-position: 0px 11px;
}

/* Menu 1 ends here */

/* Menu 2 starts here */

#menu2 {
	width: 220px;
	float:left;
}

#menu2 ul
{
	font-family: 'MyriadWebRegular';
	list-style-type:none;
	margin:0;
	padding:0;
}

#menu2 li
{
display: inline;
/* for IE5 and IE6 */
}

#menu2 a
{
	color: #003163;
	text-decoration: none;
	font-size: 11px;
	display: block;
	padding: 5px 0px 5px 15px;
	background-image: url(backgrounds/nav-arrow.png);
	background-repeat: no-repeat;
	background-position: 0px 5px;
	width: 205px;
	border-bottom: 1px solid #fff;
}

#menu2 a:link, #menu a:visited
{
	color: #003163;
	text-decoration: none;
}

#menu2 a:hover
{
	color: #e50d5c;
}

#menu2 li a#current
{
	border-bottom: 1px solid #fff;
	color: #003163;
	background-image: url(backgrounds/nav-arrow.png);
	background-repeat: no-repeat;
	background-position: 0px 11px;
}

/* Menu 2 ends here */


#scrollingNews {
	width: 220px;
	height: 120px;
	margin-bottom: 15px;
}

a.vacanciesBtn {
	display: block;
	width: 220px;
	height: 50px;
	background-image:url(buttons/vacancies-btn-up.png);
	margin-bottom: 10px;
}

a.vacanciesBtn:hover {
	background-image:url(buttons/vacancies-btn-over.png);
}

a.servicesBtn {
	display: block;
	width: 220px;
	height: 50px;
	background-image:url(buttons/services-btn-up.png);
	margin-bottom: 10px;
}

a.servicesBtn:hover {
	background-image:url(buttons/services-btn-over.png);
}

a.newsBtn {
	display: block;
	width: 220px;
	height: 50px;
	background-image:url(buttons/news-btn-up.png);
	margin-bottom: 10px;
}

a.newsBtn:hover {
	background-image:url(buttons/news-btn-over.png);
}

a.newsletterBtn {
	display: block;
	width: 220px;
	height: 50px;
	background-image:url(buttons/newsletter-btn-up.png);
	margin-bottom: 10px;
}

a.newsletterBtn:hover {
	background-image:url(buttons/newsletter-btn-over.png);
}



/* pageBase -------------------------------------------*/

#pageBase {
	width: 880px;
	margin-bottom: 10px;
}

/* footer -------------------------------------------*/
/* footer -------------------------------------------*/
/* footer -------------------------------------------*/
/* footer -------------------------------------------*/

#footer {
	width: 880px;
}

#footer p {
	font-family: 'MyriadWebRegular';
	font-size: 10px;
	color: #999;
	margin: 0px;
}

#footer #top {
	width: 880px;
	margin-bottom: 5px;
}

#footer #top #left {
	width: 350px;
	float: left;
}

#footer #top #right {
	width: 530px;
	float: left;
	text-align: right;
}

#footer #bottom {
	width: 880px;
}

#footer #bottom #left {
	width: 350px;
	float: left;
}

#footer #bottom #right {
	width: 530px;
	float: left;
	text-align: right;
}

#footer a:link {
	color: #999;
	text-decoration: none;
}
#footer a:visited {
	color: #999;
	text-decoration: none;
}
#footer a:hover {
	color: #e50d5c;
	text-decoration: none;
}
#footer a:active {
	color: #999;
	text-decoration: none;
}


/* scroll-pane ---------------------------- */

.divider {
	background-image: url(backgrounds/divider-horizontal.gif);
	height: 30px;	
}







/* scroll-pane */


.scroll-pane
{
	width: 600px;
	height: 340px;
	overflow: auto;
}



/* topnav detailed */


div#css-menu-container {
	width: 880px; 
	padding: 0; 
	margin: 0;
}
ul.css-menu li, ul.css-menu a {
	font-family: 'MyriadWebRegular';
	font-size: 14px;
}
ul.css-menu {
	margin: 0px;
	height: 30px;					/* sets the height of the menu block */
	width: 880px;                 /* sets the width of the menu block */
	border: none;
	background-image: none;
	padding-left: 0px;           /* stops the usual indent from ul */
	cursor: default;             /* gives an arrow cursor */
	margin-left: 0px;            /* Opera 7 final's margin and margin-box model cause problems */
}
ul.css-menu ul {
  width: 80px;                 /* sets the default size of the drop-downs */
  background-image: url(menu_bg.png);
  border-radius: 0px;
  padding-left: 0px;           /* stops the usual indent from ul */
  cursor: default;             /* gives an arrow cursor */
  margin-left: 0px;            /* Opera 7 final's margin and margin-box model cause problems */
  z-index: 9999999;				/* put this above productImages (arbitrarily high) */
}
ul.css-menu li {
	list-style-type: none;       /* removes the bullet points */
	margin: 0px;                 /* Opera 7 puts large spacings between li elements */
	position: relative;
	color: #fff;				   /* ? */
	text-align: left;
	padding-left: 6px;
	text-transform: none;
	height: 30px;				/* was 35px */
	line-height: 30px;		   /* was 35px - height of drop down cell */
}
ul.css-menu > li {
  float: left;
  line-height: 31px;		   /* main nav */
  height: 30px;				   /* main nav */
  width: 100px;
  font-size: 11px;
  text-align: center;
  padding-left: 0px;
}
ul.css-menu li > ul {          /* using the > selector prevents many lesser browsers (and IE - see below) hiding child ULs */
  width: 97px;
  display: none;               /* hides child menu blocks - one of the most important declarations */
  position: absolute;          /* make child blocks hover without leaving space for them */
  top: 0px;                    /* position slightly lower than the parent menu item */
  left: 97px;                 /* this must not be more than the width of the parent block, or the mouse will
                                  have to move off the element to move between blocks, and the menu will close */
}
ul.css-menu > li > ul {
  display: none;
  position: absolute;
  top: 30px;				   /* drop box position */
  left: 0px;
}
ul.css-menu ul li:hover {
  background-color: #e50d5c;  /* gives the active MAIN drop down menu a brown background */
  color: red;                 /* ? - makes the active menu item text black */ 
  border-radius: 0px;
}
ul.css-menu > li:hover {
	color: red;				  /* ? */ 
}
/* Make the child block visible on hover */
ul.css-menu li:hover > ul {    
  display: block;
}
.clearFloat {
  font-size: 1px;
  line-height: 0px;
  height: 1px;     				 /* ? */
  clear: both;
}
/* and some link styles */
ul.css-menu li a { color: #003163; display: block; width: 100%; text-decoration: none; }   /* link colour */ 
ul.css-menu li a:hover { color: red; }													/* link colour */ 
ul.css-menu li:hover > a { color: #fff; } 												/* supports links in branch headings - should not be display: block; */
/* Top level link hover style */
ul.css-menu > li:hover > a:hover, ul.css-menu > li:hover > a {
	color: #e50d5c;
}

