/* OMNIFLEX WEB SITE MASTER CSS */
/*
created: 23/8/06
by: dhc

REVISIONS:

*/


/* GENERAL DEFAULT TAGS */

body {
  margin: 0;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  background-color: #eeeeee;
  }

img {border: 0;}

/* Default Fonts */
p, dd, dt, a, h3, h4   {font-family: Verdana, Arial, Helvetica, sans-serif}
h1, h2 {font-family: Arial, Helvetica, sans-serif}

/* Default Font-Sizes */
p, dd, dt, a 	{font-size: 8pt; margin-top: 0 }
h1.nav {font-size: 10pt; font-weight: bold }
input {font-size: 8pt}

/* Individual general tag styles */
h1  {font-size: 16pt; font-weight: bold; color: #00566F; margin: 0 0 10px; text-decoration: none }
h2  {font-size: 11pt; font-weight: bold; ; color: #333399;	margin: 10px 10px 10px 0px}
h3  {font-size: 10pt; font-weight: bold; ; color: #333399;	margin: 10px 10px 10px 0px}
h4  {font-size: 9pt; font-weight: bold; ; color: #333399;	margin: 8px 8px 8px 0px}
h5  {font-size: 8pt; font-weight: bold; ; color: #333399;	margin: 6px 6px 6px 0px}
h6  {font-size: 7pt; font-weight: bold; ; color: #333399;	margin: 6px 6px 6px 0px}

/* Active Links */
a.selected			{font-size: 8pt; font-weight:bold; color:#00566F; text-decoration:none}
a.selected:visited	{color:#00566F; text-decoration:none}
a.selected:hover	{color:#00566F; text-decoration:underline}

a.sublink {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11pt;
  font-weight: bold;
  color: #333399;
  margin: 10px 0 10px 0;
  text-decoration: none
}

a.sublink:hover {
  color: #CC0000;
  cursor: pointer;
}

/* CLASSES */
/* position related classes */
.hardleft {float: left; margin: 0;}
.hardright {float: right; margin: 0;}

/* Image Control Classes */
img.left 	{float:left; border:0px none; margin: 0px 10px 10px 0px }
img.right 	{float:right; border:0px none; margin: 0px 0px 10px 10px }

/* LAYOUT LOGIC FOR THE DEFAULT PAGE DESIGN */

/* body is fixed width 958px including shadow of 4px each side */
#bodyback {
  position: relative; /* required to position the menu within the header */
  background-image: url(../images/bodyback.gif);
  background-repeat: repeat-y;
  width: 950px;
  padding: 0 4px 0 4px;
  margin:0px auto;
}

/* bodybottom is the shadow along the bottom edge of the page */
#bodybottom {
  background-repeat: no-repeat;
  background-image: url(../images/bodybtm.gif);
  height: 6px;
  width: 958px;
  margin:0px auto;
}

/* The page id is a container for the entire page.
   Its purpose is to control the width at 100% or 740px minimum  */
#page {
  width:950px;
  margin: 0;
}

/* The Header is the top border of the page
   containing the banner logos etc. */
#header {
  width: 100%;
  height: 80px;
  clear: both;
  background-color: #003399;
  background-image: url(../images/stopwtch5.jpg);
  background-position: left;
  background-repeat: no-repeat;
}

#header .logoright {float: right; margin: 0px 0px 0px 15px;}
#header .headerad {padding: 15px; text-align: right; }
#header .banner { font-size: 20px; font-family: Arial; color: #FFFFFF; }

/* The Headerbar is the thinstrip under the header
   that holds the drop shadow and the bottom green stripe */
#headerbar {
  width: 100%;
  height: 7px;
  border-top: 7px solid #009999;
  background: #cccccc url(../images/sh_mid.gif) repeat-x;
  padding: 0;
  clear: both; /* no floating elements allowed on either side  */
}

/* The footer is the simple blue strip
   across the bottom of every page. */
#footer {
  padding: 2px 10px 2px 0px;
  clear: both;
  background-color: #003399;
  color: white;
  text-align: right;
  font-size: 8pt;
  font-weight: bold;
}

/* The footermap is the area at the bottom of the page
   containing a site map organised into five columns. */
#footermap {
  width: 100%;
  background-color: #cccccc;
  clear: both;
}

.footercol {
  width: 20%;
  float: left;
  color: #444444;
}
.footercol p {
  padding: 0;
  margin-bottom: 3px;
}

.footercolcontents {
  margin: 10px;
}

.footercolheader {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 5px;
}

a.footerlink {
  text-decoration: none;
  color: #444444;
}

a.footerlink:hover {
  color: #CC0000;
  font-weight: bold;
  cursor: pointer;
}

a.h2link {
  text-decoration: none;
}

a.h2link:hover {
  color: #CC0000;
  cursor: pointer;
}


/* The container holds the two columns between the header and footer:
   Navbar - the bar on the left containing common navigation and search tools
   Content - the middle section containing the meat of the web page */
#container {
  clear: both;
  width: 100%;
  height: 100%;
  background-image: url(../images/sh_hor_g135.gif);
  border-color: #66FF99;
  background-position: left;
  background-repeat: repeat-y;
}

/* The navbar floats on the left of the container
   and contains common tools on every page */
#navbar {
  float: left;
  height: auto;
  padding: 0px 5px 5px 5px;
  width: 125px;
  color: #FFFFFF;
  font-size: 18pt;
  margin: 5px 5px 5px 0px;
  background-image: url(../images/sh_hor_g135.gif);
  background-repeat: repeat-y
}

