@import "extras.css";

/* Font size ratios; Default font size is 16 = 100% ************
/* top right bottom left */
/* p  15px = 0.9375em
h1 24/16 px = 1.5em
h2 21px = 1.3125em
h3 18px = 1.125em
h4 15px = 0.9375em
   12px = 0.75em
*/
/***********************************************************************/

/********************************************/
/* GENERAL TAG STYLES*/
/********************************************/

body {
   margin:0px;
   padding:0px;
   width:100%;
   font-size:100%; /*Base font size to resolve IE font-size bug.*/
   font-family:Arial, Verdana, sans-serif;
   text-align:left;
   color:black; /*standard paragraph colour*/
   background-color:#003882; /*dark blue*/
}

p {
   /*original font-size:15px;*/
   font-size:1em;
   line-height:1.3em;
   color:black;
   background-color:white;
   padding:0px;
   padding-left:10px;
   padding-right:20px;
   text-align:left;
   margin-bottom:15px;
}

p.larger {
   font-size:1.0em;
}

p.error {
   color:red;
   background-color:#ecf0f8;
   width:auto;
   margin:0px;
   padding:5px;
}

a {
   color:#001e46; /*very dark blue*/
   font-weight:bold;
}

a:hover {
   color:#005588; /*midBlue*/
}

a.nodeco {
   text-decoration:none;
}

/*a.nodeco:hover {*/
/*   color:#003882;*/ /*dark blue*/
/*}*/

h1,h2,h3,h4 {
   color:#007DCC; /*lightBlue*/
   font-family:Arial, Verdana, sans-serif;
   font-weight:bold;
   text-align:left;
   margin:0px;
   padding:0px;
   padding-left:10px;
   padding-right:10px;
}

h1 a,h2 a,h3 a,h4 a {
   color:#007DCC; /*lightBlue*/
}

h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover {
   color:#005588; /*midBlue*/
}

h1{
   font-size:1.3em;
   text-align:left;
   margin-top:1.5em;
   margin-bottom:0.5em;
}

h2{
   font-size:1.2em;
   margin-top:1.25em;
}

h3{
   font-size:1.1em;
   margin-top:1em;
}

h4{
   font-size:1em;
   padding-bottom:0px;
   margin-bottom:0px;
   margin-top:1em;
   margin-bottom:-0.9em;
}

h1 + h2,h3 {
   padding-top:0px;
   margin-top:16px;
}

h2 + h3,h4 {
   padding-top:0px;
   margin-top:5px;
}

.heading{
   color:white;
   background-color:#007DBC; /*lightBluePanel*/
   padding:5px;
   padding-top:0px;
   padding-bottom:2px;
}

.heading a, a .heading, a.heading {
   background-color:#007DBC; /*lightBluePanel*/
   text-decoration:none;
   color:white;
}

.heading a:hover, a .heading:hover  {
   text-decoration:none;
   color:#d7ebf7; /*very light blue*/
}

span.headingDate {
   font-size:small;
   float:right;
   margin-top:3px;
   margin-right:5px;
}

.center {
   text-align:center;
}

.transparent {
   background:transparent;
}

.error {
   color:red;
   background-color:#ecf0f8;
}

.nodeco{
   list-style:none;
}

.underline {
   text-decoration:underline;
}

ul,ol,li{
   line-height:1.3em;
   color:black; /*standard paragraph colour*/
   padding-left:10px;
   padding-right:10px;
   margin-left:0px;
}

ol, ul{
   margin-top:0px;
   padding-top:0px;
   margin-bottom:10px;
   padding-bottom:5px;
}

ul {
   list-style-type:none;
}

ul > h1,
ul > h2,
ul > h3,
ul > h4 {
   padding:0px;
   margin:0px;
}

a > h1,
a > h2,
a > h3,
a > h4 {
   padding:0px;
   margin:0px;
}

ul ul {
   margin-bottom:0px;
   padding-bottom:0px;
   list-style-type:disc;
   background-image:none;
}

li{
   padding-top:0.5em;
}

