/*
Copyright (c) 2008, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.5.1
*/
html{color:#000;background:#FFF;background-image: url(images/bg.jpg);}

body {font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}

body{text-align:center; margin: 0px; padding: 0px;}

table.prices{
border-collapse:collapse;
border-spacing:0;
border: black solid 1px;
margin: 20px;
}

table.terms{
border-collapse:collapse;
border-spacing:0;
border: 0px;
text-align: left;
}

td.terms{
text-align: left;
border: 0px;
width: 50%;
padding: 10px;
vertical-align: top;
}

td.services{
border: 0;
text-align: left;
}

td.pricingtd{
width: 50%;
}

td{
border: black solid 1px;
text-align: center;
}


td.header{
background-color: #CCCCCC;
}

td.header1{
background-color: #CCCCCC;
width: 120px;
}

td.header2{
background-color: #CCCCCC;
width: 100px;
}

fieldset,img{border:0;}

q:before,q:after{content:'';}

#footer{
clear:both;
height: 32px;
background-image: 
url('images/footer.jpg');
background-repeat: repeat-x;
width: 1000px;
_width: 995px; /*ie6*/
}

div.footer{
margin-top: 13px;
float: left;
color: white;
width: 32%;
_width: 31%; /*ie6*/
text-align: center;
font-family: Arial;
font-size: 12px;
}

div.footeraddress{
margin-top: 14px;
float: left;
color: white;
width: 32%;
_width: 31%; /*ie6*/
text-align: right;
font-family: Arial;
font-size: smaller;
margin-right: 2%;
}

div.footer a:link{
color: white;
text-decoration: underline;
font-family: Arial;
font-size: 12px;
}

div.footer a:visited{
font-family: Arial;
font-size: 12px;
color: white;
}

div.footer a:hover{
font-family: Arial;
font-size: 12px;
text-decoration: underline;
color: #B47AB5;
}

div.footer a:active{
font-family: Arial;
font-size: 12px;
color: white;
}

#doc,#doc2,#doc3,#doc4,.yui-t1,.yui-t2,.yui-t3,.yui-t4,.yui-t5,.yui-t6,.yui-t7{margin:auto;text-align:left;width:57.69em;*width:56.25em;
min-width:1000px;}


#doc2{width:73.076em;*width:71.25em;}

/*portfolio*/
.main{ 
position:relative;
_position:static; /*ie6*/
margin-right: 129px;
_margin-right: 8px; /*ie6*/
}

#middle .main{
position:static;
margin: 20px 20px 0 20px;
}

#middle .contact{
float: left;
position:static;
margin: 20px;
width: 40%;
_width: 50%; /*ie6*/
}

#middle .portfoliopage{
float: left;
margin: 20px 0 0 0;
position:static;
width: 100%;
}

#middle .hosting{
position:static;
margin: 20px;
width: 95%;
}

#middle .wired{
position:static;
margin: 20px;
width: 95%;
}

.w{
width: 200px;
}

div#kchome{
float: left;
margin: 30px;
}

div#kcbusiness{
float: right;
margin: 30px;
}

div.avg{
float: left;
margin: 10px;
width: 45%;
height: 270px;
}

div.avg1{
float: right;
width: 50%;
margin-top: 20px;
height: 270px;
}

div.avg2{
float: right;
width: 50%;
margin-top: 40px;
height: 270px;
}

img.webimg{
float: left;
margin: 10px;
width: 125px;
height: 115px;
border: black solid 1px;
cursor:pointer;
}

.portcol1{
float: left;
width: 45%;
border: black solid 1px;
}

.portcol2{
float: right;
width: 45%;
border: black solid 1px;
margin-right: 42px;
}

div.portfoliobox{
width: 990px;
position: relative;
}

div.small-portfoliobox{
width: 100%;
position: relative;
clear: both;
}

div.small-website{
float: left;
width: 48%;
height: 250px;
}

div.small-website2{
float: right;
width: 48%;
height: 250px;
}

span.small-webdesc{
font-family: Arial;
font-size: 12px;
text-align: justify;
display: block;
}