/* The scroller is contained in the navbar */
#scroller {
  width: 118px;
  height: 200px;
  border: solid 1px #008800;
  background: #FFFFFF;
  display: none;
}

#scroller ul li div
{
	border: 1px solid #aaaaaa;
	background: #ffffff;
}

#scroller ul {
  list-style: none;
  width:100%;
}

.scroller-item {
	height: 190px;
  width: 106px;
   font-size: 8pt;
   font-family: Verdana;
   color: #000000;
   padding: 5px;
}


/* The content class is the container for the all individual page contents.
   Up to this point, all markup has been contained in the page header,
   and is contained on every page on the site.
   This class holds the individual page contents. */
.content {
  margin-left: 135px;
  margin-right: 10px;
  padding: 0px 10px 10px 10px;
  display: block;
}
/* The next line is added as a fix for a 3 pixel offset error in IE6 */
/* courtesy of Stu Nicholls at cssplay.co.uk */
* html .content {display:inline-block; padding-left:7px;}

/* The Breadcrumb is the navigation path to this page from the menus */
.breadcrumb {
  font-weight: bold
}

/* This is a floating sidebar that can be inserted on the right of the contents
   When using rightbar choose colsrb as the container for the contents
   Without the rightbar use cols as the container for the contents */
.rightbar {
  float: right;
  width: 120px;
  height: auto;
  padding: 15px 5px 5px 5px;
  z-index: 20;
  background-color: #BBBBBB
}

/* This contains the body of the page out of the way of the rightbar */
.colsrb {
  margin-right: 140px;
  height: auto;
  display: block;
}

/* This contains the body of the page without a rightbar */
.cols {
  margin-right: 0px;
  height: auto;
  display: block;
}

.colboth {
  width: 100%;
  display: block;
  float: right
}

/* This is a container for a left column in the body */
.colleft {
  width: 50%;
  float: left;
}

/* This is a container for a right column in the body */
.colright {
  width: 50%;
  float: right;
}

/* This is a container for the column contents padded in the column */
.colbody {
  margin: 10px
}

.clear {clear: both} /* no floating elements allowed on either side  */


.heading {
  background-color: #FFCC00;
}


/* The left column of the main content */
.leftcol {
  width: 40%;
  border: #000000;
  float: left;
  border-width: medium;
  background: #FFFF66
}

/* The right column of the main content */
.rightcol {
  width: 40%;
  border: #0000ff;
  float: right;
  background-color: #66FF33
}