ul li {
   list-style:none;
   background-image:url('../images/bullet.gif');
   background-repeat: no-repeat;
   background-position: left 12px;
   padding-left:20px;
   margin-left:3px;
   margin-top:-3px;
}

ul ul li {
   list-style:disc;
   background-image:none;
   margin-left:30px;
   padding-left:5px;
}

/*li > b:first-child {*/
   /*color:#0E7DC2;*/ /*blue*/
/*   font-weight:bold;
}*/

table
{
   empty-cells:show;
   padding:0px;
}

table.borderless,
table.borderless > tr,
table.borderless > td,
table.borderless tr,
table.borderless td {
   border:none;
   padding:3px;
   margin:0px;
}

th {
   padding:5px;
}

td {
   padding-left:0px;
   padding-right:0px;
   margin:0px;
}

td h1, td h2, td h3, td h4 {
   padding-left:0px;
   padding-right:0px;
   margin:0px;
}

hr {
   width:auto;
   color:#96D3E1;
   background-color:#96D3E1;
}

img {
   border:none;
   margin:0px;
   padding:0px;
}

.contactForm {
   background-color:#eeeeee; /*not so pale gray*/
   border:solid 1px #ccc; /*from jot.css, .jot-form*/
   padding:0px 0px 0px 8px;
   margin:0px;
   width:375px;
}

.contactForm fieldset {
   border: 0px;
}

.contactForm label {
   display:block;
   float:left;
   clear:left;
   margin:5px 0px 5px 0px;
   width:115px;
}

.contactForm input{
   float:right;
   margin:5px 20px 0px 0px;
}

.contactForm .capitchaRow {
   clear:left;
   width:330px;
   margin:10px 20px 10px 10px;
}

.contactForm .capitchaRow input{
   float:none;
   width:185px;
}

.contactForm input.submit{
   float:none;
}

.contactForm h1, .contactForm h2 {
   margin:10px 0px 10px -10px;
}

.contactForm p {
   background:transparent;
   font-size:0.9em;
   margin-bottom:0px;
}

.contactForm b, .contactForm strong,
.jot-form b, .jot-form strong{
   color:#007DCC; /*lightBlue*/
}

div.strip {
   position:relative;
   height:26px;
   padding:0px;
   margin:0px;
   margin-bottom:-1px;
   color:white;
   background-color:#007DbC; /*lightBluePanel*/
   padding-right:5px;
}

div.strip ul {
   float:right;
   display:inline;
   margin:4px;
   /*padding:0px;*/
   color:white !important;
}

div.strip ul li {
   display:inline;
   list-style:none;
   text-align:center;
   color:white;
   font-weight:bold;
   background-image:none;
   margin:0px 5px 0px 5px;
   padding:0px 0px 0px 10px;
   border:none;
}

div.strip ul li a {
   text-decoration:none;
   text-align:center;
   color:white;
   background:transparent;
   font-size:0.9em;
}

div.strip ul li a:hover {
      color:#001e46; /*very dark blue*/
}

div.strip.btm {
   margin-left:-20px;
   margin-right:-20px;
}

div.strip.btm ul li {
   border-left:solid;
   border-left-width:1px;
   border-left-color:white;
}

div.strip.btm ul li:last-child{
   color:white;
   border-right:solid;
   border-right-width:1px;
   border-right-color:white;
   margin-right:5px;
   padding-right:5px;
}


/********************************************/
/* Layout Management */
/********************************************/

#container {
   width:960px;
   height:auto;
   padding:0;
   margin:0px auto;
   border:none;
   text-align:left;
}

#content{
   /* IE div float bug fix -
      see pagesMenu above and GENERAL IE FIXES below*/
   clear:both;
   position:absolute;
   top:325px;
   width:920px;
   background-color:white;
   margin:0px;
   padding:0px;
   padding-top:1px;
   padding-left:20px;
   padding-right:20px;
   border:none;
}

#wrapper{
   padding:0px;
   margin:0px;
}

.clear {
   clear:both;
}

.clearLeft {
   clear:left;
}

.clearRight {
   clear:right;
}

.left {
   float:left;
}

.right {
   float:right;
}

.divider{
   width:960px;
   clear:both;
   margin-top:0px;
   margin-bottom:0px;
   margin-left:0px;
   margin-right:0px;
}