div.website{
float: left;
width: 33%;
height: 250px;
text-align: center;
}

.portfolioimg img{

}

div.website2{
float: right;
width: 33%;
height: 250px;
}

div.website1{
float: right;
width: 33%;
height: 250px;
}

div#packages{
width: 997px;
position: relative;
margin: 0 0 0 0px;
border-right-width: 2px;
border-bottom-width: 2px;
border-left-width: 2px;
border-right-style: solid;
border-bottom-style: none;
border-left-style: solid;
border-top-color: #DCDCDC;
border-right-color: #DCDCDC;
border-bottom-color: #DCDCDC;
border-left-color: #DCDCDC;
background-color: white;
}

span.webdesc{
font-family: Arial;
font-size: 12px;
text-align: justify;
padding: 0 10px 10px 10px;
display: block;
}

/*start up*/
div#package1 {
float: left;
width: 302px;
height: 192px;
margin: 20px 0 0 15px;
_margin: 20px 0 0 10px; /*ie6*/
background-image: 
url('images/packagebg.jpg');
}

/*ecommerce */
div#package3{
float: right;
width: 302px;
height: 192px;
margin: 20px 31px 0 0;
_margin: 20px 25px 0 0; /*ie6*/
background-image: 
url('images/packagebg.jpg');
}

/*bespoke */
div#package2{
float: right;
width: 302px;
height: 192px;
margin: 20px 15px 0 0;
_margin: 20px 10px 0 0px; /*ie6*/
background-image: 
url('images/packagebg.jpg');
}

div.websitecol2{
float: right;
margin: 5px;
width: 48%;
height: 200px;
}

#middle{
width:100%;
min-height: 457px;
}

#contactdiv{
float: left;
width: 455px;
margin: 20px;
}

.yui-t4 #middle{float:left;margin-right:-25em;}

.yui-t4 .main{float:right;width:13.8456em;*width:13.50em;}

.yui-t4 #middle .main{margin-right:14.8456em;*margin-right:14.55em;}

#middle .main{
float:none;
width:65%;
margin-bottom: 20px;
}

#body:after,.yui-g:after,.yui-gb:after,.yui-gc:after,.yui-gd:after,.yui-ge:after,.yui-gf:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}


#body,.yui-g,.yui-gb,.yui-gc,.yui-gd,.yui-ge,.yui-gf{
zoom:1;
border-right-width: 2px;
border-bottom-width: 2px;
border-left-width: 2px;
border-right-style: solid;
border-bottom-style: none;
border-left-style: solid;
border-top-color: #DCDCDC;
border-right-color: #DCDCDC;
border-bottom-color: #DCDCDC;
border-left-color: #DCDCDC;
width: 997px;
background-color: white;
}

div#header{
height: 132px;
width: 1000px;
background-image: 
url('images/headerback.jpg');
background-repeat: repeat-x
}

div#logo{
float: left;
height: 132px;
}

div#address{
float: right;
}

div#menu{
height: 55px;
background-image: 
url('images/menuback.jpg');
background-repeat: repeat-x;
width: 1000px;
}

div#packages{
width: 997px;
position: relative;
margin: 0 0 0 0px;
border-right-width: 2px;
border-bottom-width: 2px;
border-left-width: 2px;
border-right-style: solid;
border-bottom-style: none;
border-left-style: solid;
border-top-color: #DCDCDC;
border-right-color: #DCDCDC;
border-bottom-color: #DCDCDC;
border-left-color: #DCDCDC;
background-color: white;
}

div.portheader{
border: 0px;
height: 53px;
width: 300px;
}

div.portcontent{
border: 0px;
width: 287px;
height: 262px;
background-image:
url('images/portbg.jpg');
margin-left: 3px;
padding: 5px 0 0 7px;
}

div.packageleft{
float: left;
margin: 5px 10px 20px 18px; /*ff*/
*margin: 15px 10px 20px 18px; /*ie7*/
_margin: 10px 10px 20px 10px; /*ie6*/
text-align: left;
color: white;
width: 108px;
}

div.packageright{
float: right;
margin: -8px 50px 20px 0px;
_margin: -8px 7px 0 0; /*ie6*/
text-align: right;
color: white;
width: 111px;
}

