/*------------------------------------------------------------------
reset
------------------------------------------------------------------*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td
{
    margin: 0;
    padding: 0;
}
table
{
    border-collapse: collapse;
    border-spacing: 0;
}
fieldset, img
{
    border: 0;
}
address, caption, cite, code, dfn, th, var
{
    font-style: normal;
    font-weight: normal;
}
ol, ul
{
    list-style: none;
}
caption, th
{
    text-align: left;
}
h1, h2, h3, h4, h5, h6
{
    font-size: 100%;
    font-weight: normal;
}
q:before, q:after
{
    content: '';
}
abbr, acronym
{
    border: 0;
}
/*------------------------------------------------------------------
clearfix
------------------------------------------------------------------*/
.clearfix:after
{
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.clearfix
{
    display: inline-block;
}
html[xmlns] .clearfix
{
    display: block;
}
* html .clearfix
{
    height: 1%;
}
/*------------------------------------------------------------------
base styles
------------------------------------------------------------------*/
body
{
    background: #fff url('/images/background.jpg') top left;
    font: 12px/1.4em "Lucida Grande" , Helvetica;    
}
/*@font-face
{
    font-family: Museo;
    src: url('../fonts/museo.otf');
}*/
a{outline:none;}
a, .highlight
{
    color: #d69404;
}
a.learnMore
{
    font-size: 11px;
    text-decoration: none;
    position: relative;
    right: 0;
}
h2,h3,h4,h5,h6{font-family:Tahoma;font-weight:bold;}
/*------------------------------------------------------------------
header
------------------------------------------------------------------*/
#header
{
    margin: 0 auto;
    padding-top: 20px;
    position: relative;
    width: 980px;
}
#header #logo
{
    background-image: url('/images/vibe-commerce.png');
    background-repeat: no-repeat;
    height: 40px;
    text-indent: -9999px;
    width: 260px;
    display:block;
}
#header #navigation
{
    left: 330px;
    position: absolute;
    top: 20px;
}
#header #navigation li
{
    float: left;
    margin-left: 20px;
    position: relative;
}
#header #navigation li a
{
    color: #000;
    cursor: pointer;
    display: block;
    font-size: 14px;
    font-weight: bold;
    padding: 0 20px;
    text-decoration: none;
}
#header #navigation li a span
{
    display: block;
    height: 58px;
    line-height: 53px;
    margin-right: -30px;
    padding-right: 20px;
}
#header #navigation li a:hover
{
    color: #9acb4f;
}
/* active state */
#header #navigation li.active a
{
    background: url('/images/nav_left.png') top left no-repeat;
    color: #fff;
    cursor: default;
    text-shadow: -1px -1px 1px #80690a;
}
#header #navigation li.active a span
{
    background: url('/images/nav_right.png') top right no-repeat;
}
#header #navigation li.active .arrow
{
    background: url('/images/nav_arrow.png') bottom center no-repeat;
    bottom: -9px;
    height: 19px;
    position: absolute;
    right: -5px;
    width: 100%;
}
#header #navigation li.active a:hover
{
    color: #fff;
}
/*------------------------------------------------------------------
focus-items
------------------------------------------------------------------*/
#focusItems
{
    clear: both;
    background: url('/images/header.jpg') top left;
    height: 346px;
    width: 100%;
}
#focusItems .inner
{
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    height: 371px;
    width: 940px;
}
/* main header */
#focusItems .inner h1
{
    color: #fff;
    font-size: 15px;
    padding-top: 62px;
}

#focusItems .inner #aspdnsfLogo
{
    float: left;
    margin-right: 20px;
    margin-top: 50px;
}
/* 3 boxes */
#focusItems .inner div
{
    background-image: url('/images/main_focus_box.png');
    bottom: -10px;
    height: 238px;
    position: absolute;
    width: 307px;
}
#focusItems .inner div img
{
    position: absolute;
    top: 0;
    right: 20px;
}
#focusItems .inner div strong
{
    font: 16px;
    position: absolute;
    bottom: 70px;
    left: 20px;
    right: 20px;
}
#focusItems .inner div p
{
    position: absolute;
    bottom: 20px;
    left: 20px;
    right: 20px;
}
#focusItems .inner #option1
{
    left: 0;
}
#focusItems .inner #option2
{
    left: 336px;
}
#focusItems .inner #option3
{
    right: 0;
}
#focusItems .inner .option
{
    bottom: 5px;
    z-index: 1000;
}

/*------------------------------------------------------------------
content
------------------------------------------------------------------*/

#content
{
    line-height: 1.6em;
    margin-bottom: -20px;
    min-height:450px;
}
#content h2
{
    font-size: 26px;
    margin-bottom: 5px;
    text-transform: capitalize;
}
#content h3
{
    font-size: 18px;
    margin-bottom: 5px;
    text-transform: capitalize;
}
#content h1 span, #content h2 span, #content h3 span
{
    color: #9acb4f;
}
#content p
{
    margin-bottom: 15px;
    position: relative;
    z-index: 10;
}
#content .line
{
    background: transparent url('/images/horizontal_line.png') top left no-repeat;
    border: 0px;
    display: block;
    height: 4px;
    margin: 20px 0;
}
/* quotes */
#content blockquote
{
    background: url('/images/quote_left.png') 0 0 no-repeat;
    font-style: italic;
    padding: 20px 40px;
}
#content blockquote .author
{
    float: right;
    font-weight: bold;
    text-align: right;
}
#content blockquote .author span
{
    display: block;
    font-size: 10px;
    font-weight: normal;
}
/* two columns */
.twoColumn .leftColumn,.twoColumn .rightColumn{
min-height:400px;
}
.twoColumn
{
    background: url('/images/two_column_lines.png') top left repeat-y;
    margin: 0 auto;
    width: 982px;
}
.twoColumn .leftColumn
{
    float: left;
    margin: 40px 0 60px 20px;
    width: 560px;
    background: transparent url(../images/vibe_commerce_wings.png) no-repeat top right;
}

.twoColumn .rightColumn
{
    background: url('/images/right_column_overlay.png');
    float: right;
    padding: 40px 20px 60px;
    width: 340px;
}
.twoColumn .rightColumn ul
{
    list-style: disc inside;
}
/* recent work */
/*#recentWork{background: transparent url('/images/portfolio_background.png') top left no-repeat;font-size:11px;margin-bottom:30px;padding-top:230px;position:relative;width:324px;}
#recentWork a.previous{background-image:url('/images/gallery_arrows.png');display:block;height:34px;position:absolute;right:29px;text-indent:-9999px;top:-40px;width:30px;}
#recentWork a.next{background:url('/images/gallery_arrows.png') top right no-repeat;display:block;height:34px;position:absolute;right:-2px;text-indent:-9999px;top:-40px;width:31px;}
#recentWork #gallery img{background-color:#000;position:absolute;top:10px;left:10px;height:200px;width:304px;}
#recentWork #gallery h3{font-weight:bold;}*/
/* single column */
.singleColumn
{
    background: url('/images/single_column_lines.png') top left repeat-y;
    margin: 0 auto;
    padding: 40px 20px;
    width: 942px;
}
p#clientsP1
{
    position: relative;
    z-index: 100;
}
img#rock
{
    position: absolute;
    top: -100px;
    left: 0;
    z-index: 0;
}
h3#clientsHeader
{
    margin-left: 120px;
    padding-bottom: 15px;
}
/*------------------------------------------------------------------
footer
------------------------------------------------------------------*/
#footer
{
    background: url('/images/footer_background.png') top left repeat-x;
    height: 125px;
}
#footer .inner
{
    color: #fff;
    margin: 0 auto;
    padding: 60px 20px 0;
    width: 940px;
    position: relative;
}
#footer .inner p
{
    float: right;
}
#footer .inner li
{
    float: left;
}
#footer .inner li a
{
    color: #fff;
    margin-right: 20px;
}
#footer .inner li a:hover
{
    text-decoration: none;
}
img#devNetPartner
{
    position: absolute;
    top: 40px;
    left: 485px;
}
/*------------------------------------------------------------------
Home page slider
------------------------------------------------------------------*/
.twoColumn .rightColumn
{
    /*background:url('/images/right_column_overlay.png');*/
    float: right;
    padding: 40px 20px 60px;
    position: relative;
    width: 340px;
}
#recentWork
{
    background: transparent url('/images/portfolio_background.png') 0 40px no-repeat;
    margin-top: -40px;
    font-size: 11px;
    height: 380px;
    margin-bottom: 30px;
    overflow: hidden;
    padding-top: 40px;
    width: 324px;
    position: relative;
}
#recentWork h3
{
    margin-bottom: 0;
}
#recentWork ul
{
    list-style: none;
}
#recentWork ul li
{
    height: 380px;
    overflow: hidden;
    width: 324px;
}
/* height and width must match #recentWork */
#recentWork #gallery img
{
    background-color: #000;
    display: block;
    margin: 10px 0 20px 10px;
    height: 200px;
    width: 304px;
}
#recentWork #gallery em{display:block;}
#recentWork #gallery p
{
    margin-top: 1em;
    line-height: 1.3em;
}
#previous a
{
    background-image: url('/images/gallery_arrows.png');
    height: 34px;
    position: absolute;
    right: 66px;
    text-indent: -9999px;
    top: 35px;
    width: 30px;
    outline: none;
}
#next a
{
    background: url('/images/gallery_arrows.png') top right no-repeat;
    height: 34px;
    position: absolute;
    right: 35px;
    text-indent: -9999px;
    top: 35px;
    width: 31px;
    outline: none;
}
/*------------------------------------------------------------------
Inner pages
------------------------------------------------------------------*/
div#focusItems.insidePage
{
    height: 50px;
}
div#focusItems.insidePage .inner h1
{
    color: #ccc;
    font-size: 12px;
    padding-top:0;
}
div#focusItems.insidePage .inner
{
    padding: 25px 20px;
    color: #fff;
    height: auto;
}
ul.bullet
{
    list-style: disc inside;
}
ul.bullet ul
{
    list-style: circle inside;
    margin-left:2em;
}