@charset "UTF-8";

/*––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––

   Title:              screen.css

   Browser(s):         firefox 2 (pc/mac), firefox 3 (pc/mac), 
                       safari (pc/mac), opera 9.5 (pc/mac), Google Chrome, 
                       IE6, IE7

   Author:             Scott Chown
   Created:            16/02/10
   
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

/* IMPORTED STYLESHEETS
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

   @import url('reset.css');

/* LAYOUT
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/


   /* BASIC STRUCTURE */

   body                { margin:0; padding:0; text-align:center; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#58595b; background:#fff url(../images/gradientBg.jpg) top left repeat-x;}
   #intro              { background-color:#000; background-image:none;}
   
   #container          { position:relative; margin:0 auto; width:880px; background:#fff url(../images/sides.jpg) top left repeat-y; text-align:left;}
   #intro #container   { margin:0 auto; background-image:none; background-color:#000; height:100%; background:transparent url(../images/introBg.jpg) top left no-repeat;}
   #container-wrapper  { position:relative; /* relative positioning - a fix for IE7 menu layout bug */ margin:0; zoom:1;}      
   #header             { position:relative; margin:0; background:transparent url(../images/headerV3.jpg) top left no-repeat; z-index:100;}
   #header-wrapper     { margin:0; width:100%; min-height:111px; height:auto!important; height:111px;}   
   #content            { position:relative; background:transparent url(../images/contentTop.jpg) top left no-repeat; z-index:50;}
   #home #content      { background-image:none;}
   #content-wrapper    { width:100%; padding-bottom:20px; min-height:460px; height:auto!important; background:transparent url(../images/contentBottom.jpg) bottom left no-repeat; zoom:1;}
   #home #content-wrapper
                       { background-image:none; min-height:436px; height:auto!important; height:436px;}
   body#home #content-wrapper
                       { padding-bottom:0;}
   #footer             { position:relative; clear:both; margin:0; background:transparent url(../images/footer.jpg) top left no-repeat;}
   body#home #footer   { background-image:url(../images/footerHome.jpg);}
   #footer-wrapper     { width:100%; min-height:105px; height:auto!important; height:105px;}
   body#home #footer-wrapper
                       { height:129px;}
   
   #container-wrapper,
   #header-wrapper,
   #content-wrapper,
   #footer-wrapper     { overflow:auto; zoom:1;}
   
   #header-wrapper     { overflow:visible;}
   #container-wrapper  { overflow:hidden;}
   
   #col-01,
   #col-02,
   #col-03             { display:inline; /* declare element as inline for fix to IE6 'double float margin' bug */ position:relative; float:left; margin:50px 0 0 26px; min-height:200px; height:auto!important; height:200px;}
   #col-01             { margin-left:38px; width:150px;}
   #col-02             { margin-left:30px; width:350px;}
   #col-03             { margin-left:30px; width:240px;}

   #flash-content      { position:relative; height:436px;}   
   #flash-content-wrapper
                       { position:relative; margin:0; padding:0; width:880px; height:436px; background:transparent url(../images/flashIntro.jpg) top left no-repeat; z-index:15; zoom:1;}
   iframe              { margin:0 0 0 20px;}
   #intro-alt-wrapper  { position:relative; margin:100px auto; width:855px; height:663px; background:transparent url(../images/introBg02.jpg) center no-repeat;}
   
   .image-left         { float:left; margin:0 10px 10px 0;}

/* TYPOGRAPHY
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

   /* HEADINGS */

   h1,h2,h3,h4,h5       { font-weight: normal; text-transform:lowercase; }
   
   h1 span,
   h2 span,
   h3 span,
   h4 span,
   h5 span              { text-transform:uppercase; }   

   #header h1           { position:absolute; top:65px; right:75px; width:120px; height:54px; font-size:1em; font-weight:normal; color:#10803b; text-indent:-9999px;}   
   #col-01 h2           { margin-bottom:15px; padding:0 0 10px 15px; font-size:1.1em; font-weight:bold; color:#6f6f72; border-bottom:1px solid #b9b9ba;}
   #col-02 h2           { margin:0; padding:0; font-size:1.8em; line-height:1.2em; font-weight:normal; color:#6f6f72;}
   #flash-content h2    { position:absolute; top:165px; left:245px; text-align:center;}
   #col-02 h3           { margin:10px 0 25px 0; padding:0; font-size:1.5em; line-height:1.2em; color:#10803b;}
   #col-02 h4           { margin:15px 0 5px 0; font-size:1em; font-weight:bold; line-height:15px; color:#10803b;}
   .case-studies h3,
      .press-release h3 { clear:both;}
  
   /* TEXT ELEMENTS */
    
   p                    { margin: 0 0 18px; font-size:.9em;}
   .case-studies p,
   .press-release p     { clear:both; float:left; margin:0 0 5px 0; font-size:.8em;}
   #col-03 p            { margin:15px; text-align:center;}
   p.contact-title      { margin-bottom:9px;}
   
   blockquote           { margin: 1.5em; color: #999; font-style: italic;}
   strong               { font-weight: bold;}
   em,dfn               { font-style: italic;}
   dfn                  { font-weight: bold;}
   sup, sub             { line-height: 0;}

   abbr, 
   acronym              { border-bottom: 1px dotted #666;}
   address              { margin: 0 0 1.5em; font-style: italic;}
   del                  { color:#666;}

   pre,code             { margin: 1.5em 0; white-space: pre;}
   pre,code,tt          { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5;} 
   
   
   /* LINKS */

   a:focus, 
   a:hover              { text-decoration:none;}
   a                    { overflow:hidden; color: #10803b; text-decoration: none; outline:none;}
   
   body#intro a         { display:block; position:absolute; bottom:-25px; right:0px; font-weight:bold; font-size:.9em;}
   
   #header h1 a         { display:block; width:100%; height:100%;}
   
   #header ul li a,
   #col-01 ul li a,
   #footer ul li a      { display:block;}
      
   #col-01 ul li a:hover{ text-decoration:none; color:#10803b; background-color:#e9e9e9;}
   #col-01 ul li a      { margin:0; padding:5px 0 5px 15px; width:90%; height:100%; color:#6F6F72; font-size:.8em; font-weight:bold; text-align:left;}

   #col-01 ul li.selected a:hover
                        {  background-color:transparent; cursor:default;}
   #col-01 ul li.selected a
                        { color:#10803b;}
   #col-01 h2 a:hover   { color:#10803b;}												
   #col-01 h2 a         { color:#6f6f72;}						

   #col-02 a:hover      { text-decoration:underline;}						
   #col-02 a, #col-03 a { font-weight:bold;}
      
   #col-02 .case-studies a,
   #col-02 .press-release a
                        { display:block; float:right; margin-top:2px; font-size:.9em; font-weight:normal;}
   
         
   #footer li a:hover   { text-decoration:underline;}
   #footer li a         { color:#58595a; text-decoration:none;}

   /* LISTS */

   li ul, 
   li ol                { margin:0 1.5em;}
   ul, ol               { margin: 0 1.5em 1.5em 1.5em;}

   ul                   { list-style-type: none;}
   ol                   { list-style-type: decimal;}

   dl                   { margin: 0 0 1.5em 0;}
   dl dt                { font-weight: bold;}
   dd                   { margin-left: 1.5em;}
   
   #col-01 ul           { position:relative; margin:0; width:100%;}
   #col-01 li           {}
   #col-02 ol,
   #col-02 ul           { margin-top:20px; font-size:.9em;}   
   #col-02 ul           { list-style-image:url(../images/bulletGreenDot.jpg);}
   #col-02 ol li,
   #col-02 ul li        { margin-bottom:10px;}						   
   #footer ul           { margin:13px 0 0 200px; padding:0;}
   body#home #footer ul { margin-top:5px; margin-left:126px;}
   #footer li           { float:left; margin:0 20px 0 0; font-size:.65em;}
   
   ul.case-study-details{ margin:2em 0 3em 0; padding:.5em 0; list-style-type:none; border-width:1px 0; border-style:solid; border-color:#10803B; overflow:auto; zoom:1;}
   #col-02 ul.case-study-details li
                        { margin:2px 0; font-size:.8em; list-style-image:none;}
   ul.case-study-details li strong
                        { display:block; float:left; width:110px; color:#10803B;}

   #col-02 ul.case-studies,
   #col-02 ul.press-release
                        { margin:0 0 2em 0; list-style-image:none; list-style-type:none;}
   #col-02 .case-studies li,
   #col-02 .press-release li
                        { clear:both; text-align:left; margin:0 0 1.5em 0; font-size:.9em; padding-bottom:5px; border-bottom:1px dotted #ddd; zoom:1; overflow:auto;}
      
   /* MISC CLASSES */

   .small               { margin-bottom: 1.875em; font-size: .9em; line-height: 1.5em;}
   .smaller             { margin-bottom: 1.875em; font-size: .8em; line-height: 1.5em;}
   .tiny                { margin-bottom: 1.875em; font-size: .75em; line-height: 1.875em;}
   .large               { margin-bottom: 1.25em; font-size: 1.5em; line-height: 1.2em;}
   .hide                { display: none;}

   .quiet               { color: #666;}
   .loud                { color: #000; font-weight:bold;}
   .highlight           { background:#ff0; }
   .added               { color: #fff; background:#060;}
   .removed             { color: #fff; background:#900;}

   .first               { margin-left:0!important; padding-left:0!important;}
   .last                { margin-right:0!important; padding-right:0!important; border-right-width:0px!important;}
   .top                 { margin-top:0!important; padding-top:0!important;}
   .bottom              { margin-bottom:0!important; padding-bottom:0!important;}
      

/* FORM ELEMENTS
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

   .login-form          { width:83%; background:transparent url(../images/48x61-Padlock.png) top right no-repeat;}
   .form-row            { clear:both; margin-bottom:10px; overflow:hidden; line-height:1.5em; zoom:1;}
   
   .form-row label      { display:block; float:left; width:110px; font-weight:bold; font-size:1.2em;} 
   
   .form-row input.text,
   .form-row select     { margin:0; width:185px; height:1.5em; border:1px solid #717174; color:#717174; font-size:.9em; text-indent:5px; background-color:transparent;}
   
   .form-row input.submit
                        { margin:0 0 0 110px; width:48px; border:1px solid #717174; color:#717174; height:17px; font-weight:bold; font-size:.8em; background:#fff url(../images/MainMenuGrad.gif) top left repeat-x;}

/* TABLES
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

   .the-difference-table{ margin:1em 0; width:100%; border-bottom:1px solid #d0e099;}
   .the-difference-table caption
                        { margin:0 0 1px 0; font-weight:bold; padding:0.5em 0.6em; color:#fff; background:#fff url(../images/tableHeadingBg2.jpg) bottom left repeat-x;}
   .the-difference-table thead th
                        { margin:1px 0; font-weight:bold; padding:1em; line-height:1em; font-size:.8em; border-right:1px solid #fff; background:#fff url(../images/tableHeadingBg.jpg) bottom left repeat-x;}   
   .the-difference-table thead tr
                        { margin:0;}   						
   .the-difference-table td
                        { padding:1em; border-right:1px solid #fff;}
   .the-difference-table tbody tr
                        { line-height:1em; font-size:.8em; background-color:#f8f4f3;} 
   .the-difference-table thead th.last,
   .the-difference-table thead td.last
                        { border-right-width:0;}   						
						

/* IE6 PNG FIX
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
						
   img,
   ul.dropdown ul,
   ul.dropdown li span
                        { behavior: url(iepngfix/iepngfix.htc);}	
						
   .clear               { clear:both;}
