html
{
    background-color: #f0f0f0;
    font: normal 75%/1.5em "Lucida Grande" , Lucida, Verdana, sans-serif;
    color: #666;
}

body
{
    text-align: left;
    background: url(../img/back.gif) repeat;
}

a
{
    color: black;
}
a:hover
{
    text-decoration: none;
}

.hide
{
    display: none;
}

/* -- FRAMEWORK -- */
.clear
{
    clear: both;
    display: block;
    overflow: hidden;
    width: 0;
    height: 0;
}

.left
{
    float: left;
}
.right
{
    float: right;
}

.mleft30
{
    margin-left: 30px;
}
.mleft15
{
    margin-left: 15px;
}

.mright30
{
    margin-right: 30px;
}
.mright15
{
    margin-right: 15px;
}

.padd30
{
    padding-left: 30px;
    padding-right: 30px;
}
.padd15
{
    padding-left: 15px;
    padding-right: 15px;
}

.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .imgcol
{
    float: left;
}

.col1
{
    width: 123px;
}
.col2
{
    width: 280px;
}
.col3
{
    width: 435px;
}
.col4
{
    width: 588px;
}
.col5
{
    width: 745px;
}
.col6
{
    width: 900px;
}

.col7
{
    width: 775px;
}
.col8
{
    width: 365px;
}

.imgcol
{
    width: 223px;
}
/* -- end FRAMEWORK -- */

#wrapper
{
    width: 962px;
    margin: 100px auto 0;
}

#header
{
    width: 960px;
    background: #fff;
    border: 1px solid #c5c5c5;
    margin-bottom: 30px;
    float: left;
}

.logo
{
    width: 125px;
    height: 126px;
    background: url(../img/logo.gif) no-repeat;
    text-indent: -999em;
    margin-left: 30px;
    position: relative;
    top: -49px;
    float: left;
    margin-bottom: -60px;
}

#header .col7
{
    padding: 25px 0;
    float: left;
}

#header .home
{
    border-bottom: 1px dotted #767676;
}

.slogan
{
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #525151;
    float: left;
    margin-left: 30px;
    margin-bottom: 0;
}


#content
{
    float: left;
    margin-bottom: 30px;
}

#cform
{
    width: 248px;
    float: left;
    background: #fff;
    border: 1px solid #c5c5c5;
    padding: 0 30px 20px;
}

#about, #services, #portfolio, #contact
{
    background: #fff;
    border: 1px solid #c5c5c5;
    padding-bottom: 30px;
    padding-top: 30px;
}

#team, #badge
{
    background: #fff;
    border: 1px solid #c5c5c5;
    padding-bottom: 30px;
    margin-bottom: 30px;
}

#bottom
{
    float: left;
    padding-top: 20px;
    border-top: 1px dotted #767676;
    margin-top: 20px;
}

#footer
{
    border-top: 1px dotted #767676;
}

#copy p
{
    float: right;
    padding: 15px 30px;
    letter-spacing: 1px;
    margin-bottom: 0;
    font-size: 9px;
    color: #787878;
}


.icon
{
    float: left;
}
.follbtn
{
    width: 100px;
    margin-bottom: 15px;
    float: left;
}
.follbtn.alt
{
    margin-left: 20px;
}

.follbtn a
{
    background: #fff;
    border: 1px solid #c5c5c5;
    padding-top: 3px;
    padding-bottom: 3px;
    margin-left: 20px;
    padding-left: 20px;
    font-size: 10px;
    text-decoration: none;
    display: block;
    color: #444;
}
.follbtn a:hover
{
    background: url(../img/follbtn_bg.gif) repeat-y left top;
}

.follbtn .icon
{
    position: relative;
    top: -3px;
}

.member
{
    margin-top: 10px;
    height: 32px;
}
.member a
{
    text-align: right;
    font-size: 14px;
    color: #282425;
    text-decoration: none;
}
.member p
{
    border-bottom: 1px solid #c5c5c5;
    padding-bottom: 6px;
    text-align: right;
    font-size: 14px;
    color: #282425;
    margin-left: 20px;
    margin-bottom: 0;
}

.client-comment
{
    color: #6c6b6b;
    border-left: 1px solid #c5c5c5;
    border-right: 1px solid #c5c5c5;
    border-top: 1px solid #c5c5c5;
    padding: 15px;
    background: #fff url(../img/bubble-bg.gif) repeat-x 0 bottom;
    margin-bottom: 0;
}
.client
{
    background: url(../img/bubble-btm.gif) no-repeat 0 top;
    margin-bottom: 30px;
    padding-top: 8px;
    border-bottom: 1px dotted #c5c5c5;
    padding-bottom: 8px;
    color: #525151;
    text-align: right;
}
.client.last
{
    border-bottom: none;
    margin-bottom: 0;
}