.divider.line{
   background-color:#003882; /*dark blue*/
   line-height:1px;
   margin-bottom:5px;
   width:100%;
}

.wide{
   width:573px;
   margin-top:30px;
   margin-bottom:10px;
   margin-right:20px;
}

.wide.left {
   border-right:solid;
   border-right-color:#0E7DC2; /*blue*/
   border-right-width:1px;
   padding-right:10px;
}

.wide > h1:first-child,
.wide > h2:first-child,
.wide > h3:first-child,
.wide > h4:first-child {
   margin-top:0px;
   padding-top:0px;
}

.wide .heading, .wide.heading{
   width:550px;
}

.narrow {
   width:287px; /*To improve proportion, 1/3 of 860 inner*/
   margin-top:30px;
   margin-bottom:10px;
}

.narrow .heading {
   width:260px; /*To improve proportion, reduced for 1/3 of 860 inner*/
}

.narrow h1,
.narrow h2,
.narrow h3,
.narrow h4,
.narrow p {
   margin-left:-10px;
   padding-right:10px;
   padding-left:0px;
}

.narrow > h1:first-child,
.narrow > h2:first-child,
.narrow > h3:first-child,
.narrow > h4:first-child {
   margin-top:0px;
   padding-top:0px;
   padding-left:8px;
}

.narrow ul,ol,li{
   padding-left:0px;
   padding-right:10px;
   margin-left:-10px;
}

.narrow .divider.line{
   width:270px;
   margin-left:-10px;
   padding-right:10px;
   padding-left:0px;
}

.half {
   margin:0px;
   margin-top:30px;
   padding:0px;
   width:450px;
}

.half .heading, .half {
   width:410px;
}

.half > h1:first-child,
.half > h2:first-child,
.half > h3:first-child,
.half > h4:first-child {
   margin-top:0px;
   padding-top:0px;
}

.newsLeft {
   float:left;
   margin:0px;
   margin-top:30px;
   padding:0px;
   width:525px;
}

.newsLeft .heading {
   /*width:460px;*/
   width:490px;
}

.newsLeft > h1:first-child,
.newsLeft > h2:first-child,
.newsLeft > h3:first-child,
.newsLeft > h4:first-child {
   margin-top:0px;
   padding-top:0px;
}

.newsRight {
   float:right;
   margin:0px;
   margin-top:30px;
   padding:0px;
   width:375px;
}

.newsRight .heading {
   width:360px;
   margin-top:0px;
}

.newsRight ul li {
   padding-left:20px;
   margin-left:10px;
   margin-top:0px;
}

.inner {
   margin:0px;
   padding:0px;
   width:280px;
}

.inner .heading {
   width:150px;
}

.inner li {
   list-style:disc;
   padding-left:4px;
}

.inline {
   display:inline;
}

.relative {
   position:relative;
}

.absolute {
   position:absolute;
}

/********************************************/
/* HEADER BLOCKS                            */
/********************************************/

div#header {
   height:324px;
   position:relative;
   margin:0px;
   padding:0px;
   border:none;
}

div#header img#headerimg{
   z-index:-2;
   position:absolute;
   top:0px;
   left:0px;
   display:block;
   width:960px;
   margin:0px;
   padding:0px;
   border:none;
}

div#header div#logo {
   z-index:-1;
   /*background-color:white;*/
   position:absolute;
   top:0px;
   left:0px;
   display:block;
   float:left;
   width:353px;
   height:192px;
}

div#logo object, div#logo embed{
   z-index:-1;
   width:100%;
   height:100%;
   position:relative;
   top:0px;
   left:100px;
   top:-25px;
   left:3px;
}

div#logo img {
   width:335px;
   position:relative;
   top:75px;
   left:8px;
}


/********************************************/
/* TOPMENU                                  */
/********************************************/

div#topMenu {
   position:relative;
   top:112px;
   background:transparent;
   border:none;
   margin:0px;
   padding:0px;
   clear:right;
   width:100%;
}

