@charset "UTF-8";
header .wrap.webdesign{ background-image: url(../img/webdesign/header.png); width: 321px; height: 149px; padding: 139px 0px 0px 639px; }
header .wrap.contact{ background-image: url(../img/contact/header.png); width: 331px; height: 152px; padding: 136px 0px 0px 629px; }
header .wrap.weboptimisation{ background-image: url(../img/seo/header.png); width: 286px; height: 152px; padding: 136px 0px 0px 674px; }
header .wrap.portfolio{ background-image: none; width: 940px; height: 278px; padding: 10px 10px 0px 10px;  }
header .wrap.blog{ background-image: url(../img/blog/header.png); width: 286px; height: 145px; padding: 143px 0px 0px 674px; }
header .wrap.branding{ background-image: url(../img/branding/header.png); width: 282px; height: 148px; padding: 140px 0px 0px 678px; }
header .wrap.misc{ background-image: url(../img/misc-header.png); width: 282px; height: 148px; padding: 140px 0px 0px 678px; }
header .wrap.wordpress{ background-image: url(../img/webdesign/header-wordpress.png); width: 321px; height: 149px; padding: 139px 0px 0px 639px; }
header .wrap.magento{ background-image: url(../img/webdesign/header-magento.png); width: 321px; height: 149px; padding: 139px 0px 0px 639px; }


#content #introbox { background-image: url(../img/webdesign/intro-box.jpg); width: 872px; height: 99px; padding: 32px 33px 22px; margin-bottom: 35px;  }
#content #introbox.weboptimisation{ background-image: url(../img/seo/intro-box.jpg); width: 476px; height: 100px; padding: 32px 433px 22px 33px; }
#content #introbox.weboptimisation p{ font-size: 1.8em; }
#content #introbox.portfolio{ margin-top: 100px; }
#content #introbox h1 { font-size: 2.2em; }
#content .left h2.works{ padding: 8px 0px 20px 45px; background: url(../img/webdesign/works.jpg) top left no-repeat; }
#content .left h2.experts{ padding: 8px 0px 20px 45px; background: url(../img/seo/star.jpg) top left no-repeat; }
#content .left h2.wordpress{ padding: 8px 0px 20px 45px; background:url(../img/webdesign/wordpress-h2.jpg) top left no-repeat; }
#content .right h2.plus { padding: 8px 0px 20px 45px; background: url(../img/webdesign/plus-h2.jpg) top left no-repeat }
#content .right h2.clock{ padding: 8px 0px 20px 45px; background: url(../img/webdesign/clock.jpg) top left no-repeat; }
#content .right h2.process{ background-image: url(../img/webdesign/our-process.gif); background-repeat: no-repeat; height: 18px; width: 130px; margin-top: 10px; display: block; text-indent: -9999px; }
#content .right h2.cog{ padding: 8px 0px 20px 45px; background: url(../img/seo/cog.jpg) top left no-repeat; }
#content  h2.magento{ padding: 8px 0px 20px 45px; background: url(../img/webdesign/magento.jpg) top left no-repeat; }
#content .left.portfolio{ width: 320px; }
#content .right.portfolio{ width: 520px; }
#content .left ul { list-style-type:none; margin:0px; padding:0px; }

#process{ background-image: url(../img/webdesign/process-bg.gif); width: 392px; height: 136px; margin: 10px 0px 0px 0px; padding: 20px 35px 10px; position: relative; }
#process #slider{  width: 392px; height: 136px; overflow: hidden; } 
#process ul{ padding: 0px!important; margin: 0px; list-style-type: none; } 
#process li{ width: 392px; height: 136px; overflow: hidden; float: left; padding: 0px; margin: 0px; }
#process li.live{ background: url(../img/webdesign/rocket.jpg) 315px 73px no-repeat; }
#process li h3{ padding: 0px 0px 6px; margin: 0px; font-size: 1.2em; }
#process li p{ font-size: 13px!important; }
#process li span{ display: block; text-align: right; margin: 10px 80px 0px 0px; font-weight: bold; }
#processleft a, #processright a{ background-image: url(../img/testimonial-btn.png); width:45px; height:45px; position:absolute; left:-17px; top:58px; z-index:5000; display:block; text-indent: -9999px; }
#processright a{ background-position: -45px 0px; left: 437px; }

#seotips{ background-image: url(../img/seo/testimonials-bg.jpg); width: 494px; height: 225px; float: right; padding: 15px 45px 30px; margin-top: 3px; position: relative; overflow: hidden; }
#seotips h3{ font-size: 2em; padding: 17px 0px 0px 0px; }
#seotips p{ padding: 6px 0px 10px; font-size: 1.3em; }
#seotips #slider { width: 449px; height: 135px; overflow: hidden; margin: 0px 25px 0px 20px; }
#seotips #slider.portfolio{ margin-top: 25px; }
#seotips #slider.portfolio p{ font-size: 15px; font-style: normal; }
#seotips ul { margin: 0px; padding: 0px; list-style: none; }
#seotips ul li { width: 449px; height: 125px; float: left; font-family: Cambria, serif; line-height: 1.5em; color: #868686; padding-top: 10px; }
#seotips #slider p{ font-size: 14px; line-height: 20px; padding-top: 2px; }
#seotips #slider h4{ font-size: 16px; font-style: normal; padding: 0px; margin: 0px; }
#seotips span.contactseo{ display: block;  font-size: 12px; font-family: "Lucida Sans Unicode", sans-serif;  color: #767676; }
#seoleft a, #seoright a{ background-image: url(../img/testimonial-btn.png); width:45px; height:45px; position:absolute; left:7px; top:128px; z-index:5000; display:block; text-indent: -9999px; }
#seoright a{ background-position: -45px 0px; left: 527px; }