a.viewbtn
{
    width: 52px;
    height: 17px;
    display: block;
    text-indent: -999em;
    float: right;
    margin-top: 10px;
    background: url(../img/view.gif) no-repeat;
}
a.viewbtn:hover
{
    background: url(../img/view_h.gif) no-repeat;
}

a.viewmorebtn
{
    width: 104px;
    height: 25px;
    display: block;
    text-indent: -999em;
    float: right;
    margin-top: 10px;
    background: url(../img/viewmore.gif) no-repeat;
}
a.viewmorebtn:hover
{
    background: url(../img/viewmore_h.gif) no-repeat;
}

a.readmorebtn
{
    width: 85px;
    height: 25px;
    display: block;
    text-indent: -999em;
    float: right;
    margin-top: 10px;
    background: url(../img/readmorebtn.gif) no-repeat;
}
a.readmorebtn:hover
{
    background: url(../img/readmorebtn_h.gif) no-repeat;
}

#teamimg img
{
    width: 218px;
    margin-top: 30px;
    border: 1px solid #767676;
}

#about img
{
    border: 1px solid #767676;
    padding: 5px;
    margin: 10px;
}


/* -- PORTFOLIO -- */
.works
{
    padding-left: 29px;
    border-left: 1px dotted #767676;
}
.headings
{
    width: 250px;
    padding-right: 30px;
    float: left;
}

#websites
{
    float: left;
    margin-top: 30px;
}
#print, #branding
{
    float: left;
}

.item
{
    margin-bottom: 30px;
    color: #767676;
    width: 278px;
}
.item p
{
    font-size: 10px;
    margin-bottom: 0;
}
.item .workimg
{
    border: 1px solid #c5c5c5;
    height: 118px;
    width: 276px;
    overflow: hidden;
    display: block;
}
.item a.workimg:hover
{
    border: 1px solid black;
}

.stripe
{
    position: absolute;
    height: 10px;
    width: 590px;
    background-image: url(../img/stripe.gif);
}

a.top
{
    text-indent: -999em;
    width: 19px;
    height: 26px;
    display: block;
    overflow: hidden;
    float: left;
    background: url(../img/top.gif) no-repeat 0 bottom;
    position: relative;
    left: -80px;
    opacity: .5;
    bottom: 8px;
}
a.top:hover
{
    opacity: 1;
}

.folioblock
{
    margin-bottom: 30px;
}

/* --end portfolio */

/* -- slide box -- */

#slideshow
{
    position: relative;
    width: 900px;
    height: 308px;
    margin: 0px 30px 30px 30px;
}

#slideshow img
{
    position: absolute;
    width: 900px;
    height: 308px;
    border: 1px solid #767676;
}

/* -- #slide box -- */

/* -- Text Style -- */

h2
{
    color: #3b5998;
    border-bottom: 1px dotted #767676;
}
#who h2
{
    text-indent: -999em;
    border: none;
    background-image: url(../img/who-title.gif);
    width: 280px;
    height: 63px;
    margin-bottom: 20px;
}
#what h2
{
    text-indent: -999em;
    border: none;
    background-image: url(../img/what-title.gif);
    width: 280px;
    height: 63px;
    margin-bottom: 20px;
}
#cform h2
{
    font-size: 30px;
    letter-spacing: 3px;
    color: #3b5998;
    margin-bottom: 20px;
    padding-top: 15px;
    padding-bottom: 10px;
}
#about h2, #services h2, #portfolio h2, #contact h2
{
    font-size: 48px;
    letter-spacing: 3px;
    padding-bottom: 20px;
    margin-bottom: 30px;
}
#portfolio h2
{
    margin-bottom: 10px;
}

#team h3, #follow h3, #testimonials h3, #badge h3
{
    letter-spacing: 2px;
    font-size: 20px;
    color: #484848;
    padding-bottom: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    border-bottom: 1px dotted #767676;
}
#bottom h3
{
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    color: #282425;
    border-bottom: 1px dotted #767676;
}
.headings h3
{
    font-size: 24px;
    letter-spacing: 1px;
    margin-bottom: 20px;
    text-align: right;
    color: #5e5e5e;
}
#about h3
{
    font-size: 21px;
}

#about h4
{
    font-size: 19px;
}
.item h4
{
    font-size: 16px;
    color: #282425;
    text-transform: uppercase;
    margin-bottom: 10px;
    margin-top: 10px;
    border-bottom: 1px dotted grey;
    padding-bottom: 6px;
}

