/* ##################################### */
/*  Browser Reset
/* ##################################### */

  html, body, div, span, applet, object, iframe,
  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  a, abbr, acronym, address, big, cite, code,
  del, dfn, em, font, img, ins, kbd, q, s, samp,
  small, strike, strong, sub, sup, tt, var,
  dl, dt, dd, ol, ul, li,
  fieldset, form, label, legend,
  table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
  }
  /* remember to define focus styles! */
  :focus {
    outline: 0;
  }
  ol, ul {
    list-style: none;
  }
  body {
    line-height:1;
  }
  /* tables still need 'cellspacing="0"' in the markup */
  table {
    border-collapse: collapse;
    border-spacing: 0;
  }
  caption, th, td {
    text-align: left;
    font-weight: normal;
  }
  blockquote:before, blockquote:after,
  q:before, q:after {
    content: "";
  }
  blockquote, q {
    quotes: "" "";
  }


/* ##################################### */
/*  Typography and General Styles
/* ##################################### */

  body {
    font-family:"Trebuchet MS", helvetica, arial, verdana, sans-serif;
    font-size:87.5%;
    color:#2f2f5a;
  }
  p,h1,h2,h3,h4,h5,h6,ul,li,a { font-family:"Trebuchet MS", helvetica, arial, verdana, sans-serif; }
  h1,h2,h3,h4,h5  { font-weight:bold; line-height:1.35em; }
  
  h1              { font-size:200%; margin:0.3em 0; }
  h2              { font-size:150%; margin:0.5em 0; }
  h3              { font-size:150%; margin:0.6em 0; }
  h4              { font-size:125%; margin:0.4em 0; }
  h5              { font-size:110%; margin:0.2em 0; }
  
  p               { margin:0.9em 0; line-height:1.4em; }
  address         { line-height:1.2em; }
  
  em              { font-style:italic; }
  em.hl           { font-style:normal; font-weight:bold; color:#3d3da2; }
  
  a, a:link       { color:#3d3da2; text-decoration:underline; }
  a:hover         { color:#a7a7d1; text-decoration:none; }
  
  strong, b       { font-weight:bold; }
  
  .synopsis       { font-size:120%; }
  .footnote       { font-size:85%; }
  
  .center         { text-align:center; }
  .tright         { text-align:right; }
  .tleft          { text-align:left; }
  .middle         { vertical-align:middle; }
  .right          { float:right !important; }
  .left           { float:left !important; }
  .inline         { display:inline !important; float:none; width:auto; }
  .auto           { width:auto !important; }
  .font_s         { font-size:90%; }
  
  .clear          { clear:both; }
  .clear-both     { clear:both; height:0px; line-height:0px; overflow:hidden; font-size:0px; }
  
  .nudge_down     { padding-top:1em; }
  
  .hidden         { position:absolute; left:-9999px; top:-9999px; }
  
  .png            {  }
  
  blockquote {
    quotes:"\201C  " "  \201D";
    padding:0.75em 0.85em;
    overflow:hidden;
    font-style:italic;
  }
  blockquote:before { content: open-quote;  font-size:1.5em; font-weight: bold; }
  blockquote:after  { content: close-quote; font-size:1.5em; font-weight: bold; }
  cite              { float:right; font-weight:bold; }
  
  ul.bullet         { list-style:disc outside; margin-left:2em; }
  ul.bullet li      { margin:0.5em 0; line-height:1.3em; }
  
  #sfWebDebugBar  { right:auto !important; left:0 !important; }
  

/* ##################################### */
/*  Forms
/* ##################################### */

  label           { float:left; width:170px; padding:3px 10px 0 0; font-size:110%; font-weight:bold; }
  label span      { color:red; }
  
  input.field,
  select.field    { border:none; background-image: url(/images/forms/input_bg.gif); background-repeat: no-repeat; background-position: 0px 0px;  }
  
  input.field,
  select.field,
  textarea.field  {
    width:226px;
    height:16px;
    padding:3px 4px;
    margin:0;
    font-size:13px;
    line-height:16px;
  }
  #EmailForm input.field, #EmailForm textarea.field { font-family:"Trebuchet MS", helvetica, arial, verdana, sans-serif; width:206px; margin:0 0 5px 0;
  }
  input.s50, select.s50   { background-image:url(/images/forms/input_bg_50.gif); width:50px; }
  input.s50               { width:42px; }
  input.s80, select.s80   { background-image:url(/images/forms/input_bg_80.gif); width:80px; }
  input.s80               { width:72px; }
  input.s120, select.s120 { background-image:url(/images/forms/input_bg_120.gif); width:120px; }
  input.s120              { width:112px; }
  input.s216, select.s216 { background-image:url(/images/forms/input_bg_216.gif); width:216px; }
  input.s216              { width:208px; }
  input.s216.name		  {background-image:url(/images/forms/input_bg_216_name.gif); }
  input.s216.contactnumber		  {background-image:url(/images/forms/input_bg_216_contactnumber.gif); }
  input.s216.email		  {background-image:url(/images/forms/input_bg_216_email.gif); }

.req input.field,
  .req select.field,
  .req textarea.field  {
    width:235px;
    border-right:0.5em solid #3c3;
  }
  
  select {
  }
  select.field        { height:22px; }
  .req select.field   {  }
  
  textarea.field {
    height:104px;
    background:url(/images/forms/input_bg_textarea.gif) 0px 0px no-repeat;
    border:none;
    font-family:"Trebuchet MS", helvetica, arial, verdana, sans-serif;
  }
  #EmailForm textarea.field { width:206px; height:104px; border:none; font-family:"Trebuchet MS", helvetica, arial, verdana, sans-serif; background-image: url(/images/forms/input_bg_textarea_216.gif); background-repeat: no-repeat; background-position: 0px 0px;  }
  #EmailForm textarea.field.enquiry {background-image: url(/images/forms/input_bg_textarea_216_enquiry.gif);    
  }
  textarea.autoExpander { overflow:hidden; }
  
  input.checkbox  { margin:0.4em 0.25em; }
  
  .no_label  { margin-left:180px; }
  
  .but {
    display:block;
    height:12px; line-height:12px;
    padding:8px 5px;
    border:none;
    color:#fff !important;
    font-size:12px;
    font-weight:bold;
    text-align:center;
    vertical-align:middle;
    text-decoration:none !important;
  }
  .but:hover { color:#97b1f0 !important; }
  
  input.but { height:28px; padding:5px; }
  .b_s {
    width:83px;
    background:url(/images/forms/button_bg_s.gif) 0px 2px no-repeat;
  }
  input.b_s { width:93px; }
  .b_m {
    width:125px;
    background:url(/images/forms/button_bg_m.gif) 0px 2px no-repeat;
  }
  input.b_m { width:145px; }
  .b_l {
    width:170px;
    background:url(/images/forms/button_bg_l.gif) 0px 2px no-repeat;
  }
  input.b_l { width:180px; }
  .b_xl { width:200px; background:url(/images/forms/button_bg_xl.gif) 0px 2px no-repeat;
 }
  input.b_xl { width:190px; }
  
  fieldset {
    margin:1em 0;
  }
  form.register fieldset { 
  }
    fieldset legend {
      margin:0.3em 0;
      font-size:160%;
      font-weight:bold;
    }
    form.register fieldset legend { margin:0.4em 0 0 0; padding:14px 10px 0 0;
    }
    fieldset li {
      clear:left;
      padding:0 0 8px;
      overflow:hidden;
    }
  
  ul.message {
    padding:1em;
  }
  
  .success {
    background-image:url(/images/tick.png);
    background-color:#73B65A;
  }
  .error {
    background-image:url(/images/exclamation.png);
    background-color:#f33;
  }
  .warning, .failure {
    background-image:url(/images/warning.png);
    background-color:#ECC895;
  }
  .info {
    background-image:url(/images/information.png);
    background-color:#A5C2E0;
  }
  
  .error_list {
    color:#f00;
  }
    .error_list li {
      padding:4px 0 2px 180px;
    }


/* ##################################### */
/*  Containers
/* ##################################### */

  #container {
    overflow:hidden;
  }
  
  .wrap {
    width:960px;
    margin:0 auto;
  }


/* ##################################### */
/*  Nav
/* ##################################### */

  .options_bar {
    width:100%;
    background:#2a2a52 url(/images/template/bg_options_bar.gif) left bottom repeat-x;
  }
  #company_bar.options_bar { width:100%; background-color: #F9F9F9; background-image: url(/images/template/bg_options_bar2.gif); background-repeat: repeat-x; background-position: left bottom; margin: 30px 0 0 0;
  }
    .options_bar .wrap {
      padding:0.6em 0;
    }
  
  .options_bar ul {
    width:100%;
    text-align:right;
  }
  #company_bar ul { text-align:left; }
    
    .options_bar ul li { display:inline; margin:0 0 0 20px; color:#666;
    }
    #company_bar ul li { margin:0 20px 0 0; }
      
      .options_bar ul li a {
        color:#fff;
        text-decoration:none;
      }
      .options_bar ul li a:hover { color:#b3b3f1; }
  #company_bar a { color:#666; }
  #nav { width:100%; padding-top: 10px; background-color: #6D7CE5; background-image: url(/images/template/bg_nav.gif); background-repeat: repeat-x; background-position: left bottom;
  }
    #nav .wrap {
      padding:0px 0 0;
    }
  
  #nav h1 {
    padding:16px 0px 14px;
    margin:0;
    color:#fff;
    font-size:260%;
  }
    #nav h1 img {
      margin:-6px 5px 0 0;
      vertical-align:middle;
    }
  
  #nav ul {
    width:100%;
  }
    
    #nav ul li {
      float:left;
      position:relative;
      list-style:none inside;
      z-index:1;
      color:#b3b3f1;
    }
      
      #nav ul li a {
        float:left;
        height:31px;
        padding:0 0 0 8px;
        margin:0 6px 0 0;
        color:#b3b3f1;
        font-size:120%;
        text-decoration:none;
      }
      #nav ul li a span {
        float:left;
        padding:6px 8px 0 0;
        height:25px;
      }
        #nav ul li.open a, #nav ul li.current a, #nav ul li.active a {
          background:url(/images/template/bg_navitem_left.gif) left top no-repeat;
          color:#444484;
        }
        #nav ul li.open a span, #nav ul li.current a span, #nav ul li.active a span {
          background:url(/images/template/bg_navitem_right.gif) right top no-repeat;
        }
          
          #nav ul li ul {
            position:absolute;
            display:none;
            width:427px;
            top:31px;
            left:0px;
            z-index:100;
          }
          #nav ul li.open ul {
            display:block;
            padding:0 7px 24px 3px;
            background:url(/images/template/bg_dropdown_bottom.gif) -1px bottom no-repeat;
            height:200px;
          }
          #nav ul li.open ul ul {
            display:block;
            padding:20px 7px 24px 3px;
            background:none;
            float:left;
         }
           #nav ul li.open ul ul.col2 {
           float:left;
           border:none;
           margin-left:215px;
           width:200px;
           }
            #nav ul li.open ul li {
               border-right:1px solid #a8a7d1;
              width:173px;
              padding:6px 20px;
            }
            #nav ul li.open ul li.col2 {
              padding:6px 20px;
              border:none;
            }
            
              #nav ul li.open ul li a {
                height:auto;
                padding:0;
                background:none;
                color:#9c9bbb;
              }
              #nav ul li.open ul li a:hover {
                color:#444484;
                text-decoration:underline;
              }
              #nav ul li.open ul li.title {
                padding:4px 20px 14px 20px;
                margin:20px 0 0 0;
                color:#31305c;
                font-size:140%;
              }


