/* Layout of main template styles */
/*/////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////*/

html
{
    background: #fff url(../i/bg-s.jpg) repeat-x;
}

#wrap
{
    margin: 0 auto;
    width: 960px;
}

#top-banner
{
    height: 79px;
    width: 960px;
}

#logo
{
    background: url(../i/logo.jpg) no-repeat;
    float: left;
    height: 79px;
    width: 170px;
}

#navigation
{
    float: right;
    height: 79px;
    width: 429px;
}

#main-banner
{
    height: 300px;
    width: 960px;
}

#banner  /* Banner for all other pages */
{
    height: 130px;
}

#content
{
    margin-top: 30px;
    min-height:700px;
    height:auto !important;
    height:700px;
    width: 960px;
}

#content-left
{
    float: left;
    width: 700px;
}

#content-right
{
    float: right;
    width: 235px;
}

#footer
{
    background: #222 url(../i/footer-bg.jpg) repeat-x;
    clear: both;
    height: 95px;
}

#footer-content
{
    margin: 0 auto;
    padding-top: 35px;
    width: 960px;    
}

#footer-left
{
    float: left;
    width: 750px;
}

#footer-right
{
    float: right;
    text-align: right;
    width: 100px;
}


/* Typography */
/*/////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////*/

/* Body Elements */
/*///////////////////////////////////////////////////////*/

body
{
    color: #333;
	/* adjust the font size (65.5% = 10px, 75% = 12px) */ 
    font: 82% "Lucida Grande", Helvetica, Sans-Serif;
   	line-height: 1.6;
}

p
{
    font-size: 1em;
	margin: 8px 0;
}


/* Headings */
/*///////////////////////////////////////////////////////*/

h1, h2, h3
{
    color: #376b9d;
    font-family: "Lucida Sans", "Trebuchet MS", Arial, Sans-Serif;
}

h1
{
    font-size: 1.55em;
}
h1#imgrep
{
    background: url(../i/logo.jpg) no-repeat;
    float: left;
    display:block;
    text-indent:-9999px;
    height: 79px;
    width: 170px;
}
#imgrep-link
{
    display:block;
    height: 79px;
    width: 170px;
    position:absolute;
}
	
h2 
{
    font-size: 1.3em;
    margin-bottom: -2px;
}

#body_hom h2
{
    font-size: 1.85em;
}
	
h3
{
    font-size: 1.2em;
}

#body_hom h3
{
    font-size: 1.2em;
    margin-bottom: -2px;
}
	

#client-list-l h2, #client-list-r h2
{
    color: #376b9d;
}

.portfolio-h1
{
    margin-bottom: -5px;
}


/* Link styles */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

/* General Link styles */
/*///////////////////////////////////////////////////////*/

a
{
    outline: none;
}

p a:link, p a:active, span a:link, span a:active
{
    border-bottom: dotted 1px #0d6cb8;
    color: #0d6cb8;
    text-decoration: none;
}

p a:visited, span a:visited
{
    border-bottom: dotted 1px #0d6cb8;
    color: #0d6cb8;
    text-decoration: none;
}

p a:hover, span a:hover
{
    border-bottom: solid 1px #0d6cb8;
    color: #075695;
    text-decoration: none;    
}


/* Portfolio Link styles */
/*///////////////////////////////////////////////////////*/

#portfolio-back span a:link, #portfolio-back span a:active
{
    border-bottom: none;
    color: #aaa;
    text-decoration: none;
}

#portfolio-back span a:visited
{
    border-bottom: none;
    color: #aaa;
    text-decoration: none;
}

#portfolio-back span a:hover
{
    border-bottom: none;
    color: #075695;
    text-decoration: none;
}


/* Breadcrumbs Link styles */
/*///////////////////////////////////////////////////////*/

.breadcrumbs a:link, .breadcrumbs a:active
{
    border-bottom: dotted 1px #0d6cb8;
    color: #0d6cb8;
    text-decoration: none;
}

.breadcrumbs a:visited
{
    border-bottom: dotted 1px #0d6cb8;
    color: #0d6cb8;
    text-decoration: none;
}

.breadcrumbs a:hover
{
    border-bottom: solid 1px #0d6cb8;
    color: #075695;
    text-decoration: none;    
}

/* List styles */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

/* Generic List */
/*///////////////////////////////////////////////////////*/

.list
{
    margin: 10px 0 10px 2.5em;
}

.list li
{
    font-size: 1em;
    line-height: 1.8;
    list-style-type: square;
}

