/*------------------------------------------------------------------------------------------------
 *
 * @project        : Ray Boyd - Personal Website Project
 * @url            : www.rayboyd.com
 * @author         : Ray Boyd
 * @author-info    : Contact me via the following email address: hi [at] rayboyd [dot] com
 * @version        : 2.0
 * @notes          : Multiples of 15px for Margins and Padding
 */

/* Eric Meyers Reset CSS rules */
  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, tt, var,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th {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;}
  body {line-height: 1;color: black;background: white;}
  ol, ul {list-style: none;}
/* tables still need 'cellspacing="0"' in the markup */
  table {border-collapse: separate;border-spacing: 0;}
  caption, th, td {text-align: left;font-weight: normal;}
  blockquote:before, blockquote:after,q:before, q:after {content: "";}
  blockquote, q {quotes: "" "";}
/* End of Eric Meyers rules */

/*------------------------------------------------------------------------------------------------
 *
 * LINE-HEIGHT
 * Default line-height based on font-size rather than "computed-value"
 * @see: http://www.w3.org/TR/CSS21/visudet.html#line-height
 */
body * {line-height:180%;}

/*------------------------------------------------------------------------------------------------
 *
 * BODY
 */
html, body{
font: 12px "Segoe UI", tahoma, verdana, serif, sans-serif;
color: #222;
}

/*---------------------------------------------------------------------------------------------------
 *
 * HIDE
 */
.hide{
position:absolute;
left:-9999px;
}

/*---------------------------------------------------------------------------------------------------
 *
 * CLEANER
 */
.cleaner{clear:both;}

/*---------------------------------------------------------------------------------------------------
 *
 * REDEFINE SOME COMMON ELEMENTS
 */
em, i{font-style:italic;}
strong, b{font-weight:bold;}
a{color:blue;}
a:active{color:red;}
a:visited{color:purple;}
a:hover{text-decoration:none;}

/** Main link style **/

#content a,
#content a:active,
#content a:visited{
  margin: 0 0 1px;
  padding: 0;
  color: #222;
  background: white;
  border: 1px solid white;
  border-top: 1px solid white;
  border-bottom: 2px solid white;
}

#content a:hover{
  background: yellow;
  border-color: yellow;
}

/*---------------------------------------------------------------------------------------------------
 *
 * MARGINS, PADDING
 */

body{
  margin: 60px 0 0 45px;
}

#header,
.left_column,
.right_column{
  margin: 0 0 60px;
}

h1{
  margin: 0 0 53px; /** -7px account for line-height **/
}

h1, h2{
  margin-left: 1px;
}

.left_pad_30{
  padding-left: 30px;
}

ul, ol{
  margin: 0 0 30px;
}

.project_navigation li{
  margin: 3px 0;
}

.end_of_year{
  padding: 0 2px 2px 1px;
}

.right_column p,
.right_column ul,
.right_column ol{
  margin: 15px 1px 25px;
}

.right_column ol{
  padding-left: 1px;
}

.right_column ol li ul{
  padding: 5px 10px;
}

.right_column ol li ul li{
  margin-bottom: 5px;
}

/*---------------------------------------------------------------------------------------------------
 *
 * LAYOUT GRID
 */

#header{
  width: 125px;
  height: 73px;
}

#content{
  width: 990px;
}

#content .left_column{
  width: 600px;
  float: left;
}

#content .right_column{
  width: 350px;
  float: right;
}

/** Page specific **/

#content .standard{
  width: 510px;
}

#content .text_block{
  width: 565px;
}

/*---------------------------------------------------------------------------------------------------
 *
 * WEBSITE HEADER
 */

#header a{
  background: transparent url(/logo.gif) no-repeat 0 0;
  width: 125px;
  height: 73px;
  display: block;
}

#header a:hover{
  border: 0;
}

/*---------------------------------------------------------------------------------------------------
 *
 * TYPOGRAPHY
 */

h1,
.right_column h4{
  font: bold 19px monospace;
  line-height: 160%;
}

h2{
  font: bold 17px monospace;
  line-height: 160%;
}

.left_column{
  font: 12px monospace;
}

.right_column{
  font: 12px "Segoe UI", tahoma, verdana, serif, sans-serif;
}

ol{
  list-style: none;
  font: 9px "Segoe UI", tahoma, verdana, serif, sans-serif;
}

ol span{
  font: 12px "Segoe UI", tahoma, verdana, serif, sans-serif;
  line-height: 140%;
}

ol li ul{
  list-style: disc;
  list-style-position: inside;
}

ol li ul span{
  line-height: 140%;
}

/*---------------------------------------------------------------------------------------------------
 *
 * COLOUR & STYLE
 */

#content .right_column{
  border-left: 2px solid #eee;
}

.end_of_year{
  background: #f6f6f6;
}

.new,
.update,
.source_files_link{
  padding: 2px 7px 2px 5px;
  background: red;
  color: white;
}

.new,
.update{
  padding: 1px 5px 2px;
}

.update{
  color: white;
  background: MediumBlue;
}

.source_files_link{
  color: #222;
  background: cyan;
}

.source_files_link a{
  color: #222;
}

.disclaimer{
  margin: 15px 0 0;
  padding: 1px 2px;
  background: lightgrey;
}

ol li ul{
  background: #f6f6f6;
}

/*     *
 * IE6 *
 *     */
ul, li, li a {vertical-align:bottom;}