/* ##################################### */
/*  Header
/* ##################################### */

  #header { position:relative; width:100%; background:#fff url(/images/template/bg_header.gif) left bottom repeat-x; border-top:1px solid #b3b3f1; border-bottom:1px solid #e1e1e1; color:#343466; height: 210px; overflow: hidden;
  }
    #header .wrap {
      padding:0;
      overflow:hidden;
    }
    
    #header #logo {
      float:right;
      margin:0px 10px;
    }
    
    #header h1 { padding-top:48px; margin:0; font-size:250%; font-weight:normal;
    }
    #header h2 {
      padding-top:48px;
      margin:0 0 -8px;
      font-size:270%;
      font-weight:normal;
    }
    #header h3 {
      margin:0;
      color:#a7a7d1;
      font-size:145%;
      font-weight:normal;
    }
    #header p { padding-top:1em;  }
    #header p img { margin-right:-3px; }


/* ##################################### */
/*  Footer
/* ##################################### */

  #footer { width:100%; clear:both; color:#666; background-color: #F3F3F3;
  }
    #footer .wrap { text-align:left; padding-top: 0.5em; padding-right: 0; padding-bottom: 0.5em; padding-left: 0;
    }


/* ##################################### */
/*  PAGE CONTENT
/* ##################################### */

  #page {
    overflow:hidden;
    width:100%;
    padding:1em 0;
    background:#fff url(/images/template/bg_content_shadow.gif) left top repeat-x;
  }
    #page .wrap {
      padding:20px 0 30px;
    }
    #page.rgbg { background-color: #fff; background-image: url(/images/rg-bg.jpg); background-repeat: repeat-x; background-position: left top;    }
  
  #content { float:left; width:695px; padding:0 15px 0 0;
  }
      #content.narrow { width:440px; margin: 0 10px; padding:0;
      }
    .fullwidth {
      width:100% !important;
    }
    
    #content .col1,
    #content .col2 {
      float:left;
      width:50%;
    }


