a:link { color: rgb(70, 70, 0); text-decoration: underline; } /* for unvisited links */
a:visited { color: rgb(30, 30, 30); text-decoration: underline; } /* for visited links */
a:hover { color: rgb(100, 100, 100); text-decoration: none; } /* when mouse is over link */
a:active { color: rgb(120, 120, 120); text-decoration: none; } /* when link is clicked */

p {
text-align: left;
margin: 5px;
}

h1 {
 font: 2em Times,serif;
 text-transform: uppercase;
 }
 
h1:first-letter {
 font: 1.5em Times, serif;
 }
 
h2 {
 font: 1.8em verdana, helvetica, sans-serif;
 }

h3 {
 text-align: left;
 margin: 10px 30px;
 font: 1.6em verdana, helvetica, sans-serif;
 }
 
h4 {
 text-align: left;
 margin: 10px 60px;
 font: 1.5em verdana, helvetica, sans-serif;
 }

body {
 background: rgb(246,246,246) url(images/background.png) bottom left repeat-x fixed;
 font: 0.9em verdana, helvetica, sans-serif;
 color: rgb(50,50,50);
 padding: 0px;
 text-align: center;
 margin: 0px auto;
 }
 
.none {
 display: none;
 }
 
.container {
 position: relative;
 width: 100%;
 height: 100%;
 background: url(images/headerrepeat.png) repeat-x top left;
 padding: 0px;
 margin: 0px auto;
 text-align: center;
 z-index: 1;
 } 
  
.central {
 position: relative;
 width: 810px;
 padding: 0px;
 margin: 0px auto;
 z-index: 10;
 }

.bricks {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 100%;
 height: 100%;
 background: url(images/bricks.png) top right no-repeat;
 z-index: 10;
 }
 
.header {
 position: relative;
 left: 0px;
 height: 154px;
 width: 1176px;
 margin: 0px auto;
 padding: 0px;
 background: transparent url(images/header.png) left top no-repeat;
 z-index: 20;
 }

.main {
 position: relative;
 width: 100%;
 top: 0px;
 border: black solid;
 overflow: hidden;
 border-width: 0px 7px 0px 7px;
 background: white;
 padding: 0px;
 margin: 0px;
 z-index: 12;
 }
 
p.power {
 font: 0.85em verdana, helvetica, sans-serif;
 text-align: right;
 }

.content {
 top: 0px;
 position: relative;
 float: left;
 width: 72%;
 height: 100%;
 background: white;
 padding: 6px;
 margin: 0px auto;
 z-index: 20;
 }

.buttons {
 position: relative;
 float: right;
 left: 0px;
 width: 22%;
 padding: 7px;
 padding-bottom: 2px;
 margin: 0px auto;
 margin-bottom: -5px;
 z-index: 20;
 border-left: 2px solid black;
 border-bottom: 2px solid black;
 }
 
 .buttons .para {
 position: relative;
 text-align: justify;
 left: 0px;
 }
 
.buttons p {
 position: relative;
 top: 0px;
 text-align: left;
 margin: 10px 5px;
 color: rgb(50,50,50);
 }
 
.footer {
 position: relative;
 float: left;
 border-top: 10px black solid;
 height: 40px;
 width: 100%;
 padding: 7px;
 margin: 0px auto;
 z-index: 15;
 }

.footer p {
 text-align: center;
 font-size: 0.85em;
 padding: 5px;
 margin: 0px;
 }
 
 .portfolio2 table {
  padding: 5px;
  margin: 0px auto;
  }
 
 .home table {
  position: relative;
  top: 5px;
  padding: 5px;
  width: 100%; 
  text-align: left;
  margin: 0px auto;
  }
 
  table img {
  border: 1px solid rgb(110,110,110);
  }
 
 .home td {
  height: 187px;
  width: 50%;
  text-align: center; 
  padding: 10px;
  vertical-align: middle;
  }
  
 td.welcome {
  border: none;
  background: url(images/welcome.png) center center no-repeat;
  }
 
 td.welcome p {
 display: none;
 }

img.floatl {
 position: absolute;
 left: 10px;
 top:67px;
 border: none;
  }
  
.textfloat {
 position: relative;
  }
  
.textfloat p {
 position: relative;
 top: 0px;
 margin-top: 0px;
 margin-bottom: 20px;
 margin-left: 120px;
 }
 
.image img{
 border: rgb(110,110,110) solid 1px;
 }

.about .content p {
 float: left;
 }
  
.buttons ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}

/*List item style*/
.buttons ul li {
position: relative;
  }
  

/*Top level link style*/
.buttons ul li a{
position: relative;
left: 0px;
top: 0px;
height: 53px;
width: 197px;
display: block;
padding: 0px;
margin: 0px auto;
z-index: 290;
}

.buttons ul li a .bar {
position: absolute;
top: 33px;
left: 15px;
height: 2px;
padding: 0px;
margin: 0px auto;
width: 182px;
background: black;
overflow: hidden
}

.buttons ul li a:hover .bar {
background: black;
height: 6px;
}

.buttons ul li a:focus .bar {
background: rgb(7,7,150);
height: 6px;
}

.buttons ul li a.home {
background: url(images/home_but.png) no-repeat center top;
}

.buttons ul li a.home .bar {
left: 58px;
width: 140px;
}

.buttons ul li a.about {
background: url(images/about_but.png) no-repeat center top;
}

.buttons ul li a.about .bar {
left: 22px;
width: 176px;
}

.buttons ul li a.work {
background: url(images/work_but.png) no-repeat center top;
}

.buttons ul li a.work .bar {
left: 18px;
width: 180px;
}

.buttons ul li a.contact {
background: url(images/contact_but.png) no-repeat center top;
}

.buttons ul li a.contact .bar {
left: 31px;
width: 166px;
}

.buttons ul li a .text {
 display: none;
 }

.buttons a:link { color: rgb(50, 50, 150); text-decoration: none; } /* for unvisited links */
.buttons a:visited { color: rgb(50, 50, 150); text-decoration: none; } /* for visited links */
.buttons a:hover { color: rgb(50, 50, 200); text-decoration: none; } /* when mouse is over link */
.buttons a:active { color: rgb(50, 50, 200); text-decoration: none; } /* when link is clicked */

table.port td {
 padding: 2px 7px;
 }