@charset "UTF-8";
/* CSS Document */

a.logo span {display:none}
a.logo {
 display:block;
 background-image:url(../buttons/BtnLogo.png);
 width:160px; /*if you chang your image, change height and width here*/
 height:29px;
 margin-top:15px; /*change margin of logo*/
 margin-left:15px;
}

img {
    border-top-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-right-style: none;
}
html{height:100%}
body {
	font-family: Helvetica, Arial, sans-serif;
  font-size:smaller;
width:100%; 
/*background-color:#ffffff;*/ /*change this for overall background color of site*/
margin:0px;
padding:0px;
height:100%;
}
p, li, ul, table, tr, td, h1, h2
  {
  margin:0;
  padding:0;
  text-align:left;
  font-family: Helvetica, Arial, sans-serif;
  }

.black_bg {
position:absolute; 
top:0px; 
left:0px; 
background: #000000;
width:100%;
height:100%;
z-index:0
}

.white_bg {
position:absolute; 
top:0px; 
left:0px; 
background: #ffffff;
width:100%;
height:100%;
z-index:1
}
#wrapper 
{
 position:absolute; 
 top:0px; 
 left:0px;
 width:100%;
 float:left;
 clear:left;
 height:100%;
 z-index:2;
}

#header {
 width:100%;
 float:left;
 clear:left;
 height:100px;
}

#middle {
width:100%;
float:left;
clear:left;
height:80%; /*change height of overall middle section*/
min-height:400px;
position:relative;

}

#home{
 height:550px; /*CHANGE THIS HEIGHT ACCORDING TO YOUR IMAGES*/
 overflow-x:auto;
 overflow-y:hidden;
 position:absolute;
 top:50%;
 margin-top:-280px;
 width:100%;
 text-align:center;
 /*vertical-align:bottom;*/
}

#footer {
 width:100%;
 float:left;
 clear:left;
 height:50px;
 }


/*use this to style your html links*/
a {font-family:Arial, Helvetica, sans-serif; color:#64a6f0; font-size:12px; text-decoration:underline}
a:hover {color:#64a6f0; font-weight:bold}

ul.nav {
 float:left;
 clear:left;
 margin-top:20px;
}

ul.nav li {
 float:left;
 padding-left:20px;
 list-style:none;
}


/*use this to control the containing box of the links in footer*/
ul.links {
 float:left;
 clear:left;
 padding:0px;
 margin:0px;
 margin-left:15px; /*push margin left*/
}

/*spacing between individual footer buttons themselves*/
ul.links li {
 float:left;
 list-style:none;
 padding-right:50px; /*spacing on right side of each button*/
}


/*bio text start*/
.container {
 width:825px;
 margin:0 auto;
 padding-top:100px;
}
.bioText {
 width:325px; /*controls width of horizontal type of bio*/
 float:left;
 color:#666666;
 margin-top:0px;
 line-height:18px;
}

.bioImage {
float:left;
margin-right:20px; /*space to the left of the image*/
width:450px;
}

/*CONTAINER HOLDING PORTFOLIO IMAGES*/
.portfolioContainer {
 height:550px; /*CHANGE THIS HEIGHT ACCORDING TO YOUR IMAGES*/
 overflow-x:auto;
 overflow-y:hidden;
 position:absolute;
 top:50%;
 margin-top:-280px;
 width:100%;
 }

table.portfolio td
{
white-space:nowrap;
padding-left:25px;
padding-right:25px;
text-align:right;
font-size:10px;
color:#666666;
} /* change this for padding between images on portfolio pages*/

.invertButton {
 float:right;
 margin-right:30px;
 margin-top:-15px;
}

.contactText /*changes width of container holding contact text, if your text gets longer, increase this width*/
{
width:150px; float:left
}

span.hdr {font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#666666;} /*use this to style the header text of the contact section*/
span.bodyText {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#999999; line-height:16px;} /* use this to style the body text of the contact section*/

/*styles for client list table*/
table.clients {color:#666666; font-family:Arial, Helvetica, sans-serif; font-size:14px; margin:0 auto; margin-top:40px;}
table li {list-style:none; padding:5px 0px;}

.linksContainer {
        width:800px;
        float:left;
        clear:left;
        height:500px;
        overflow-y:scroll;
        overflow-x:hidden;
        padding:0px 10px;
        }
.linksContainer li {
        font-color:#999999;
        font-size:11px;
    }

.offscn
  {
  position:absolute;
  left: -900px;
  top:0px;
  width:500px;
  }