/* CSS Document */

/* TABS - TABLES - LISTS */

/* TABS */
/* tabs are positioned relative to the parent element 
    so you must give the parent the class: nav_tabs_parent */ 
/* requires basic unordered list markup
<div id="top_nav_tabs">
      <ul>
        <li><a href="#">Nav item 1</a></li>
        <li><a href="#">Nav item 2</a></li>
      </ul>
</div>
*/

/* horizontal bar of tabs */
.nav_bar {
	margin:0 auto;
	display:table;
	font-size:.8em;
	border:1px solid #AAA;
	border-radius:4px;
}
.nav_bar ul {
	 display:table-row:
	 }
.nav_bar  li {
	display:table-cell;
	padding:.3em .75em;
	border-right:1px solid #777;
}
.nav_bar li:last-child {
	border-right:none;
}
.nav_tabs_parent {
	position:relative;	
	min-height:1.2em;
	}
.nav_tabs {
	position:absolute;
	right:20px;
	top:0;
	}
.nav_tabs ul {
	margin:0;	
	}
.nav_tabs li {
	float:left;	
	padding:3px 10px;
	border:1px solid #444;
	list-style-type:none;
	margin:0 0 0 -1px;
	
	-webkit-border-bottom-right-radius: 5px;
	  -webkit-border-bottom-left-radius: 5px;
	     -moz-border-bottom-right-radius: 5px;
	      -moz-border-bottom-left-radius: 5px;
	              border-bottom-right-radius: 5px;
	                border-bottom-left-radius: 5px;
	                               border-top-width: 0px;
}
.nav_tabs a {
	font-size:.85em;
}
/* work in rogess to get tabs to sit above container */
/*
.nav_tabs.top_tabs {
	top:auto;
	bottom:0px;
}
.nav_tabs.top_tabs li {
	     -webkit-border-bottom-left-radius:0;
			-moz-border-bottom-left-radius:0;
					   border-bottom-left-radius:0;
-webkit-border-bottom-right-radius:0;
   -moz-border-bottom-right-radius:0;
	   	     border-bottom-right-radius:0;
	-webkit-border-top-right-radius: 5px;
	  -webkit-border-top-left-radius: 5px;
	     -moz-border-top-right-radius: 5px;
	      -moz-border-top-left-radius: 5px;
	              border-top-right-radius: 5px;
	                border-top-left-radius: 5px;
	                  border-bottom-width: 0;
					  border-top-width: 2px;
}
*/

/* links for the top right of your page * / 
/* horizontal row with vertical dividers */
.nav_links {
 	overflow:hidden; /* forces div to enclose of floated ul */
	float:right; /* can be removed if it's OK for this div to be full width of parent */
	}
.nav_links ul {
	float:right; /* moves link set to right of container */
	}
.nav_links li {
	float:left; /* makes links align horizontally */
	display:inline;  /* tightens li vertically around links */
	padding:0 .5em; /* spacing between links */
	list-style-type:none; /* removes default bullets off lists */
	/* border-right:1px solid #0C9;  vertical dividing lines between links */
	}
.nav_links li:last-child {
	border-right:none; /* removes vertical dividing line after last link */
	}
.nav_links a {
	font-size:1em;
	text-decoration:none; /* removes underlining on links */
	color:#069; 
	}
.nav_links a:hover {
	color:#036;
	}
/* end tabs */
	
/* LISTS */
/* simple bulleted list */
.stylin_list1 ul {
		margin:.3em 20px;
		font-size:12px;
}
.stylin_list1 li {
	list-style-type:disc;
	margin:0 0 8px 16px;
}

/* centered horizontal list divided by | - good for footer links */
.horiz_links {
	text-align:center;
	}
.horiz_links ul {
		display:inline-block;
} 
.horiz_links li {
	font-size: .85em;
	list-style-type:none;
	text-decoration:none;
	float:left;
}
.horiz_links li {
	/* border-right: 1px solid #AAA; */
	padding:0 3px; /* space between the links; */
}
.horiz_links li:last-child {
	border-right: none;
}
/* TABLES */
/* from Stylin' 2 */
/* various tables styles - see sample markup at end of table styles */
/* style 1 - basic_lines creates a layout with various weights of horizontal lines between the table rows */
/* style 2 bars_n_stripes is similar to style 1 but colors the table rows */
/* style 3 tic_tac_toe creates open table cells all around the layout - only fully supported in Firefox, but degrades nicely in others */  