/* "we make IT make sense.." with digital end */
div#digital-end {
   z-index:0;
   display:block;
   float:left;
   margin:0px 0px 0px 10px;
   padding:0px;
   height:90px;
}

div#digital-end img{
   height:90px;
}

/********************************************/
/* SectionsMENU                                 */
/********************************************/

#sectionsBackground {
   z-index:0;
   width:760px;
   height:90px;
   float:left;
   border:none;
   margin:0px;
   padding:0px;
   background-color:#2887C3; /*lightBluePanel 30% darker, default color*/
}


div#sectionSpacer {
   float:left;
   display:block;
   background:transparent;
   height:90px;
   width:206px;
}

div#sectionsWrapper {
   float:left;
   z-index:1;
   position:absolute;
   top:0px;
}

div.sectionHeading.first {
   width:72px;
}

div.sectionHeading {
   float:left;
   display:block;
   padding:0px;
   margin:0px;
   border:none;
   width:135px;
}

div.sectionHeading a {
   display:block;
   position:relative;
   text-decoration:none;
   color:white;
   /*font-size:0.9em;*/
   font-size:0.8em;
   font-weight:bold;
   text-align:center;
   padding:5px 3px 5px 3px;
   margin:15px 3px 5px 3px;
   height:50px;
   background-color:#2887C3;
   border:solid 1px #003882; /*dark blue*/
}

div.sectionHeading a:hover {
   border-color:#797979; /*light grey*/
   background-color:#0045a4; /*mid blue*/
}

div.sectionHeading a.active,
div.sectionHeading a.selected {
   border-color:#c0c0c0; /*light grey*/
   background-color:#003882; /*dark blue*/
}

ul.pagesMenu {
   list-style-type:none;
   padding:0px;
   margin:13px 0px 0px 2px;
   color:white;
   font-weight:bold;
   text-align:center;
   border:none;
   width:135px;
   height:100px;
   background-color:#4da4d9; /*oak blue*/
   background:transparent;
}

/* Note: the ul width required for IE */
div.sectionHeading.first ul.pagesMenu,
div.sectionHeading.first ul.pagesMenu li a {
   width:62px;
}

ul.pagesMenu li {
   list-style:none;
   background-image:none;
   padding-top:1px;
   padding-left:9px;
   margin:0px 0px 0px 0px;
}

ul.pagesMenu li a {
   margin:2px 3px 0px -8px;
   padding:1px 1px 2px 1px;
   vertical-align:middle;
   text-align:center;
   width:126px;
   height:auto;
   text-decoration:none;
   /*font-size:0.9em;*/
   font-size:0.8em;
   font-weight:bold;
   color:white;
   border:1px solid;
   border-color:#001e46; /*very dark blue*/
   border-color:#003882; /*dark blue*/
   background-color:#2887C3; /*lightBluePanel 30% darker, default color*/
}

ul.pagesMenu li a:hover {
   border-color:#797979; /*light grey*/
   background-color:#0045a4; /*mid blue*/
}

ul.pagesMenu li a.selected,
ul.pagesMenu li a.active {
   border-color:#c0c0c0; /*light grey*/
   background-color:#003882; /*dark blue*/
}


/********************************************/
/* FOOTER                                   */
/********************************************/

div.firstFooter {
 height:140px;
 margin-top:5px;
 margin-bottom:15px;
}

div.genFooter {
 height:80px;
 margin-bottom:25px;
}

p.footerIcons {
   float:left;
   font-weight:normal;
   vertical-align:middle;
   margin-left:0px;
   /*margin-right:10px;*/
   padding:0px 20px 0px 0px;
   background:transparent;
}

p.footerIcons a {
   font-weight:normal;
}

p.footerIcons img {
   margin-right:0px;
   padding-right:0px;
}

p.tagline {
   vertical-align:middle;
   color:#007DCC; /*lightBlue*/
   font-size:1.7em;
   font-family:Arial, Verdana, sans-serif;
   /*font-weight:bold;*/
   text-align:left;
   padding:0px;
}

div.firstFooter p.tagline {
   float:right;
   padding-top:10px;
   margin-right:20px;
}

div.genFooter p.tagline {
   float:left;
   margin-left:20px;
}