/* E-Commerce List */
/*///////////////////////////////////////////////////////*/

.ecommerce-list .list
{
    margin: 10px 0 10px 10px;
}

.ecommerce-list .list li
{
	background-image:url(../i/arrow.jpg);
	background-position: 0px 8px;
	background-repeat: no-repeat;     
    font-size: 1em;
    line-height: 1.8;
    list-style-type: none;
    padding-left: 1.5em;
}

/* Contact List */
/*///////////////////////////////////////////////////////*/

#contact-list
{
    margin-bottom: 15px;
}

#contact-list li
{
    border-bottom: dotted 1px #ccc;
    font-size: 1.1em;
    padding: 2px 0 2px 0.5em;
}

#contact-list img
{
    margin-right: 5px;
}


/* Clients List */
/*///////////////////////////////////////////////////////*/
#images-wrap{
float:left;
}	
	
#client-list img
{
    float:left;
    margin:5px;
    border:solid 1px #ccc;
    height:110px;
    width:180px;
}
#client-list .thumb-frame
{
    float:left;
    margin:10px 10px;
    border:solid 2px #ccc;
}
#client-list .first
{
    margin-left:0px;
}
#client-list .last
{
    margin-right:0px;
}

/* Services Home List */

#services-list
{
    margin: 10px 0 15px 0;
}

#services-list li
{
    border-bottom: dotted 1px #ccc;
    line-height: 1.9;
    list-style-type: none;
    background-image: url(../i/tick.gif);
    background-repeat: no-repeat;
    background-position: 1em .5em;    
    padding: 3px 0 3px 40px;       
}
	
/* Services List */
/*///////////////////////////////////////////////////////*/

/* allow room for 3 columns */
.tech-list ul
{
width: 30em;
}

/* float & allow room for the widest item */
.tech-list ul li
{
    font-size: 0.9em;
    float: left;
    width: 12em;
    line-height: 1.9;
    list-style-type: none;
    margin-left: 0.3em;
    background-image: url(../i/tick.gif);
    background-repeat: no-repeat;
    background-position: 0 .2em;    
    padding-left: 25px;
}

/* stop the float */
br
{
clear: left;
}

/* separate the list from subsequent markup */
div.tech-list
{
    margin-bottom: 1em;
    margin-top: 1em;
}

/* Misc Styles */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

.bold
{
    font-weight: bold;
}

.larger
{
    font-size: 1.1em;
}

.dots
{
    border-bottom: dotted 1px #ccc;
}

.underline
{
    border-bottom: solid 1px #376b9d;
    margin-bottom: 20px;
    width: 280px;
}

/* Footer Style */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

#footer p
{
    color: #e0e0e0;
}

#footer img
{
    float: right;
    margin: 6px 0 0 15px;
}


/* Breadcrumbs */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

.breadcrumbs
{
    font-size: 0.9em;
    margin-bottom: 15px;
    width: 100%;
}

.breadcrumbs img
{
    margin: 0 5px;
}


/* Pages */
/*/////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////*/


/* Home */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

#main-banner {
    padding: 302px 0 0 0;
    overflow: hidden;
    background-image: url("../i/banners/home-banner-01.jpg"); 
    background-repeat: no-repeat;
    height: 0px !important; /* for most browsers */
    height /**/:302px; /* for IE5.5's bad box model */
} 
#content-top
{
    margin-bottom: 35px;
    width: 100%;
}

#content-top h1
{
    font-size: 1.8em;
}

#content-top p
{
    font-size: 1.3em;
}

#home-services
{
    float: left;
    margin-right: 30px;
    width: 570px;
}

.home-service-row
{
    clear: left;
}

.home-service-l
{
    float: left;
    margin-bottom: 30px;
    width: 265px;
}

.home-service-r
{
    float: right;
    margin-bottom: 30px;
    width: 265px;    
}

.home-service-title
{
    margin-bottom: 15px;
}

.home-service-l h2, .home-service-r h2
{
    font-size: 1.2em;
    line-height: 1.4;
}

.home-service-l img, .home-service-r img
{
    float: left;
    margin: 0 15px 15px 0;
}

/* Client Logos */

#client-logos
{
    background: url(../i/clientlogos-box.jpg) no-repeat;
    float: right;
    height: 577px;
    margin-top: 10px;
    position: relative;
    width: 344px;
    z-index: 0;
}

.client-logo
{
    margin: 12px 0 0 20px;
    padding-bottom: 3px;
}