/* ##################################### */
/*  SIDEBAR
/* ##################################### */

  .sidebar { float:left; width:250px; background:url(/images/template/bg_sidebar_top.gif) left top no-repeat;
  }
    .sidebar.narrow{ background-image:url(/images/template/bg_sidebar_top_narrow.gif); margin: 0 0 10px 0; }
    .sidebar.wide{ background-image:url(/images/template/bg_sidebar_top_wide.gif); margin: 0 0 10px 0; }
    .sidebar .content { padding:2px 20px 0;
    }
    .sidebar .bottom { width:100%; height:16px; margin-top:0px; background:url(/images/template/bg_sidebar_bottom.gif) left bottom no-repeat;
    }
    .sidebar.narrow .bottom { background-image:url(/images/template/bg_sidebar_bottom_narrow.gif); }
    .sidebar.wide .bottom { background-image:url(/images/template/bg_sidebar_bottom_wide.gif); margin: 0 0 0 -20px; width: 400px; }

table { border-collapse:collapse; width:100%; }

table td, table th { border:1px solid #c5c5c5; border-width:1px 0; }
table th { font-weight:bold; }

table thead th,
table tfoot th {
  background:#B3B3F1;
}

table th, table td { padding:5px 7px; }

table tr.total { font-size:110%; }
table tr.total td input { font-weight:bold; }


#calculation_table {
  width:100%;
  margin:10px 0;
}

  #calculation_table td,
  #calculation_table th {
    padding:5px;
  }
  
  #calculation_table th {
    font-weight:bold;
  }
  
  #calculation_table thead th {
    padding:6px 5px 8px;
    /*background:#2a2a52 url(/images/template/bg_options_bar.gif) left bottom repeat-x;*/
    color:#fff;
    font-size:125%;
  }
  
  #calculation_table tfoot td { padding:8px 5px; }


#content ul { list-style-type:disc; margin: 0 0 0 1em; padding: 0 0 0 1em; line-height:1.4em }
.accordion { list-style-type: none; padding: 10px 12px; margin: 0 0 30px; border-top: none; border-left: none; }
.accordion ul { padding: 0; margin: 0; display: block; }
.accordion li {list-style-type: none; padding: 6px 0px; margin: 0; display: block;  font-weight:bold;}
.accordion li li { cursor:auto; font-weight:normal; }
#content.wide { width: 100%; padding: 0; }
#register, #login { float: left; width: 360px; padding: 0 20px; margin: 0 30px 0 0; }
.errors { padding:10px; background-color:#ECC895; }