p.footerContacts {
   float:right;
   text-align:right;
   vertical-align:middle;
}

div.firstFooter p.footerContacts {
   padding-top:30px;
   padding-right:20px;
}

div.genFooter p.footerContacts {
   padding-top:20px;
   padding-right:20px;
}

#tel {
   font-size:1.4em;
   line-height:1.6em;
   font-weight:bold;
   color:#007DCC; /*light blue*/
}

#num {
   font-weight:bold;
   color:#003882; /*dark blue*/
}

#email {
   font-size:1em;
   font-weight:bolder;
   color:#007DCC; /*light blue*/
}

p.copyright {
   float:left;
   text-align:left;
   font-size:0.8em;
   color:white;
   background:transparent;
   padding:0px;
   margin:5px 0px 0px 20px;
}

div.disclaimer {
   position:absolute;
   bottom:230px;
/*   position: relative;
   bottom:0px;*/
   margin-right:20px;
}

p.disclaimer {
   font-size:0.8em;
   text-align:left;
}

/* Site Map layout **************************/

#siteMap {
   font-size:1.2em;
   width:560px;
   background-color:#eeeeee; /*not so pale gray*/
   background-color:#d7ebf7; /*very light blue*/
   border:solid 1px #ccc; /*from jot.css, .jot-form*/

}

#siteMap ul {
   list-style-type:none;
}

#siteMap ul li{
   list-style:none;
   background-image:url('../images/bullet.gif');
   background-repeat: no-repeat;
   background-position: left 12px;
   padding-left:20px;
   margin-left:3px;
   margin-top:-3px;
}

#siteMap ul li a{

}

#siteMap ul li a:hover{

}

#siteMap ul ul {
   margin-bottom:0px;
   padding-bottom:0px;
   list-style:none;
   background-image:none;
}

#siteMap ul ul li {
   list-style:square;
   background-image:none;
   margin-left:30px;
   padding-left:5px;
}



/********************************************/
/* GENERAL IE FIXES */
/********************************************/


/*Use this to fix float bug in IE, use <div class="floatclear"></div>*/
.floatclear {
   display:inline-block;
   width:100%;
}

/* Hide from IE-mac \*/
* html .floatclear {
   height:1%;
   width:auto;
}

.floatclear {
   display:table;
}
/* End hide from IE-mac */


/********************************************/
/* TRANSPARENCY DEFINITIONS AND FIX */
/********************************************/

.trans50 {/* Use for single element */
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /*IE8*/
   filter:alpha(opacity=50);
   opacity:0.5;
}

.trans70 {/* Use for single element */
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; /*IE8*/
   filter:alpha(opacity=70);
   opacity:0.7;
}

.trans80 {/* Use for single element */
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /*IE8*/
   filter:alpha(opacity=80);
   opacity:0.8;
}


.fixed {
   /* Use with transNN for simulating transparent container */
   position:absolute;
   top:0;/*Fill the container*/
   left:0;
   right:0;
   bottom:0;
   z-index:-1;
}

.opaque {
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /*IE8*/
   filter:alpha(opacity=100);
   opacity:1;
   color:white;
}

/********************************************/


/********************************************/
/* COLOUR DEFINITIONS */
/********************************************/

/*CYBEROAK STANDARD BLUE*/
.blue {
   color:#0E7DC2; /*blue*/
}

.blueBack {
   background-color:#0E7DC2; /*blue*/
}

/*CYBEROAK STANDARD LIGHT BLUE*/
.lightBlue {
   color:#007DCC; /*lightBlue*/
}

/*CYBEROAK STANDARD LIGHT BLUE FOR LARGE AREAS, PANELS*/
.lightBluePanel {
   color:#007DBC; /*lightBluePanel*/
   background-color:#007DBC;
}

/*CYBEROAK STANDARD DARK BLUE*/
.darkBlue {
   color:#003882; /*dark blue*/
/*CYBEROAK STANDARD DARK BLUE*/
}

.darkBlueBack {
   background-color:#003882; /*dark blue*/
}

.red {
   color:red;
}


/*** Temp holding location for possibly redundant code *****************/



/*** END OF CSS *******************************************************/