.client-logo-t
{
    margin: 12px 0 0 20px;
    padding-top: 10px;
}

.client-logo img
{
    margin: 0 0 -3px 0;
}

.client-logo-name
{
    background: url(../i/local-clients-bg.jpg) repeat-x;
    color: #fff;
    text-align: right;
    text-transform: uppercase;
    padding-right: 5px;
    position: relative;
    width: 299px;
    z-index: 0;
}

.client-logo-name p
{
    color: #fff;
    font-family: Arial, Verdana, Sans-Serif;
    font-size: 0.9em; 
    margin: 0;
    padding: 0;
}

.client-logo-name a
{
    color: #fff;
    font-family: Arial, Verdana, Sans-Serif;
}

.client-logo-name a:link
{
    color: #fff;
    text-decoration: none;
}

.client-logo-name a:active
{
    color: #fff;
}

.client-logo-name a:hover
{
    color: #fff;
    text-decoration: underline;
}

.client-logo-name a:visited
{
    color: #fff;
    font-family: Arial, Verdana, Sans-Serif;
}

#ribbon
{
    position: absolute;
    z-index: 10;
}



/* About */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/



/* Services */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

#services-list-1
{
    float: left;
    margin-right: 40px;
    width: 287px;
}

#services-list-2
{
    float: left;
    margin-right: 40px;
    width: 287px;    
}

#services-list-3
{
    float: left;
    width: 287px;     
}

.service
{
    border-bottom: dotted 1px #ccc;
    margin-bottom: 5px;
    overflow: auto;
}

#services-list-1 h1, #services-list-2 h1, #services-list-3 h1
{
    border-bottom: solid 1px #376b9d;
    margin-bottom: 15px;
    width: 287px;
}

.service h3
{
    font-style: italic;
    margin-bottom: -5px;
}

/* E-Commerce Lists */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

.ecommerce-features-row
{
    margin: 15px 0 0 0;
    overflow: auto;
}

.ecommerce-list-1
{
    float: left;
    margin-right: 40px;
    width: 287px;
}

.ecommerce-list-2
{
    float: left;
    margin-right: 40px;
    width: 287px;    
}

.ecommerce-list-3
{
    float: left;
    width: 287px;     
}

.ecommerce-list
{
    margin-bottom: 5px;
    overflow: auto;
}

.ecommerce-list-1 h3, .ecommerce-list-2 h3, .ecommerce-list-3 h3
{
    font-size: 1.2em;
    width: 287px;
}

/* SEO Page */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

#seo-screenshot
{
    margin: 20px 0;
}

.seo-row
{
    margin: 15px 0 0 0;
    overflow: auto;
}

.seo-feat-1
{
    float: left;
    margin-right: 40px;
    width: 287px;
}

.seo-feat-2
{
    float: left;
    margin-right: 40px;
    width: 287px;    
}

.seo-feat-3
{
    float: left;
    width: 287px;     
}

.seo-feat-1 h3, .seo-feat-2 h3, .seo-feat-3 h3
{
    font-size: 1.2em;
    width: 287px;
}

.seo-feat-1 img, .seo-feat-2 img, .seo-feat-3 img
{
    border: solid 1px #ccc;
    margin: 10px 0 2px 0;
}

/* Google AdWords Page */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

#google-adwords-screenshot
{
    background: url(../i/adwords-screenshot.jpg) no-repeat top left;
    height: 420px;
    margin: 25px 0;
}

#google-adwords-screenshot div
{
    float: right;
    margin-top: 40px;
    width: 420px;
}

/* Online Marketing Page */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

#link-building-screenshot
{
    background: url(../i/link-building.jpg) no-repeat top left;
    height: 400px;
    margin: 25px 0;
}

#link-building-screenshot div
{
    float: right;
    margin-top: 10px;
    width: 420px;
}

.marketing-row
{
    margin: 15px 0 0 0;
    overflow: auto;
}

.marketing-feat-1
{
    float: left;
    margin-right: 40px;
    width: 287px;
}

.marketing-feat-2
{
    float: left;
    margin-right: 40px;
    width: 287px;    
}

.marketing-feat-3
{
    float: left;
    width: 287px;     
}

.marketing-feat-1 h3, .marketing-feat-2 h3, .marketing-feat-3 h3
{
    font-size: 1.2em;
    width: 287px;
}

.marketing-feat-1 img, .marketing-feat-2 img, .marketing-feat-3 img
{
    border: solid 1px #ccc;
    margin: 10px 0 2px 0;
}

/* Market Analysis Page */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