#about h5
{
    font-size: 17px;
}
#about h6
{
    font-size: 15px;
}

h3, h4, h5, h6, pre
{
    margin-bottom: 20px;
}

p
{
    margin-bottom: 1.25em;
    text-align:justify;
}
#about p, #who p, #what p, #services p, #contact p
{
    line-height: 1.8em;
}
p.sign
{
    text-indent: -999em;
    width: 126px;
    height: 34px;
    background: url(../img/sign.gif) no-repeat;
    float: right;
    margin-top: 10px;
    margin-bottom: 0;
}
#badge p
{
    margin-bottom: 0;
}

#content a
{
    color: black;
}
#content a:hover
{
    text-decoration: none;
}
pre, code
{
    font-size: 13px;
}
blockquote
{
    margin-left: 30px;
    border-left: 3px solid grey;
    padding-left: 10px;
    font-size: 14px;
}
strong
{
    font-weight: bold;
}
em
{
    font-style: italic;
}
del
{
    text-decoration: line-through;
}
#bottom li
{
    list-style-type: disc;
    list-style-position: inside;
    font-size: 11px;
    margin-bottom: .5em;
}

#content.home li
{
    list-style: disc;
    list-style-position: inside;
    margin: 10px 10px 2px;
    padding: 3px 0;
    border-bottom: 1px dotted gray;
}


/* NAVIGATION */

#nav
{
    float: right;
}

#nav ul
{
    float: left;
}

#nav li
{
    list-style: none;
    display: inline;
    float: left;
    margin-right: 30px;
}

#nav li a, #submenu li a
{
    position: relative;
    text-decoration: none;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #525151;
    overflow: hidden;
}
#nav li a:hover, #nav .selected a, #submenu li a:hover
{
    padding-bottom: 5px;
    border-bottom: 1px dotted #767676;
}

#nav li.last, #submenu li.last
{
    margin-right: 0;
}

#secnav
{
    float: left;
    padding: 15px 30px;
}
#secnav li
{
    list-style: none;
    display: inline;
    float: left;
    margin-right: 20px;
}

#secnav li a
{
    position: relative;
    font-size: 9px;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #787878;
}
#secnav li a:hover, #secnav .selected a
{
    padding-bottom: 5px;
    border-bottom: 1px dotted #767676;
}

#submenu
{
    float: right;
}
#submenu li
{
    display: inline;
    list-style: none;
    margin-right: 20px;
    text-transform: uppercase;
}


/* END NAVIGATION */

/* -- contact form -- */

/* Form */

#emailerror
{
    margin-bottom: 10px;
    padding: 10px;
    background: #fcc;
    border: 1px solid #ff1600;
    color: #4b4b4b;
}

#success
{
    margin-bottom: 10px;
    padding: 10px;
    background: #d6f1a9;
    border: 1px solid #76993d;
    color: #455a23;
}

#success p
{
    font-size: 16px;
    margin-bottom: 0;
}

#error img
{
    width: 20px;
    height: 20px;
    float: left;
    display: block;
    margin-right: 10px;
}

.error
{
    color: #99100f;
    margin-bottom: 10px;
    font-size: 20px;
}

#emailerror li
{
    margin-left: 10px;
    margin-bottom: 5px;
    list-style-type: disc;
    list-style-position: inside;
}

/* // Form	*/

#submitform #Message, #Name, #Email
{
    width: 568px;
    max-width: 568px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 10px;
    color: #666;
}

#submitform #Name, #Email
{
    height: 20px;
}
#submitform #Message
{
    height: 80px;
}

#submitformhome #Message, #submitformhome #Name, #submitformhome #Email
{
    width: 228px;
    max-width: 228px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 10px;
    color: #666;
}

#submitformhome #Name, #submitformhome #Email
{
    height: 10px;
}
#submitformhome #Message
{
    height: 80px;
}


#submitform label, #submitformhome label, .required
{
    float: left;
    text-transform: uppercase;
    font-size: 9px;
    color: #767676;
    padding-bottom: 3px;
    margin-bottom: 0;
}

.submit-button
{
    display: block;
    line-height: 0px;
    text-indent: -999em;
    background: url(../img/submit.gif) no-repeat;
    border: none;
    height: 25px;
    overflow: hidden;
    margin-top: 10px;
    margin-bottom: 0;
    float: right;
    width: 76px;
}

.submit-button:hover
{
    background: url(../img/submit_h.gif) no-repeat;
}

/* -- #contact form -- */