/*web services*/
div.services{
margin: 20px;
}

div.services1{
float: left;
width: 30%;
_width: 28%; /*ie6*/
margin: 0 2% 0 0;
}

div.services2{
float: right;
width: 30%;
_width: 28%; /*ie6*/
margin-left:2%;
margin-right: 2%;
_margin-right: 3.5%; /*ie6*/
margin: 0 0 0 2%;
}

div.services3{
float: right;
width: 32%;
*width: 31%; /*ie7*/
_width: 35%; /*ie6*/
margin: 0 2% 0 2%;
}

p.address{
font-family: Arial;
font-size: 16px;
font-weight: bolder;
color: #B27BB4;
text-align: right;
margin-right: 15px;
margin-top: 15px;
}

p.content{
font-family: Arial;
font-size: 12px;
text-align: justify;
}

p.packagedesc{
font-family: Arial;
font-size: 13px;
text-align: center;
vertical-align: middle;
}

p.packageprice{
text-align: right;
font-weight: bold;
font-size: 16px;
padding: 0 20px 0 0;
}

p.firstsentence{
margin: 0px;
padding: 0 0 0 0;
text-align: right;
font-size: 11px;
color: white;
font-family: verdana;
width: 400px;
}

div.packageprice{
float: left;
}

div.packagepricedesc{
font-family: Arial;
font-size: 12px;
padding: 20px 0 0 0;
}

p.servicedesc{
font-family: Arial;
font-size: 11px;
text-align: justify;
}

p.validator{
padding: 0;
margin: 0;
text-align: center;
}

p.no{
font-family: Arial;
font-size: 28px;
text-align: center;
font-weight: bold;
}

p.rightmenu{
font-family: Arial;
font-size: 14px;
text-align: justify;
margin: 5px;
padding-right: 7px;
}

p.more{
font-family: Arial;
font-size: 14px;
text-align: justify;
margin: 5px;
}

p.wc{
font-family: Arial;
font-size: 12px;
text-align: justify;
color: red;
font-style: italic;
margin-top: -5px;
width: 293px;
}

p.wcs{
font-family: Arial;
font-size: 14px;
text-align: center;
color: red;
font-style: italic;
font-weight: bold;
}

h1{
font-family: Arial;
font-size: 14px;
font-style: normal;
font-weight: bolder;
border-bottom: solid 3px #B67AB8;
width: 250px;
}

h2{
font-family: Arial;
font-size: 14px;
font-style: normal;
font-weight: bolder;
text-align: center;
_padding: 5px 0 0 0; /*ie6*/
}

h2.advice{
border-bottom: solid 3px #B67AB8;
font-family: Arial;
font-size: 14px;
font-style: normal;
font-weight: bolder;
_padding: 5px 0 0 0; /*ie6*/
text-align: left;
width: 110px;
}

h2.serviceheader{
font-family: Arial;
font-size: 16px;
font-style: normal;
font-weight: bold;
color: #B47AB5;
text-decoration: underline;
text-align: left;
}

ul{
font-family: Arial;
font-size: 12px;
}

ul#more{
font-family: Arial;
font-size: 12px;
line-height: 8px;
*line-height: 15px;
}

li{
line-height: 15px;
}

ul.prices{
font-size: 11px;
list-style-position: inside;
margin: 0px;
padding: 0px;
}

li.wc{
margin-bottom: 10px;
}

li.terms{
margin-bottom: 20px;
}


table#services{
margin-left: auto;
margin-right: auto;
border: 0px;
text-align: left;
}

label{
width: 150px;
float: left;
display: block;
font-weight: bold;
text-align: left;
margin: 0 5px 0 0;
}

div#formbox{
border: black 1px solid;
text-align: left;
width: 430px;
padding: 10px;
float: left;
margin: 0 0 20px 0;
}

div.portfolio{
width: 300px;
}

div.map{
float: right;
margin: 50px 50px 15px 0;
_margin: 50px 20px 15px 0; /*ie6*/
width: 425px;
}

