﻿body 
{
    background: White url(../images/body_bg.gif) repeat-y center;
    margin: 0;   
    font-family: verdana, arial;
    font-size: 9px;
}

a
{
  color:#999999;
  text-decoration:none;
}

a:hover
{
 color:#0099ff;
}

#container
{
    width: 800px;
    margin: 0 auto;
    background: White url(../images/container_bg.gif) repeat-y left;   
}

#header
{
    height: 48px;
    background: #0b2559;
    padding: 6px 23px;
}

#tagline
{
    height: 20px;   
    text-align: right;
}

#tagline img
{
    margin: 4px;   
}

#nav
{
    height: 25px;
    background: #729eca; 
    position: relative;  
}

#nav ul
{
    margin: 0;
    padding: 0;   
}

#nav li
{
    background: url(../images/top_nav.gif) no-repeat;  
    list-style: none;
    float: left; 
    position: absolute;
    top: 0;
}

#nav li a
{
    height: 25px;  
    display: block; 
}

#nav li span
{   
    display: none;
}

#nav li.nav_1
{
    background-position: -37px 0;
    width: 34px;  
    left: 37px;  
}

#nav li.nav_1 a:hover
{
    background: url(../images/top_nav.gif) no-repeat -37px -25px;   
}

#nav li.nav_2
{
    background-position: -83px 0;
    width: 80px; 
    left: 83px;     
}

#nav li.nav_2 a:hover
{
    background: url(../images/top_nav.gif) no-repeat -83px -25px;   
}

#nav li.nav_3
{
    background-position: -176px 0;
    width: 145px;
    left: 176px;      
}

#nav li.nav_3 a:hover
{
    background: url(../images/top_nav.gif) no-repeat -176px -25px;   
}

#nav li.nav_4
{
    background-position: -335px 0;
    width: 45px; 
    left: 335px;     
}

#nav li.nav_4 a:hover
{
    background: url(../images/top_nav.gif) no-repeat -335px -25px;   
}

#nav li.nav_5
{
    background-position: -394px 0;
    width: 57px; 
    left: 394px;     
}

#nav li.nav_5 a:hover
{
    background: url(../images/top_nav.gif) no-repeat -394px -25px;   
}

#text
{
    width: 613px;
    float: left; 
    display: inline;
    margin-left: 37px; 
    padding-top: 15px; 
}

#right-column
{
    width: 150px;
    float: left;   
    display: inline;
    padding-top: 40px;
}

#text-top
{
    background: url(../images/text_top.gif) no-repeat top;   
}

#text-middle
{
    background: url(../images/text_middle.gif) repeat-y;   
}

#text-bottom
{
    background: url(../images/text_bottom.gif) no-repeat bottom;
    padding: 30px;
}   

p
{
    margin: 6px 0;   
}

#footer
{
    height: 20px;
    background: #729eca;  
    text-align: center;
    margin-top: 20px;
    font-family: Trebuchet MS, Verdana;
    font-size: 10px;
    color: White;
    line-height: 20px;
}

#seo-box, #design-box, #portfolio-box, #contact-box
{
    width: 75px;
    height: 64px;   
    margin-bottom: 15px;
    padding: 8px 8px 8px 50px;
    font-family: Verdana, Arial;
    font-size: 9px;
    color: #0b2559;
    cursor: pointer;
}

#seo-box .title, #design-box .title, #portfolio-box .title, #contact-box .title
{
    font-family: Times New Roman;
    font-size: 11px;
    color: #0686dd;
}

#seo-box
{
    background: url(../images/seo_box.jpg) no-repeat;   
}

#design-box
{
    background: url(../images/design_box.jpg) no-repeat;   
}

#portfolio-box
{
    background: url(../images/portfolio_box.jpg) no-repeat; 
    padding-left: 55px;
    width: 70px;   
}

#contact-box
{
    background: url(../images/contact_box.jpg) no-repeat;   
}

.clear
{
    font-size: 1px;
    line-height: 0px;
    clear: both;   
}

h3
{
    color: #0065a4;
    font-size: 11px;  
    margin: 5px 0;
    font-family: Verdana;
}

/*****PORTFOLIO*****/

.portfolio-top .portfolio-nav
{
    width: 350px;
    background: url(../images/portfolio_nav_bg.gif) no-repeat bottom;
    padding: 22px 0;
    float: right;
    color: #6699cc;  
}

.portfolio-nav ul
{
    margin: 0;
    padding: 0; 
    margin-left: 43px;
}

.portfolio-nav ul li
{
    float: left; 
    list-style: none; 
    position: relative;
    z-index: 1000;
    cursor: pointer; 
}

.portfolio-nav ul li span.portfolio
{
    font-size: 14px;
    color: #6699cc;  
    vertical-align: middle; 
}

.portfolio-nav ul li span.seperator
{
    margin: 0 3px;   
    vertical-align: middle;
}

.portfolio-top h1
{
    display: inline;
    width: 203px;
    float: left;   
}

.portfolio-img
{
    width: 261px;
    float: left;   
    padding-top: 30px;
}

.portfolio-img img
{
    border: 0;   
}

.portfolio-text
{
    width: 236px;
    height: 187px;
    float: left; 
    background: url(../images/portfolio_text_box.jpg) no-repeat;  
    font-size: 9px;
    padding: 25px 28px;
}

.portfolio-container
{
    margin: 45px 0;  
    width: 553px;
}

.portfolio-back, .portfolio-forward
{
    float: left;  
    cursor: pointer;
}

.portfolio-back
{
    padding-left: 70px; 
    width: 206px;  
}

.portfolio-forward
{
    padding-left: 100px; 
    width: 176px;  
}

/*****SEO PAGE*****/

.text-left
{
    width: 378px;
    float: left;   
    display: inline;
}

.text-right
{
    width: 175px;
    float: left;  
    display: inline;
}

.bottom-text .text-left
{
    margin-left: 30px;
    width: 348px;
    padding-bottom: 20px;
    background: url(../images/portfolio_nav_bg.gif) no-repeat bottom; 
}

.bottom-text .text-right
{
    width: 205px;   
}

h2
{
    color: #6699cc;
    font-size: 15px;   
    margin: 5px 0;
    font-family: Times New Roman;   
}

h4
{
    font-size: 14px;
    color: #0099ff;
    font-family: Times New Roman;
    margin: 18px 0;
}

h5
{
    font-size: 14px;
    color: #6699cc;
    font-family: Trebuchet MS, Times New Roman;
    margin: 8px 0;   
}

.seo-quote
{   
    margin: 33px 0 0 47px;
}

.bottom-text
{
    margin-top: 20px; 
    background: White; 
}

#copyright
{
    font-family: Trebuchet MS, Verdana;
    font-size: 9px;
    color: #336699;
    width: 201px;
    margin: 5px auto;  
}

#copyright img
{
    width: 26px;
    float: left;
}

#copyright span
{
    line-height: 26px;
    float: left;
    width: 170px;  
    margin-left: 5px; 
}
    