#market-analysis-screenshot
{
    background: url(../i/alexa-screenshot.jpg) no-repeat top left;
    height: 400px;
    margin: 25px 0;    
}

#market-analysis-screenshot div
{
    float: right;
    margin-top: 10px;
    width: 420px;
}


/* Portfolio Page */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

.screenshots-row
{
    height: 175px;
    margin: 10px 0;
    width: 693px;
}

.screenshot
{
    float: left;
    margin-right: 25px;
    width: 206px;
}

.screenshot span
{
    color: #376b9d;
    display: block;
    font-size: 1em;
    margin: 0 0 5px 2px;
}

/* Testimonials */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

#testimonials
{
    float: right;
    width: 235px;
}

#testimonials p
{
    color: #333;
    font-size: 1em;
    font-style: italic;
}

#testimonials p.t-footer
{
    font-size: 1em;
    font-style: normal;
    margin-bottom: 15px;
    text-align: right;
}

/* Testimonials Page*/
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

.testimonial-item
{
    margin:0 0 20px 0;
}
.testimonial-quote-top
{
    background: url(../i/quote-top.png) no-repeat;;
    height:33px;
    width:40px;
    position:absolute;
    z-index:-1;
}
.testimonial-quote-bottom
{
    background: url(../i/quote-bottom.png) no-repeat;
    height:33px;
    width:40px;
    position:absolute;
    left:100%;
    margin:-33px 0 0 -40px;
    z-index:-1;
}
.testimonial-text
{
    position:relative;
    text-indent:20px;
    z-index:1;
}
.testimonial-quote-text
{
    padding:15px 20px;
    display:block;
}


/* Portfolio Detail */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/


#portfolio-detail-l
{
    float: left;
    margin-top: 10px;
    width: 540px;
}

#portfolio-detail-r
{
    float: right;
    margin-top: 10px;
    width: 400px;    
}

#other-projects
{
    clear: left;
    margin-top: 10px;
}

#other-projects h2
{
    margin-bottom: 11px;
}

.screen
{
    float: left;
    margin-right: 13px;
}


.screen span, .screen-last span
{
    color: #376b9d;
    display: block;
    font-size: 1em;
    margin: 0 0 5px 2px;
}

/* Services Delivered */

#services-delivered
{
    margin-top: 15px;
}

/* Portfolio Back Link */

#portfolio-back
{
    color: #aaa;
    font-size: 1.1em;
    font-weight: bold;
    text-transform: uppercase;
}

.portfolio-link
{
    color: #666;
    font-size: 0.9em;
    font-style: italic;
    margin-top: 0;
}


/* Clients List */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

#client-list-l, #client-list-r
{
    float: left;
    margin-right: 15px;
    width: 200px;
}


/* Contact */
/*///////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////*/

#contact-left
{
    float: left;
    margin-right: 45px;
    width: 532px;
}

#contact-right
{
    float: right;
    width: 380px;
}

#contact-form
{
    background-color: #f9f9f9;
    border: solid 1px #eee;
    padding: 20px;
}

#contact-form h3
{
    font-size: 1.3em;
    margin: 0 0 10px 0;
}

.label, .input 
{
    display: block;
    width: 100%;
}

.input 
{
    padding: 5px;
    border: 1px solid #dad8c4;
    font-family: "Lucida grande", Helvetica, Arial, sans-serif;
    font-size: 1em;
    margin-bottom: 10px;
    width: 476px;
}

.text
{
    height: 200px;
}

span.req
{
    color: #999;
    font-size: 0.85em;
}

#btnSubmit
{
    border: solid 1px #ccc;
    font-size: 0.9em;
    height: 30px;
    width: 100px;
}

p.map-link
{
    font-size: 0.9em;
    margin: 0;
    text-align: right;
}

#address
{
    float: right;
    margin-top: 5px;
    text-align: right;
}

.phone, .email, .company
{
    color: #376b9d;
    font-size: 1.15em;
    font-weight: bold;
}

#info-msg, #sent-msg
{
    background-color: #ffffcc;
    border: solid 1px #ffcc00;
    color: #a22914;
    height: 30px;
    margin-bottom: 15px;
    padding: 0 10px;
    width: 464px;
}

#info-msg p, #sent-msg p
{
    font-size: 13px;
    margin-top: 3px;
    padding: 0;
}

#info-msg img, #sent-msg img
{
    border: 0;
    float: left;
    margin: 2px 10px 0 0;
}

.validator
{
    font-weight: bold;
}