div.wc{
margin: 20px 33% 20px 33%;
text-align: center;
width: 350px;
}

div.hl{
margin: 40px 33% 40px 25%;
text-align: center;
font-weight: bold;
font-size: 16px;
width: 350px;
}

div.no{
margin: 50px 20px 20px 20px;
font-family: Arial;
font-size: 20px;
text-align: center;
font-weight: bold;
}

div#staticsites{
margin: 10px 30% 10px 16%;
width: 500px;
}

div#dynamicsites{
margin: 10px 30% 10px 37%;
width: 500px;
}

div.example{
width: 150px;
text-align: center;
float: left;
margin-bottom: 20px;
}

p.note{
font-family: Arial;
font-size: 10px;
}

a.serv{
font-family: Arial;
font-size: 16px;
font-style: normal;
font-weight: bold;
color: #B47AB5;
text-decoration: underline;
}

a.serv:hover{
font-family: Arial;
font-size: 16px;
font-style: normal;
font-weight: bold;
color: #551A8B;
text-decoration: underline;
}

div.valid{
clear: right;
padding: 10px 0 0 0;
text-align: center;
}

.contacttable {
border:0px;
}

.contacttable td {
border:0px;
}

img.smallpackage{
margin: 10px;
}

div.submitbt{
float: left;
margin: 20px 0 0 80px;
*margin: 20px 0 0 50px;
}

div.resetbt{
margin: 20px 0 0 225px;
}

label{margin: 2px;}

input{margin: 2px;}

select{margin: 2px;}

textarea{margin: 2px;}

.validimg{margin: 5px;}

.welcomepack{padding: 0 0 0 10px;

float: right;}

/*new menu styles*/

#menu #links{list-style: none; position: relative; margin: 0; padding: 0;}
#menu li{padding: 0; margin: 0;}
#menu ul{padding: 0; margin: 0;}

#menu #links li a{
background-image:url('images/buttons.jpg');
background-repeat:no-repeat;
}
#menu #links li{margin: 0; padding: 0; list-style: none;
    position: absolute; top: 0;}
	
#menu #links li, #links a {
    height: 55px; display: block;}

#menu #links li a.homel{background-position:0 0;left: 0; width: 112px;}
#menu #links li a:hover.homel{background-position:0 -56px;}
#menu #links li a.servicesl{background-position:-112px 0;}
#menu #links li a:hover.servicesl{background-position:-112px -56px;}
#menu #links li a.portfoliol{background-position:-223px 0;}
#menu #links li a:hover.portfoliol{background-position:-223px -56px;}
#menu #links li a.pricingl{background-position:-334px 0;}
#menu #links li a:hover.pricingl{background-position:-334px -56px;}
#menu #links li a.wiredl{background-position:-445px 0;}
#menu #links li a:hover.wiredl{background-position:-445px -56px;}
#menu #links li a.webpromosl{background-position:-556px 0;}
#menu #links li a:hover.webpromosl{background-position:-556px -56px;}
#menu #links li a.blogl{background-position:-667px 0;}
#menu #links li a:hover.blogl{background-position:-667px -56px;}
#menu #links li a.aboutl{background-position:-778px 0;}
#menu #links li a:hover.aboutl{background-position:-778px -56px;}
#menu #links li a.contactl{background-position:-889px 0;}
#menu #links li a:hover.contactl{background-position:-889px -56px;}
#menu #homel{left: 0px; width: 112px;}
#menu #servicesl{left: 112px; width: 111px;}
#menu #portfoliol{left: 223px; width: 111px;}
#menu #pricingl{left: 334px; width: 111px;}
#menu #wiredl{left: 445px; width: 111px;}
#menu #webpromosl{left: 556px; width: 111px;}
#menu #blogl{left: 667px; width: 111px;}
#menu #aboutl{left: 778px; width: 111px;}
#menu #contactl{left: 889px; width: 111px;}

#output{font-size: small; text-align: center; width: 80%; margin: 0; font-family: tahoma;}
.nav{background-color: #CCCCCC; width: 280px; padding: 5px 0; height: 15px;}
.slideshow{overflow: hidden; height: 230px; width: 280px;}