body {margin:20px 0 0;padding:0;color:#333;font-family:Arial, Helvetica, sans-serif;}
h1 {color:#993300;padding:0;margin:0;font-size:20px;line-height:200%;}
h2 {color:#333;padding:0;margin:0;font-size:14px;line-height:150%;}
p {font-size: 11px; line-height:150%}
a:link { color: #903 }
a:visited { color: #777 }
a:hover { color: #c00 }

#wrapper {width:715px;margin:auto;padding:0;}

#header {width:715px;}
#header img {float:left;}






ul#nav{margin:0;padding:0;float:left;list-style:none;width:448px;}
ul#nav li {position:relative;float:left;margin:0;padding:0;}
#nav li.home {width:34px;/*size of image*/height:57px;/* size of image*/}
#nav li.about {width:131px;/*size of image*/height:57px;/* size of image*/}
#nav li.portfolio {width:51px;/*size of image*/height:57px;/* size of image*/}
#nav li.contact {width:46px;/*size of image*/height:57px;/* size of image*/}

#nav li.home a {width:34px;/*size of image*/height:57px;/* size of image*/}
#nav li.about a {width:131px;/*size of image*/height:57px;/* size of image*/}
#nav li.portfolio a {width:51px;/*size of image*/height:57px;/* size of image*/}
#nav li.contact a {width:46px;/*size of image*/height:57px;/* size of image*/}


#nav li.home { background:url(images_pages/pages_r2_c5_f2.gif) no-repeat left top;}/* this holds the rollover state of the image1*/
#nav li.about {background:url(images_pages/pages_r2_c8_f2.gif) no-repeat left top;}/* this holds the rollover state of the image2*/
#nav li.portfolio { background:url(images_pages/pages_r2_c11_f2.gif) no-repeat left top;}/* this holds the rollover state of the image3*/
#nav li.contact {background:url(images_pages/pages_r2_c13_f2.gif) no-repeat left top;}/* this holds the rollover state of the image4*/

#nav a {display:block;text-decoration:none;}

#nav li.home a {background:url(images_pages/pages_r2_c5.gif) no-repeat left top;}/* this holds the normal state of the image1*/
#nav li.about a {background:url(images_pages/pages_r2_c8.gif) no-repeat left top;}/* this holds the normal state of the image2*/
#nav li.portfolio a {background:url(images_pages/pages_r2_c11.gif) no-repeat left top;}/* this holds the normal state of the image3*/
#nav li.contact a {background:url(images_pages/pages_r2_c13.gif) no-repeat left top;}/* this holds the normal state of the image4*/

ul#nav a:hover{background:transparent}
/* on hover we just hide the anchor and let the image underneath show through.
This makes for pre-loaded rolovers unlike changing the image on hover which is slow.*/

/* the above code assumes a different image for each anchor but is much simpler if only one image is used as the individual classes are not necessary. */
ul#nav{text-indent:-999em}/* hide text*/

/* The code below is an ie5 bug with text indent - remove if you don't care about ie5 */
* html ul#nav{text-indent:0;te\xt-indent:-999em}
* html ul#nav span{text-indent:-999em;}





/*
ul#nav {margin:0;padding:0;float:left;list-style:none;width:448px;}
ul#nav li {position:relative;float:left;margin:0;padding:0;}
ul#nav li a {position:relative;}
ul#nav li a span {visibility:hidden;position:absolute;z-index:999;top:0px;}
* html ul#nav li a span {display:none}
ul#nav li a:hover {visibility:visible;}
ul#nav li a:hover span {visibility:visible;}

ul#nav li a span.home {left:-34px;width:34px;}
ul#nav li a span.about {left:-131px;width:131px;}
ul#nav li a span.portfolio {left:-51px;width:51px;}
ul#nav li a span.contact {left:-46px;width:46px;}
*/



#content {background:url(images_pages/pages_r3_c2.gif) top right no-repeat;}

#leftside {width:179px;float:left;font-size:11px;}
#leftside ul {margin:0 0 0 -30px;padding:0;}
#leftside ul li {display:block;line-height: 18px; list-style: none;
		padding-left: 30px;}
#leftside ul li.file {background:url(images_pages/file.gif) no-repeat left;}
#leftside ul li.link {background:url(images_pages/lm-li.gif) no-repeat left;}
#leftside ul li.text {background:url(images_pages/cat-li.gif) no-repeat left;}
#leftside p {padding:0;margin:0 0 10px;color:#666;border-bottom:1px solid #CCC;}

#rightside {margin-left:179px;}
#rightside ul {margin:0;padding:0;list-style:none;}
	
#footer {margin-top:50px;}

img {border:none;}
.clearall {clear:both;}
.column {float:left;width:250px;}
.column li {position:relative;float:left;}
.column li img {padding:5px;}