header.portfolio { background-image: url(../img/bokeh.jpg); height: 316px; background-repeat: repeat-x; background-color: #e0e0e0; position: relative; }
#carousel { width: 940px; margin: 0 auto; height: 281px; position: absolute; top: 20px!important; }
#carousel ul { margin: 0; padding: 0; position: relative; left: -940px; width: 9999px; }
#carousel li { display:inline; float:left; height: 281px; overflow: hidden;}
.carousel-top { background-image: url(../img/portfolio/carousel-top.png); background-position: top center; height: 315px; position: absolute; z-index: 9999; top: 43px; left: 0px; width: 100%; display: block; }
#container { width: 100%; background: #282828; display: block; overflow: hidden; }
.textholder { z-index: 99999; position: absolute; top: 220px; padding-left: 225px; font-size: 1.3em; color: #CCC; }
.textholder strong{ position: absolute; top: 4px; }
.textholder a { background-image: url(../img/portfolio/view-website.png); width: 122px; height: 24px; display: block; text-indent: -9999px; position: absolute; top: 0px; left: 760px;  }
.textholder a { *background-image: none;  }
.textholder a:hover { background-image: url(../img/portfolio/view-website-hover.png); }
.textholder a:active { background-image: url(../img/portfolio/view-website-active.png); }
.blackbg{ background-image: url(../img/portfolio/textholder-bg.png); background-repeat: no-repeat; width: 940px; height: 81px; top: 180px; position: absolute; z-index: 9999; }
.progress{ z-index: 99999; background-color: #36a7cc; }

#recentprojects{ background-image: url(../img/seo/testimonials-bg.jpg); width: 508px; height: 223px; float: right; padding: 17px 40px 30px 36px; margin-top: 3px; position: relative; overflow: hidden; }
#recentprojects .thumb{ width: 115px; height: 80px; margin: 5px; background-image: url(../img/portfolio/thumb-bg.jpg); float: left; border: #CCC 1px solid; }
#recentprojects h3{ padding: 12px 0px 10px 45px; background: url(../img/portfolio/star.jpg) top left no-repeat; color: #666; text-shadow: #fff 1px 0px 1px; }

/* Contact Form */
#contactform { border:none; padding: 0px; margin: 10px 0px 0px 25px;}
#contactform label { font-size: 13px; padding-top: 3px; }
#contactform .formstyle, #contactform textarea{ width:242px; padding:10px 8px; font-size: 13px; border:solid 1px #cacaca; margin-top: 3px; color: #828383; font-family: Cambria, serif;}
#contactform .formstyle{ background-image: url(../img/form-bg.gif); height: 16px; width: 245px; }
#contactform textarea{ background-image: url(../img/textarea-bg.gif); height: 77px; background-repeat: no-repeat; background-color: #f5f5f5; width: 245px; }
#contactform .formstyle:focus, #contactform textarea:focus{ border-color: #adadad; }
#contactform input[type=button]{ background-image: url(../img/webform-send.gif); border: none;  margin-top: 6px; width: 103px; height: 34px; float: right; }
#contactform .error{ padding-top: 3px; display: block; }

/* Potfolio box */
.portfolio-dark {  width:582px; height:272px; background-image:url(../img/webdesign/portolfio-dark.jpg); float:right; position:relative; overflow:hidden; }
.portfolio-light {  width:582px; height:272px; background-image:url(../img/webdesign/portfolio-light.jpg); position:absolute; top:0px; left:0px; }
a.portfolio-button { width:119px; height:108px; position:absolute; top:54px; right:139px; background-image:url(../img/webdesign/portfolio-button.png); background-repeat:no-repeat; }
a.portfolio-button:hover { background-image:url(../img/webdesign/portfolio-button-hov.png);  }
a.portfolio-button:active { background-image:url(../img/webdesign/portfolio-button-active.png);  }
.wordpress-link { width:232px; height:91px; position:absolute; top:30px; right:-147px; z-index:9999; background-image:url(../img/webdesign/looking-wordpress.png); text-indent:-9999px; }
.magento-link { width:232px; height:87px; position:absolute; top:120px; right:-147px; z-index:9999; background-image:url(../img/webdesign/looking-magento.png); text-indent:-9999px; }


p.quote{ font-family: Cambria, serif; line-height: 1.5em; font-size: 1.5em!important; }
.clearall{ clear: both; }
h4.onoff{ font-size: 1.6em; margin-top: 10px; }
h4{ font-size: 1.6em; }
h5{ font-size: 1.4em; margin: 5px 0px 5px 0px; padding: 0px; }
h6 { font-size:1.2em; font-weight:normal; color:#0e7ca3; margin:0px 0px 7px 0px; }