html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}

/*
 
 #1858C3 - the blue
 #FFCD11 - the yelllow
 #C5D0FB - the purple

*/

html{
      font-family: Garamond, "Hoefler Text", "Times New Roman", Times, serif;
    
}


body{
    
    background: url(/images/bg-header.png) repeat-x
}


#container{
    
    width: 960px;
    margin: 0 auto;
    
    
}

#header{
    
    height: 180px;
    position: relative;
        font-family: futura, "Lucida Sans Unicode" ,helvetica, arial ,sans-serif;

    
}

#header img{
    
    position:relative;
    left: 0;
    top: 35px;
   
    
}

dl#topnav{
    position:absolute;
    left:360px;
    top: 28px;
    width: 600px;
   
    
}

dl#topnav a{
    
    display: block;
    width: 120px;
    height:48px;
    float: left;
    font-size: 16px;
    
    
    
}

dl#topnav a:link,
dl#topnav a:visited,
dl#topnav a:hover,
dl#topnav a:active
{
    color: #000;
    text-decoration:none;
    background: url(images/bg-menu.png) no-repeat 0 200%; /* hidden */
}


dl#topnav a:hover,
dl#topnav a:active,
.web-design                 dl#topnav dd.web-design a,
.search-engine-marketing    dl#topnav dd.search-engine-marketing a,
.lead-generation            dl#topnav dd.lead-generation a,

.portfolio                  dl#topnav dd.portfolio       a,
.about                      dl#topnav dd.about           a

{
    color: #fff;
    text-decoration:none;
    
    background-position: 0 100%;
}





#main
{
    
    display: table;

   
    
}

#content
{
    display: table-cell;
    width: 720px;
    height: 400px;  
  
}

#navigation
{
    
    display: table-cell;
   
    
}

    #navigation ul
    {
        font-family: futura, "Lucida Sans Unicode" ,helvetica, arial ,sans-serif;
        margin-left: 40px;
        padding: 0 0 10px 0;
        list-style: none;
        background: #FFCD11;
        
        /* min height */
        min-height:100px;
        height: auto !important;
        height: 100px;
        

    }

        #navigation ul li
        {
            margin:    0;
            padding: 0;
            list-style: none;
            
        }

        #navigation ul li a:link,
        #navigation ul li a:visited,
        #navigation ul li a:hover,
        #navigation ul li a:active
        {
            
            font-size: 14px;
            line-height: 1.1em;
            text-decoration: none;
            
            display: block;
            padding: 10px 5px 0 20px;
            color: #000;
            background: transparent url(images/bg-nav.png) 0 -100px no-repeat;
        }
        

         #navigation ul li a:hover,
          #navigation ul li a:active,
         #navigation ul li a.select
         {
            background-position: 0 12px;
            color: #fff;
         }








#quicklinks{
    
   position:absolute;
    right:0px;
    top: 100px;
    width: 200px;
    font-size: 12px;
    text-align:right;
    color: #999;
    
    
}

    #quicklinks a{
        
       text-decoration:none;
       color: #999;
        
        
    }

        #quicklinks a:hover,
        #quicklinks a:active
        {
            
            color: #000;
            text-decoration:underline;
            
            
        }


#footer{
   
    height: 300px;
    color: #fff;
    background: #000;
    margin-top: 40px;
    font-family: futura, "Lucida Sans Unicode" ,helvetica, arial ,sans-serif;
}

    #footer div{
        width: 960px;
        margin: 0 auto;
        
        padding: 40px 0;
       
       font-size: 0.9em;
    }
    
     #footer div p {
       color: #fff;
       
       
    }
    
    #footer div a:link,
    #footer div a:visited,
    #footer div a:hover,
    #footer div a:active
    {
       color: #fff;
       text-decoration:none;
       
    }
    
    
    #footer div a:hover,
    #footer div a:active
    {
       text-decoration:underline;
       
    }
    




h1, h2, h3
{
    font-size: 2.5em;
    line-height: 1em;
    letter-spacing: -0.05em;
    color: #999;
    font-family: futura, "Lucida Sans Unicode" ,helvetica, arial ,sans-serif;
    font-weight: normal
}

    h1{
        margin: 0 0 0.8em 0;

    }

    h2{
        margin: 1.8em 0 0.8em 0;
        font-size: 1.6em;
    }

    h3{
        margin-top: 1.8em;
        font-size: 1.4em
    }



p, ul, ol, td
{
    font-size: 1.1em;
    margin:.7em 0 0 0;
    line-height: 1.3em;
    color: #666;
}

li
{
 
    margin-top: 0.2em;
    margin-left: 20px;
    padding-left: 5px;
}

    ul li{
        list-style: square;
    }

    ol li{
        list-style: decimal;
    }






#contact  td{
    
    vertical-align:top;
    padding: 0 5px 5px 0;
}

#contact #honey{
    visibility: hidden;
}







table.homepage{
    
    width: 960px;
    
}

    table.homepage td
    {
        
        padding: 0 30px 0 0 ;
    }
    
        table.homepage td h2
        {
        
            padding: 0;
            margin:0;
            font-size: 26px;
        }




table.web-design{
    
    margin: 2em 0  1em 0;
    width: 100%;
    
}

    table.web-design td{
        
        padding: 0 30px 0 0 ;
    }
    
        table.web-design td h2{
        
            padding: 0;
            margin:0;
            font-size: 26px;
        }




.quote{
    
    border: 1px solid #1858C3;
    margin: 1em 0 2em 0;
    padding: 10px;
    
}

    .quote img{
        
        float: right;
        padding: 0 0 10px 10px;
        
    }

.score {
    
    margin: 1em 0  2em 0
}

    .score th,
    .score td{
        
        border: 1px solid #1858C3;
        text-align: left;
        padding: 5px 10px;
        
    }
    
    
    
#portfolio-list{}


      #portfolio-list h2{
            margin: 0;  /*This is important for the animation */
            padding: 5px;
            background: none  #FFCD11;
      }
    
      .js-enabled .portfolio-item div{
            
            display: none;
      }
    
      .portfolio-item{
            
            margin-bottom: 20px;
      }
            
            .portfolio-item div{
            
                  margin: 0;
                  width: 700px;/*This is important for the animation */
            }     
    
    
    
    
    
/*****************************/

@media print{
      
      /* PRINTER */

      
      
      html{ margin:0;
         padding: 0;}
      
      body{
         font-size: 62.5% ;
         font-family: verdana, helvetica, arial, sans-serif;
         margin:0;
         padding: 0;
           background: none #fff;
      }


      
      p, li, th, td{font-size: 10pt; line-height: 1.5}
      p{margin: 0.8em 0 0 0;padding:0;}
      
      #header{display: none;
      }

      
      
      
}
