/** ==================================== KZA style =========================================**/
/** NOTES:  Generally, 1em = 12pt = 16px = 100% **/
/** UPDATES:  
/** grey: #EBEAEA; blue-teal:  #33499A; light-blue:  #6699CE; navy: #0D437B; teal:  #0A3159;  ylw: #F6A019; **/
 /** ============================================================================================= **/ 

 html, body, div, span, object, h1, h2, h3, h4, h5, h6, blockquote, a, abbr,big, code,del, img, ins, kbd, q, s, small, strike, sub, sup, tt, var,b, u, i, center,ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, 
 article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video 
{ margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

body { background-image: url(kza-court-reporting-images/bkgrnd-stripe.gif);   /** pale horiz grey stripe **/ margin: 0; padding: 0; text-align: center; }   /** this is needed because IE can't figure out auto L/R margins in page ID **/

H1   {  color: #0A3159; font: 26px 'Impact', arial, sans-serif;  margin: 0; padding: 0; }   /** title **/
H2  {  color: #33499A; font:  25px  'Voltaire', arial, sans-serif; }      /** sub-title **/
/** H2  {  color: #33499A; font:  20px  'Impact', arial, sans-serif; } **/
H3  {  color: #0A3159; font:  bold 15px  Arial, Helvetica, sans-serif; padding:0; }

.caption                {font: 8px #33499A Arial, sans-serif; text-align: center;}
.body-small          {color: #33499A; font: 11px Arial, sans-serif; *font-size: 11px;} 
.body-text           {font:  11px/12px #0A3159 Arial, sans-serif; *font-size: 13px; *line-height: 17px;} 
.bigbody              {color: #0A3159; font:  13px Arial, Verdana, sans-serif;}
.content-big        {color: #33499A; font:  15px/24px Arial, Verdana, sans-serif;}
.content-text      {color: #33499A; font:  15px Arial, Verdana, sans-serif;	}

/** ============================================================ PAGE COMPOMENTS =============================================**/
#page         { background-image: url('kza-court-reporting-images/bg-content-900x10.gif'); background-repeat: repeat-y; height: auto; margin: 10px auto; padding: 0; position: relative; text-align: center; width: 900px; }
#header     { margin-bottom: 0; *margin-bottom: -5px; padding: 0px; } 
#side-nav  {  color:  #0D437B; float: left;  height: auto; margin: 0; padding: 0; position: relative; text-align: left; width: 165px; }
#content   { clear: none; *clear: both; color: #33499A; float: left; font: 13px/17px Arial, Verdana, sans-serif; *font-size: 12px; height: auto;  margin: 0; 
	               *margin: -475px 10px 0 165px; padding: 35px 5px 0 10px; *padding: 0 5px 0 10px; position: relative; text-align: left; width: 710px; *width: 720px; }
#footer     { margin-top: 0; padding: 0; }
#btm          { background-image: url('kza-court-reporting-images/bg-content-900x10.gif'); background-repeat: repeat-y; border-bottom:  1px solid #0A3159; color: #33499A; font:  11px Arial, Verdana, sans-serif;	 height: 75px; margin: 0; *margin-top: -5px; text-align: center;  width: 900px; }
			

/** ============================================================ VERTICAL SPACING =============================================**/
.just1                      {line-height:  1px;}
.just2                      {line-height:  2px;}
.just3                       {line-height: 3px;}
.mid                   {line-height: 5px;}
.graph                   {line-height: 7px;}
.line-space            {line-height: 10px; }
.subject-space     {line-height: 15px; }
.top-space            { line-height: 0; *line-height: 45px; }
.form-space      {line-height: 20px;}
/**.title-spacer         { line-height: 150px; } 
.side-nav-tall      { height: 100%; } **/

.hang-right                     { display: inline; float: right; padding: 0 0 10px 7px; *padding: 0 0 20px 7px;} 


/** ======================================= GRID FRAMEWORK =============================================**/
/** 8px gutter **/
.grid-0   {width: 0px; }              
.grid-1   { width:   65px; }
.grid-2   { width: 130px; }                                      /** used in home **/
.grid-3   { width: 220px; *width: 220px;}          
.grid-4   { width: 265px;  *width: 255px;}     /** used in services **/
.grid-5   { width: 340px; *width: 330px;}    
.grid-6   { width:  400px; *width: 390px}     /** used in services **/
.grid-7     {width: 390px; }
.grid-8   { width: 550px; *width: 540px;}      /** used in home **/
.grid-9   { width: 630px; }
.grid-10 { width: 700px; *width: 700px;}  

.col        { float: left;   margin: 0 8px;   overflow: hidden;   display: inline; }
.row      { margin: 0 auto;   overflow: hidden; 	text-align: left;    width: 715px; *width: 715px;}	 

/** ============================================================ FORMS =============================================**/
input { background-color: #FFF; color: #0D437B; font: 12px Arial, Verdana, sans-serif; *font-size: 11px; }
.form { line-height: 13.5px; *line-height: 9.5px;  }
.small-radio   {height: 5px; width: 5px; }

/** ============================================================ LINKS =============================================**/
a   {  color: #33499A;  font-weight: bold;  text-decoration: none;  }	 
a:hover    {color:#6699CE;}

a.underline  {  color: #33499A;  font-weight: normal;  text-decoration: underline;  }	
a.underline:hover   {color:#6699CE;}

/** ============================================================ LISTS =============================================**/
ul                        { margin: 0; *margin: 2px; padding: 0; }
ul li                     {list-style-type: square; margin-left: 2em;  }  