/* MINIBUTTONS */
/* http://davidwalsh.name/github-css */
  /* button basics */
  a.minibutton {
    display:inline-block;
    height:23px;
    padding:0 0 0 3px;
    font-size:11px;
    font-weight:bold;
    color:#333;
    text-shadow:1px 1px 0 #fff;
    background:url(../images/minibutton_matrix2.png) 0 0 no-repeat;
    white-space:nowrap;
    border:none;
    overflow:visible;
    cursor:pointer;
    text-decoration:none;
  }

  a.minibutton>span {
    display:block;
    height:23px;
    padding:0 10px 0 8px;
    line-height:23px;
    background:url(../images/minibutton_matrix2.png) 100% 0 no-repeat;
  }

  a.minibutton:hover, a.minibutton:focus {
    color:#fff;
    text-decoration:none;
    text-shadow:-1px -1px 0 rgba(0,0,0,0.3);
    background-position:0 -30px;
  }
  a.minibutton:hover>span, a.minibutton:focus>span {background-position:100% -30px;}

  a.minibutton.mousedown{background-position:0 -60px; }
  a.minibutton.mousedown>span{background-position:100% -60px; }

  /* with icon */
  a.btn-download .icon {
    float:left;
    margin-left:-4px;
    width:18px;
    height:22px;
    background:url(../images/minibutton_icons.png?v20100306) 0 0 no-repeat;
  }
  a.btn-download .icon {background-position:-40px 0;}
  a.btn-download:hover .icon, a.btn-download:focus .icon {background-position:-40px -25px;}




/* TABLES */
td {font-family: Verdana,Helvetica,Arial,sans-serif; font-size: 10pt}
td.hdg {
  background-color: #333399;
  font-family: "Arial";
  font-size: 12pt;
  font-weight: 700;
  color:#ffffff;
  border: 0;
  margin: 0;
  padding: 3px;
  white-space: nowrap;
  background-image: url(../images/TitleFade4.gif);
  background-position:  right;
  background-repeat: repeat-y
}

