﻿body {
    border:0;
    margin: 30px 0 20px 0; 
    padding: 0; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:0.7em; 
    color:#FFFFFF; 
    background:#333333; 
}

/* ------------ Layout ------------- */

#content_home {width:550px; margin: 0 auto;  border:0; padding:0px 0px 0px 0px; background-color:#333333;}
#content_recentwork {width:420px; margin: 0 auto;  border:0; padding:0px 0px 0px 0px; background-color:#333333;}

#leftcolumn {width:249px; float:left; color:#FFF; padding:0 25px 0 0; margin:0; }
#leftcolumn {
    border-top-width:0px; 
    border-right-width:1px; 
    border-bottom-width:0px; 
    border-left-width:0px; 
    border-style:solid; 
    border-color:#808080;
}
#leftcolumn p {padding:0; margin:0; line-height:18px;}

#rightcolumn {width:249px; float:right; color:#FFF; padding:0; margin:0; border:0px solid #FFF;}
#rightcolumn p {padding:0; margin:0; line-height:18px;}
#rightcolumn a:link, a:visited, a:active {color:#FFFFFF; text-decoration:none;outline: 0;}
#rightcolumn a:hover { color:#FFFFFF; text-decoration:underline;}

.clear {margin:0; padding:0; clear:both;}
.spacer {height:10px;}


/* ------------ Navigation ------------- */ 

/* #recentwork {margin:0 0 5px 530px;} */
a.grey:link {color : #C0C0C0; text-decoration:none; }
a.grey:visited {color : #C0C0C0; outline: 0px red solid;}
a.grey:hover {color : #FF4040; }
a.grey:active {color : #FF4040; }
/* input:focus {color:green;} */

/* ------------ Titles ------------- */
#banner_home {width:600px; margin: 0 auto; border:0px solid red; padding:0}
#banner_recentwork {width:470px; margin: 0 auto; border:0px solid red; padding:0}

/* #withclarity {background:url(../images/withclarity_logo8.gif) 0 0 no-repeat; height:75px; width:150px;} */
.logoleft {
     float:left;
     padding:0;
     margin-bottom:-1px;
     border:0px solid blue;
     clear:left;
     }
.linkright {
     float:right;
     padding-top:14px;
     padding-right:15px;
     margin:0;
     border:0px solid blue;
     clear:right;
     }
/* #withclarity {background:url(../images/withclarity_logo11.gif) 0 0 no-repeat; height:30px; width:280px;} */
#aboutus,#profile,#contactdetails,#strengths,#skills,#portfolio {height:32px; width:249px; margin: 25px 0 0 0;}
#aboutus {background:url(../images/titles/aboutus.gif) no-repeat;}
#profile {background:url(../images/titles/profile.gif) no-repeat;}
#strengths {background:url(../images/titles/strengths.gif) no-repeat;}
#skills {background:url(../images/titles/skills.gif) no-repeat;}
#contactdetails {background:url(../images/titles/contact.gif) no-repeat;}
#rwork {height:32px; width:249px; margin: 10px 0 0 0;}
#rwork {background:url(../images/titles/recentwork3.gif) no-repeat;}

/* ------------ Skills ------------- */

ul.skillslist {margin:0 0 20px 0; padding:0; list-style:none;}
ul.skillslist li {margin:0; padding:0 0 0 12px; line-height:18px; background:url(../images/bullet_point4.gif) no-repeat top left;}

/* ------------ Portfolio ---------- */

.portfoliowrapper {margin:0 0 0 0; border:0px solid white; padding:0 0 10px 0; color:#FFFFFF;}
.labels {
    float:left;
    width:40%;
    margin-bottom:0px;
    padding:5px;
    border:0px solid white;
}

.labels a:link, a:visited, a:active {color:#FFF; text-decoration:none;}
.labels a:hover { color:#FFF; text-decoration:none;}

.thumbnails {
    float:right;
    margin:0px;
    border:0px solid red;
}


div.scils 
{
    width: 200px;
    height: 125px;
  background-image: url('../images/mysprite_thumbnails2.jpg');
  background-position: left -0px;
}

div.finetubes 
{
    width: 200px;
    height: 125px;
  background-image: url('../images/mysprite_thumbnails2.jpg');
  background-position: left -125px;
}

div.pyrenean 
{
    width: 200px;
    height: 125px;
  background-image: url('../images/mysprite_thumbnails2.jpg');
  background-position: left -250px;
}

.footer {
    clear:both;
    padding:15px 0px 0px 0px;
    border:0px solid #000;
}

.divider {border-width:0 0 1px 0;border-style:solid;border-color:#818181;margin:0px;}

.small_gap {height:5px;}
.large_gap {height:15px;}

div.border_home {
    margin:auto;
    width: 600px;
  background-image: url('../images/mysprite_border_home.png');
  background-position: -0px top;
    }

div.border_home div.border_top_home {
    height: 24px;
  background-image: url('../images/mysprite_border_home.png');
  background-position: -600px top;
    }

div.border_home div.border_bottom_home {
    height: 24px;
  background-image: url('../images/mysprite_border_home.png');
  background-position: -1200px top;
    }

div.border_recentwork {
    margin:auto;
    width: 470px;
  background-image: url('../images/mysprite_border_recentwork.png');
  background-position: -0px top;
    }

div.border_recentwork div.border_top_recentwork {
    height: 9px;
  background-image: url('../images/mysprite_border_recentwork.png');
  background-position: -470px top;
    }

div.border_recentwork div.border_bottom_recentwork {
    height: 15px;
  background-image: url('../images/mysprite_border_recentwork.png');
  background-position: -940px top;
    }

.section_heading {
    margin:0px;
    border:0px;
    padding:0px 0px 3px 0px;
    color:#BED515;
    font-size:15px;
    letter-spacing:1px
    }
    
.horizontal_rule {
    padding:0px 0px 12px 0px;
    border-top:#696361 1px solid;
    }
        
#logo_outer {font-size:20px;letter-spacing:4px;}
#logo_inner {color:#FF4040;}
#logo_small {padding:0px 0px 0px 9px;font-size:15px;letter-spacing:3px;}
#banner_link {float:right;padding:10px 15px 0px 0px;}
#banner_logo {float:left;padding:0px 0px 5px 15px;}

.red {color:Red;}