/* table style 1 - Basic Lines - add basic_lines class to table tag */	
table.basic_lines {
 	/* border-collapse:collapse; */   /* <<<uncomment to close gaps in lines */
	margin:1em auto;
	border-top:3px solid #069;
	}
table.basic_lines caption {
	margin-bottom:4px;
	font-size:120%;
	}	
table.basic_lines th {
	border-bottom:2px solid #069;
	}	
table.basic_lines td {
	border-bottom:1px solid #069;
	}	
table.basic_lines td, table.basic_lines th {
	padding:5px 3px;
	}
/* table style 2 - Bars 'n' Stripes - add bars_n_stripes class to table tag */	
table.bars_n_stripes {
	border-collapse:collapse;
	margin:1em auto;
	}
table.bars_n_stripes td {
	background-color:#FFFFCC; /* table data area */
	}
table.bars_n_stripes th { /* labels column */
	background-color:#CCFFCC;
	}
table.bars_n_stripes th[scope="col"] { /* headings row */
	/* colors top row of cells - IDWIMIE 6 - previous rule applies to IE6 */
	background-color:#99CCCC;
	}
table.bars_n_stripes td, table.bars_n_stripes th  {
	padding:3px 3px; 
	border-bottom:1px solid #069; 
	}
/* table style 3 - 'Tic-Tac-Toe'- add tic_tac_toe class to table tag */		
table.tic_tac_toe {
	border-collapse:collapse;
	margin:1em auto;
	}
table.tic_tac_toe td {
/* create the grid of table cells */
	border-right: 1px solid #99CCCC; 
	border-bottom: 1px solid #99CCCC;
	}
table.tic_tac_toe tr:last-child td {
	border-bottom: 0; /* remove the bottom border off the bottom row of tds */
	}
table.tic_tac_toe td:last-child {
	border-right:0; /* remove the right border off the right row of tds */
	}
table.tic_tac_toe th { 
/* create the grid of table cells */
border-right:3px solid #99CCCC;
	border-bottom: 1px solid #99CCCC;
		padding-right:.3em;
	}
table.tic_tac_toe tr:last-child th { /* removes bottom border off last cell of the column */
		border-bottom:0;
	}
table.tic_tac_toe th[scope="col"] {
	/* colors top row of cells - IDWIMIE 6 - previous rule applies to IE6 */
	border-right: 1px solid #99CCCC;
	border-bottom :3px solid #99CCCC;
	}
table.tic_tac_toe th[scope="col"]:first-child { 
/* thick right border on first cell of headings row */
	border-right:3px solid #99CCCC;
	}
table.tic_tac_toe th[scope="col"]:last-child {
	border-right:0; /* remove the right border off the right row of ths */
}
table.tic_tac_toe th[scope="row"] {
	text-align:right; /* right aligns the text in the left column */
	}
table.tic_tac_toe td, table.bars_n_stripes th  {
	padding:3px 3px; /* space around the text in each cell */
	}
table.tic_tac_toe caption { /* styles for the caption */
	margin-bottom: .5em;
	font-size:1.2em;
	}

/* sample markup for table CSS above, this example uses basic_lines class */

/*
<table class="basic_lines" summary="Summary of my books">
  <caption>
    <strong>My Books</strong>
  </caption>
  <tr>
    <th scope="col">&nbsp;</th>
    <th scope="col">Stylin'</th>
    <th scope="col">Codin'</th>
	<th scope="col">Scriptin'</th>
  </tr>
  <tr>
    <th scope="row">Languages</th>
    <td>XHTML &amp; CSS</td>
    <td>PHP &amp; SQL</td>
	<td>JavaScript and Ajax</td>
  </tr>
  <tr>
    <th scope="row">Focus</th>
    <td>Interface design</td>
    <td>Back-end code</td>
	<td>Browser applications</td>
  </tr>
</table>
*/

/* end sample markup for table CSS above */