td.outline      {background-color:#00566F;}

/* Table for data */
table.data	{border-collapse: collapse; border: 2px solid #003399}
table.center {margin-left: auto;margin-right: auto}
th.data		{font-size: 8pt; color:#00566F; background-color:#A9C8D6; border: 1px solid #003399; padding: 1px 4px 1px 4px }
tr.odd		{background-color:#E4E4E4}
tr.even		{background-color:#F3F4F5}
td.data		{font-size: 8pt; color:#00566F; border-left: 1px solid #003399; padding: 1px 4px 1px 4px}
td.label	{font-size: 8pt; text-align:right; margin-right:5px; background-color:#FFF4B4; padding: 1px 4px 1px 4px}
td.contents	{font-size: 8pt; border: 1px solid #003399; padding: 1px 4px 1px 4px}
td.tight	{font-size: 8pt; border: 0px; padding: 0px 0px 0px 0px}
td.group	{font-size: 10pt; font-weight: bold; background-color:#FFF4B4; padding: 3px 4px 1px 8px}
a.data		{font-size: 8pt}

/* Tables with Green and Yellow backgrounds */
tr.gdark	{background-color:#679FAA; color:#FFFFFF;}
tr.gmedium	{background-color:#CEE7EF;}
tr.glight	{background-color:#E2ECF1;}

th.gdark	{background-color:#679FAA; color:#FFFFFF;}
th.gmedium	{background-color:#CEE7EF;}
th.glight	{background-color:#E2ECF1;}

td.gdark	{background-color:#679FAA; color:#FFFFFF;}
td.gmedium	{background-color:#CEE7EF;}
td.glight	{background-color:#E2ECF1;}

tr.ydark	{background-color:#679FAA;}
tr.ymedium	{background-color:#CEE7EF;}
tr.ylight	{background-color:#FFF9DA;}

th.ydark	{background-color:#679FAA; text-align:left;}
th.ymedium	{background-color:#CEE7EF;}
th.ylight	{background-color:#FFF9DA;}

td.ydark	{background-color:#679FAA;}
td.ymedium	{background-color:#CEE7EF;}
td.ylight	{background-color:#FFF9DA;}

/* Coloured Rows and Cells for tables*/
tr.light, th.light, td.light		{background-color:#FFFFFF;}
tr.medium, th.medium, td.medium	{background-color:#CEE7EF;}
tr.dark, td.dark					{background-color:#679FAA; color:#000000;}
th.dark							{background-color:#679FAA; color:#FFFFFF; text-align:left;}


/* CSS3 layout for tables */


/* BORDERED TABLE WITH ROUNDED CORNERS */
.bordered {
    *border-collapse: collapse; /* IE7 and lower */
    border-spacing: 0;
    width: 100%;
    border: solid #ccc 1px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 1px 1px #ccc;
    -moz-box-shadow: 0 1px 1px #ccc;
    box-shadow: 0 1px 1px #ccc;
}

.bordered tr:hover {
    background: #fbf8e9;
    -o-transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}

.bordered td, .bordered th {
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    padding: 5px;
    text-align: left;
}

.bordered tr.odd {
  background-color: #ffffff;
  color: #222222;
}

.bordered tr.even {
  background-color: #eeeeee;
  color: #222222;
}

.bordered td.labelodd {
  text-align: right;
  background-color: #E9FBFA;
}

.bordered td.labeleven {
  text-align: right;
  background-color: #BEEAE8;
}

.bordered th {
    background-color: #dce9f9;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ebf3fc), to(#dce9f9));
    background-image: -webkit-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:    -moz-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:     -ms-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:      -o-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:         linear-gradient(top, #ebf3fc, #dce9f9);
    -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    -moz-box-shadow:0 1px 0 rgba(255,255,255,.8) inset;
    box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
    border-top: none;
    font-family:'Trebuchet MS','Lucida Sans','Arial';
    color: #000066;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
}

.bordered td:first-child, .bordered th:first-child {
    border-left: none;
}

.bordered th:first-child {
    -moz-border-radius: 6px 0 0 0;
    -webkit-border-radius: 6px 0 0 0;
    border-radius: 6px 0 0 0;
}

.bordered th:last-child {
    -moz-border-radius: 0 6px 0 0;
    -webkit-border-radius: 0 6px 0 0;
    border-radius: 0 6px 0 0;
}

.bordered th:only-child{
    -moz-border-radius: 6px 6px 0 0;
    -webkit-border-radius: 6px 6px 0 0;
    border-radius: 6px 6px 0 0;
}

.bordered tr:last-child td:first-child {
    -moz-border-radius: 0 0 0 6px;
    -webkit-border-radius: 0 0 0 6px;
    border-radius: 0 0 0 6px;
}

.bordered tr:last-child td:last-child {
    -moz-border-radius: 0 0 6px 0;
    -webkit-border-radius: 0 0 6px 0;
    border-radius: 0 0 6px 0;
}


/* classes to format the news scroller in the navbar */
.newshdg {font-family: Arial,sans-serif; font-size: 9pt; font-weight: bold; color: #333399; text-align:center; margin: 0px 0px 8px 0px}
.newsbod {font-family: Verdana,Zurich,Helvetica,Arial,sans-serif; font-size: 8pt; color: #555555; text-align:left; margin: 0px 0px 8px 0px}

a.newsbod {
  text-decoration: none;
  color: #333399;
}

a.newsbod:hover {
  color: #CC0000;
  font-weight: bold;
  cursor: pointer;
}


/* Miscellaneous Classes */
.bod {font-family: Verdana,Zurich,Helvetica,Arial,sans-serif; font-size: 10pt; color: #555555; text-align:justify; margin: 10px 10px 10px 10px}

.gbutton {font-family:verdana, arial, helvetica, sans-serif; font-size:12px; font-weight:bold; color:#FFFFFF; background-color:#00566F;}

/* Aslett Clearing Method
   Named after its creator, Tony Aslett (www.csscreator.com),
   the Aslett Clearing Method forces a container such as a div to
   enclose floated content nested within it, which it would not normally do. */
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.clearfix {display: inline-table;}
  /* backslash hack hides from IE mac \*/
  * html .clearfix {height: 1%;}
  .clearfix {display: block;}
  /* end backslash hack */

.reglabel {
  font-family: Arial
}

.red {
  color: #FF0000;
}

.email {
  color: #0000FF;
  font-size: small;
  text-decoration: underline;
}