@charset "UTF-8";

/*––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––

   Title:              screen.css

   Browser(s):         firefox 2 (pc/mac), firefox 3 (pc/mac), 
                       safari (pc/mac), opera 9.5 (pc/mac), 
                       IE6, IE7

   Author:             SCOTT CHOWN
   Created:            04/05/09
   Last Modified:      04/05/09

––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

/* COLOR GUIDE

   Body Background:    #0a2675
   Main Text:          #FFFFFF
   Links:              #54c3f7
   Borders:            #FFFFFF
   Headings:           #FFFFFF

   CSS DECLARATION STRUCTURE

   1. positioning (with coordinates) styles
   2. float/clear styles
   3. display/visibility styles
   4. spacing (margin, padding, border) styles
   5. dimensions (width, height) styles
   6. typography-related (line-height, color, etc.) styles
   7. miscellaneous (list-style, cursors, etc.) styles

   
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

/* IMPORTED STYLESHEETS
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

   @import url('reset.css');


/* LAYOUT
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

   /* BASIC STRUCTURE */

   body                { text-align:center;}

   html, body
                       { height:100%; margin:0; padding:0; background:#0a2675 url(../images/background.jpg) top center repeat;}

   #container-wrapper  { position:relative; height:100%; padding-bottom:5em;}

   html>body #container-wrapper
                       { min-height:100%; }

   #container          { height:auto;}

   #header,
   #menu,
   #primary,
   #footer             { position:relative; clear:both; min-width:950px; text-align:center;}

   #header             { padding-top:100px;}
   #menu               { height:75px; background:#666666 url(../images/menu_bg.jpg) top left repeat-x;}
   #footer             { background:#333333 url(../images/footer_bg.jpg) top left repeat-x;}

   #header,
   #menu               { margin-bottom:57px;}

   #header-wrapper,
   #menu-wrapper,
   #primary-wrapper,
   #footer-wrapper     { position:relative; margin:0 auto; width:950px; text-align:left;}

   /* MORE LAYOUT */

   .col-half           { position:relative; float:left; margin-right:90px; width:430px;}
   #primary .col-half  { padding-bottom:8em;}  

/* NAVIGATION
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
   
   /* Jump Menu */

   #jump-links ul       { margin: 0; padding: 0; list-style: none;}
   #jump-links li       { display:inline; margin:0; padding: 0; list-style: none;}

   #jump-links a        { position:absolute; overflow: hidden; z-index: 1000; width: 0; height: 0; font-weight: bold; font-size: 0.8em !important; color: #cc0000;}
   #jump-links a:active, 
   #jumpLinks a:focus   { overflow: visible; margin: 2em 0 0 1em; padding: 6px; border: 1px dashed #000; width: auto; height: auto; font-size: .6em; background: #fff;}

   /* Main Menu */

   #navigation          { position:relative; display:block; float:left; width:430px; margin:0; padding:0; list-style-type:none; list-style-position:outside;}
   #navigation li       { display:block; display:inline;}

   #navigation          { list-style:none;}
   #navigation a *      { display:none;}

   #navigation a,
   #navigation a .hover { position:relative; display:block; height:75px;}

   #navigation a.about,
   #navigation a.about .hover
                        { background: url(../images/menu_button_about.jpg) 0 0 no-repeat;}

   #navigation a.contact,
   #navigation a.contact .hover
                        { background: url(../images/menu_button_contact.jpg) 0 0 no-repeat;}

   /* individual navigation items */
   #navigation a.about,
   #navigation a.contact{ width:195px; background-position:0 0;}

   #navigation .highlight a.about:hover,
   #navigation a.about .hover,
   #navigation .highlight a.contact:hover,
   #navigation a.contact .hover  
                        { width:195px; background-position:0 -75px;}

/* TYPOGRAPHY
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
   body                { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF;}

   /* HEADINGS */

   h1,h2,h3,h4,h5,h6    { font-weight: normal; }

   h1                   { margin-bottom: 0.5em; font-size: 3em; line-height: 1;}
   h2                   { margin-bottom: 0.75em; font-size: 2em;}
   h3                   { margin-bottom: 1em; font-size: 1.5em; line-height: 1;}
   h4                   { margin-bottom: 1.25em; height: 1.25em; font-size: 1.2em; line-height: 1.25;}
   h5                   { margin-bottom: 1.5em; font-size: 1em; font-weight: bold;}
   h6                   { font-size: 1em; font-weight: bold;}

   h1 img, h2 img,
   h3 img, h4 img,
   h5 img, h6 img       { margin: 0;}

   #header h1           { position:relative; float:left; margin-right:90px; width:430px; height:249px; text-indent:-9999px; background:transparent url(../images/logo.png) top left no-repeat;}

   .directors-message h2{ position:relative; width:433px; height:55px; text-indent:-9999px; background:transparent url(../images/heading_message_text.png) top left no-repeat;}

   #menu-wrapper h2     { position:relative; float:left; margin:0 84px 0 0; width:436px; height:75px; text-indent:-9999px;}
   #menu-wrapper h2 span{ position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:#666666 url(../images/heading_main.jpg); text-indent:-9999px;}

   h3.heading-01        { position:relative; display:block; width:412px; height:24px; background:transparent url(../images/heading_content_01.png) top left no-repeat; text-indent:-9999px;}
   h3.heading-02        { position:relative; display:block; width:412px; height:24px; background:transparent url(../images/heading_content_02.png) top left no-repeat; text-indent:-9999px;}
   h3.heading-03        { position:relative; display:block; width:412px; height:24px; background:transparent url(../images/heading_content_03.png) top left no-repeat; text-indent:-9999px;}
   h3.heading-04        { position:relative; display:block; width:412px; height:24px; background:transparent url(../images/heading_content_04.png) top left no-repeat; text-indent:-9999px;}

   /* TEXT ELEMENTS */

   p                    { margin: 0 0 1.5em;}

   .directors-message p { text-align:right;}
   #company-logos p     { position:absolute; top:-73px; right:-13px; display:block; margin:0; padding:0; width:453px; height:111px; background:transparent url(../images/company_logos.png) top left no-repeat; text-indent:-9999px;} 
   .twitter p           { margin-right:200px;}
   blockquote           { margin: 1.5em; font-style: italic;}

   .directors-message blockquote
                        { position:relative; display:block; width:430px; height:68px; margin:0; background:transparent url(../images/message_text.png) top left no-repeat; text-indent:-9999px;}   

   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              { color: #FFFFFF;}
   a                    { overflow:hidden; color:#54c3f7; outline:none;}

   #footer a:focus, 
   #footer a:hover      { color: #54c3f7;}
   #footer a            { padding:1em 1em 1em 0; color:#EEEEEE; text-decoration:none;}

   a.twitter-icon       { position:absolute; top:0; right:120px; display:block; width:71px; height:136px; background:transparent url(../images/twitter.png) center; text-indent:-9999px;}

   /* LISTS */

   li ul, 
   li ol                { margin:0 1.5em;}
   ul, ol               { margin: 0 1.5em 1.5em 1.5em;}

   ul                   { list-style-type: disc;}
   ol                   { list-style-type: decimal;}

   dl                   { margin: 0 0 1.5em 0;}
   dl dt                { font-weight: bold;}
   dd                   { margin-left: 1.5em;}

   #footer ul           { position:relative; display:block; float:left; margin:12px 90px 12px 0; padding:0; width:430px; list-style-type:none; list-style-position:outside; color:#EEEEEE; font-size:.8em;}
   #footer li           { display:inline; margin-left:0; margin-right:1em;}

   /* MISC CLASSES */

   .small               { margin-bottom: 1.875em; font-size: .8em; line-height: 1.875em;}
   .large               { margin-bottom: 1.25em; font-size: 1.2em; line-height: 2.5em;}
   .hide                { display: none;}

   .quiet               { color: #666;}
   .loud                { color: #000;}
   /*.highlight           { background:#ff0; }*/
   .added               { color: #fff; background:#060;}
   .removed             { color: #fff; background:#900;}

   .first               { margin-left:0; padding-left:0;}
   .last                { margin-right:0; padding-right:0;}
   .top                 { margin-top:0; padding-top:0;}
   .bottom              { margin-bottom:0; padding-bottom:0;}

   .left                { float:left;}
   .right               { float:right;}


/* FORMS
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

   label                { font-weight: bold;}
   fieldset             { margin: 0 0 1.5em 0; padding:1.4em; border: 1px solid #ccc;}
   legend               { font-weight: bold; font-size:1.2em;}

   /* FORM FIELDS */

   input.text, 
   input.title,
   textarea, select     { margin:0.5em 0; border:1px solid #bbb;}

   input.text:focus, 
   input.title:focus,
   textarea:focus, 
   select:focus         { border:1px solid #666;}

   input.text, 
   input.title          { padding:5px; width: 300px;}
   input.title          { font-size:1.5em;}
   textarea             { padding:5px; width: 390px; height: 250px;}


   /* SUCCESS, NOTICE AND ERROR BOXES */

   .error,
   .notice, 
   .success             { margin-bottom: 1em; padding: .8em; border: 2px solid #ddd;}

   .error               { border-color: #FBC2C4; background: #FBE3E4; color: #8a1f11;}
   .notice              { border-color: #FFD324; background: #FFF6BF; color: #514721;}
   .success             { border-color: #C6D880; background: #E6EFC2; color: #264409;}
   .error a             { color: #8a1f11;}
   .notice a            { color: #514721;}
   .success a           { color: #264409;}


/* TABLES
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

   table                { margin-bottom: 1.4em; width:100%;}
   th                   { font-weight: bold; background: #C3D9FF;}
   th,td                { padding: 4px 10px 4px 5px;}
   tr.even td           { background: #E5ECF9;}
   tfoot                { font-style: italic;}
   caption              { background: #eee;}

/* CLEARING
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/

   .clear               { position:relative; clear:both; height:0px; font-size:0px; line-height:0px;} 
   .fix                 { clear: both; overflow: hidden; margin: 0 0 -1px; height: 1px;}
 
   .clearfix:after      { content: "."; clear: both; visibility: hidden; display: block; height: 0;}
   .clearfix            { display: inline-block;}




/* MAINTENANCE REFERRENCE - IE-SPECIFIC STYLES
   
   DUPLICATED IN: fix_ie6.css

   .classname
   .classname
   .classname
   .classname

   DUPLICATED IN: fix_ie7.css

   .classname
   .classname
   .classname
   .classname

––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
