/* CSS Document */
/* 960px */
*{margin:0;padding:0;}


/* General */
body {
	background: #FFF;
	width: 100%;
	height: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px; /*font-size also tested at 12px */
	font-weight: normal;
	line-height: 1.2em;
	text-align: center;
	margin: 0 auto;
    padding: 0; }
	
#wrap-webdesign { background: #FFF url(../images/tp-bg.jpg) center top repeat-x; width:100%; min-width: 960px; }

#main-webdesign {

width: 960px;
margin: 0 auto;
padding:0;
text-align: center;
}

#topmast-webdesign { padding-top: 10px; display: block; }
#tp-menu-container { width: 900px; height: 135px;  margin: 0 auto;   }

#tp-menu {
background: url(../images/tp-menu-bg.gif) top right no-repeat; width: 376px; height: 36px; float: right; font: 12px Arial, Helvetica, sans-serif; color: #FFF; text-align: center; }

#tp-menu a:link { color: #CCC; text-decoration: none; margin: 0 4px; } 
#tp-menu a:visited { color: #CCC; text-decoration: none; margin: 0 4px;}
#tp-menu a:hover { color: #FFF; text-decoration: underline; margin: 0 4px;}

#logo-webdesign { width: 244px; height: 56px; float: left; margin-top: 40px; } /*Remove margin when topmenu is enabled*/

img { border: 0; margin: 0; padding: 0; vertical-align: top; display: block; }

/*Classes*/

.clear { clear: both; margin: 0; padding: 0; height: 0;  }
.pad-vert-40 { padding: 40px 0 20px 0; }
.pad-vert-30 { padding: 30px 0; }
.pad-vert-20 { padding: 20px 0; }
.pad-vert-15 { padding: 15px 0; }
.pad-all-20 { padding: 20px; text-align: left; }
.pad-top-20 {padding-top: 20px; }
.pad-sides-15 { padding: 0 15px; }
.pad-sides-20 { padding: 0 20px; }
.pad-sides-25 { padding: 0 25px; }
.pad-vert-10 { padding-bottom: 10px; }
.pad-vert-5 { padding-bottom: 5px; }
.padding-cf1 { padding: 14px 5px 10px 20px; text-align: left; }
.margin-cf1 { margin: 5px 0 10px 5px; }
.margin-cf2 { margin: 25px 0 10px 5px; }
.margin-10t { margin-top: 10px; }
.margin-cf3 { margin: 10px 15px 15px 0; }
.margin-r10 { margin-right: 10px; }
.margin-r20 { margin-right: 20px; }
.margin-bt-10 { margin-bottom: 10px; } 
.block { display: block; margin-bottom: 10px; }

.port-container { width: 575px; height: 240px; margin: 0 auto; display: block; text-align: left; }
.port-text { width: 200px; float: left; display: inline; margin: 10px; color: #FFFFFF;  }

.port-text a:link { color: #CCCCCC; text-decoration: none; }
.port-text a:visited { color: #CCCCCC; text-decoration: none; }
.port-text a:hover { color: #99CC00; text-decoration: underline; }

.port-img { width: 325px; display: inline; }

.port-container2 { width: 600px; margin: 0 auto; display: block; text-align: center; }

.port-container2 a:link { color: #006699; text-decoration: none; }
.port-container2 a:visited { color: #006699; text-decoration: none; }
.port-container2 a:hover { color: #999900; text-decoration: none; }

.port-container2 p { padding: 0 0 0 35px; margin-left: 4px; line-height: 31px; }
.port-numb { float: left; display: inline; padding: 0; margin: 0;  }

.wrapper { padding-left: 5px; margin-left: 40px; font: 17px Arial, Helvetica, sans-serif; line-height: 31px; text-align: left; }

.numb1 { background: url(../images/port1.gif) top left no-repeat; }
.numb2 { background: url(../images/port2.gif) top left no-repeat; }

.border-ccc { border-bottom: 5px solid #CCCCCC; margin-bottom: 10px; padding-bottom: 15px; }
.border-thin { border-bottom: 1px solid #CCCCCC; margin-bottom: 10px; padding-bottom: 10px; }

.genericleft { text-align: left; padding: 5px; }
.genericleft p { margin: 6px 0; }
.genericleft a:link { color: #999900; text-decoration: none; }
.genericleft a:visited{ color: #999900; text-decoration: none;  }
.genericleft a:hover { color: #006699; text-decoration: none;  }

.genericright img { text-align: right; padding: 5px; display: inline; }
.genericright p { margin: 6px 0; }

.mini { text-align: left; padding-left: 20px; background: url(../images/square.jpg) center left no-repeat; line-height: 20px; }
.mini a:link { color: #999900; text-decoration: none; text-decoration: underline; }
.mini a:visited { color: #999900; text-decoration: none; text-decoration: underline; }
.mini a:hover { color: #006699; text-decoration: none; }

.mini { text-align: left; padding-left: 20px; background: url(../images/square.jpg) center left no-repeat; line-height: 15px; }
.mini a:link { color: #999900; text-decoration: none; text-decoration: underline; }
.mini a:visited { color: #999900; text-decoration: none; text-decoration: underline; }
.mini a:hover { color: #006699; text-decoration: none; }

.mini-blue { text-align: left; padding-left: 20px; background: url(../images/square-gray.jpg) center left no-repeat; line-height: 15px; }


.border-gray-10 { border: 10px solid #E2E2E2; }

.showcase { width: 580px; text-align: center; margin: 0 auto; padding: 5px 0; }

.showcase-wd { width: 600px; height: 327px; text-align: center; margin: 0 auto; padding: 5px 0; background: url(../images/web-design-development.jpg) center left no-repeat; }

.showcase-cms { width: 600px; height: 327px; text-align: center; margin: 0 auto; padding: 5px 0; background: url(../images/cms-drupal.jpg) center left no-repeat; }


.showcase-conversion { width: 600px; height: 327px; text-align: center; margin: 0 auto; padding: 5px 0; background: url(../images/conversion2.jpg) center left no-repeat; }
.showcase-bi { width: 600px; height: 327px; text-align: center; margin: 0 auto; padding: 5px 0; background: url(../images/branding-identity.jpg) center left no-repeat; }
.showcase-ec { width: 600px; height: 327px; text-align: center; margin: 0 auto; padding: 5px 0; background: url(../images/e-commerce.jpg) center left no-repeat; }
.showcase-im { width: 600px; height: 327px; text-align: center; margin: 0 auto; padding: 5px 0; background: url(../images/internet-marketing.jpg) center left no-repeat; }
.showcase-right { float: right; width: 250px; }
.showcase-right-inner { padding: 50px 20px 10px 0px; text-align: left; font-size: 12px; }
.showcase-right-inner  p { margin: 0 0 8px 0; }

.content-grid { float: left; display: inline; text-align: left; }
.content-grid p { margin-bottom: 10px;}
/*Typography*/
h1 {font: 400 14px Verdana, Arial, Helvetica, sans-serif; color: #333; margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px solid #CCCCCC;}
h2 { font: 16px Verdana, Arial, Helvetica, sans-serif; color: #47AFDC; text-align: left; }
h3 { font: 16px Arial, Helvetica, sans-serif; color: #FFFFFF; }
h4 { font: 16px Verdana, Arial, Helvetica, sans-serif; color: #006699; text-align: left; }
.gray { color: #666666; }
.black { color: #000;  padding: 35px 0px 10px 30px;}
.blue { color: #006699; }
.green { color: #99AD45; }
.olive {color: #999900; }
.impact { font: 600 14px Arial, Helvetica, sans-serif; }
.white { color: #FFF; }
.d-blue { color: #003333; }
.d-green { color: #599F04; }
.font12 { font: 12px Arial, Helvetica, sans-serif; }

/*Menu*/
#menu-wrap { width: 467px; float: right; margin-top: 60px;} /* Replace margin-top value to 20px  when topmenu is enabled*/
#menu { background: url(../images/ctr.jpg) top left repeat-x; height: 57px; text-align: center; }


.lc { background: url(../images/lc.jpg) top left no-repeat; width: 20px; height: 57px; float: left; }
.rc { background: url(../images/rc.jpg) top right no-repeat; width: 20px; height: 57px; float: right; }

#menu-pr { width: 427px;  padding: 12px 0 0 0; margin: 0 auto; float: left; font: 15px Arial, Helvetica, sans-serif; }

#menu-pr ul {  list-style: none; display: block; padding: 0; margin-left: 10px; }

#menu-pr li { padding: 0 12px; position : relative; color: #FFFFFF; float: left; background: url(../images/border-mn.gif) right no-repeat; text-align: right; }

#menu-pr li:hover, #menu-pr li.sfhover {  }

#menu-pr li ul { position: absolute; left: -999em;  }

#menu-pr li ul:hover, #menu-pr li ul.sfhover { display: block; }

#menu-pr li ul li { background: #CCC;  font: 12px Arial, Helvetica, sans-serif; text-align: left; line-height: normal;  height: auto; width: 150px; padding: 0; margin-bottom: 0; display: block;}

* html #menu-pr li ul li {

display: inline;
d\isplay: block; }

#menu-pr li ul li:hover , #menu-pr li ul li.sfhover { background: #E8E8E8; }

#menu-pr li:hover ul, #menu-pr li.sfhover ul { padding: 11px 0 8px 0; margin: 0; left: 0; width: 150px; top: 100%; background: url(../images/low-sub.gif) bottom no-repeat;}

#menu-pr a:link { color: #666; text-decoration: none; display: block; }
#menu-pr a:visited { color: #666; text-decoration: none; display: block; }
#menu-pr a:hover { color: #CC6600; text-decoration: none; display: block; }

#menu-pr li ul a:link , #menu-pr li ul a:visited , #menu-pr li ul a:hover { color: #666666; text-decoration: none; display: block; padding: 5px; border-right: 1px solid #B1B1B1; border-left: 1px solid #B1B1B1;}

#menu-pr li.no-bg { background: none; padding-right: 0; }
#menu-pr li.current a:link ,#menu-pr li.current a:visited ,#menu-pr li.current a:hover { color: #007297; }

#menu-pr li.current ul a:link , #menu-pr li.current ul a:visited , #menu-pr li.current ul a:hover { color: #666666; text-decoration: none; display: block; padding: 5px; border-right: 1px solid #B1B1B1; border-left: 1px solid #B1B1B1;}

#maincontainer { width: 900px; margin: 0 auto; padding: 0;  }

#leftfloat { float: left; width: 630px; background: url(../images/curved-bt.jpg) center bottom no-repeat; margin: 0; padding: 0 0 34px 0; }
#container-lf { width: 100%; height: 100%; background: url(../images/shadow-main.jpg) top center repeat-y; }

#rightfloat { float: right; width: 270px; padding: 0; }
#right-pitch { width: 270px; display: block;}

#right-pitch a:link { color: #003366; text-decoration: none; }
#right-pitch a:visited { color: #003366; text-decoration: none; }
#right-pitch a:hover { color: #333; text-decoration: underline; }

#main-mhdr { width: 100%; height: 230px; background:url(../images/Web-Solutions.jpg) top left no-repeat; padding: 0; margin: 0; }
#mhdr-text { font: 11px Arial, Helvetica, sans-serif; color: #666; padding: 60px 35px 10px 10px; text-align: right; }
.mhdr-main { font: 14px Verdana, Arial, Helvetica, sans-serif; color: #333; margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px solid #CCCCCC; }

#main-fc { width: 593px; height: 317px; background: url(../images/fc-bg.jpg) top center no-repeat; margin: 0 auto; }

#inner-content-hdr { background: #FFFFFF url(../images/inner-content-hdr-bg.jpg) top right repeat-y; }
#inner-content { width: 100%; background:url(../images/content-top.jpg) top left no-repeat; padding: 0; margin: 0;}
#inner-content-text { font: 11px Arial, Helvetica, sans-serif; color: #666; padding: 20px 35px 10px 10px; text-align: right; }

#inner-content a:link, #inner-content a:visited { color: #006699; text-decoration: none; text-decoration: underline; }
#inner-content a:hover { color: #999900; text-decoration: none; }
#inner-content p { margin-bottom: 10px; }
.blue-list { font: 600 13px Arial, Helvetica, sans-serif; color: #99AD45; }

.pointlist { margin: 10px; }
.pointlist ul{display: block; padding-left: 14px; text-indent: -14px;}

.pointlist li{ list-style: none; margin-bottom: 10px; display: block; background: url(../images/blue-flav.gif) top left no-repeat; padding: 0 0 10px 30px; border-bottom: 1px solid #CCCCCC;}

.pointlist2 { padding: 0; font: 14px Arial, Helvetica, sans-serif; color: #006699; }
.pointlist2 ul{ display: block; padding: 50px 0 55px 14px; text-indent: -14px; border-bottom: 1px solid #CCC; background: url(../images/gray-gradient.jpg) bottom left repeat-x; }

.pointlist2 li{ list-style: none; margin-bottom: 10px; display: block; background: url(../images/arrow.gif) top left no-repeat; padding: 0 0 0 43px; text-align: left; line-height: 25px; }

li.bluenumbers-1 { background:url(../images/bluenumbers-1.gif) top left no-repeat; }
li.bluenumbers-2 { background:url(../images/bluenumbers-2.gif) top left no-repeat; }
li.bluenumbers-3 { background:url(../images/bluenumbers-3.gif) top left no-repeat; }

.side-text { margin: 30px 10px 10px 20px; }

.pointlist3 { padding: 10px 0; font: 12px Arial, Helvetica, sans-serif; color: #006699; }
.pointlist3 ul{ display: block; padding: 5px 0 0 14px; text-indent: 0px; border-bottom: 1px solid #CCC; }

.pointlist3 li{ list-style: none; margin-bottom: 10px; display: block; background: url(../images/green-flav.gif) top left no-repeat; text-align: left; line-height: 20px; padding: 0 0 0 30px; }


#footer { clear: both; width: 100%; min-width: 960px; background: #F3F3F3; text-align: center; margin: 15px auto 0 auto; }

#footer a:link, a:visited { text-decoration: none; color: #006699; }
#footer a:hover { text-decoration: underline; color: #CC6600; }


#footer-inner { width: 900px; margin: 0 auto; }
.footer-grid { float: left; display: inline; text-align: left; }

.footer-block { margin-left: 10px; padding: 10px; text-align: left; }
.footer-block p { margin-bottom: 8px; }
.footer-hd { margin: 10px 0 5px 0; color: #006699; }
.footer-hd-gray { margin: 0; color: #666666; padding-top: 3px; border-top: 1px solid #999; }

.pointlist4 { padding: 0; font: 11px Arial, Helvetica, sans-serif; color: #006699; float: left; display: inline; }
.pointlist4 ul{ display: block; padding: 10px 0 0 8px; text-indent: 0px; margin-right: 12px; }

.pointlist4 li{ list-style: none; display: block; background: url(../images/arrow-small.gif) left top no-repeat; text-align: left; line-height: 11px; padding: 0 0 0 12px; }
.pointlist4 p { margin-bottom: 5px; }

.pointlist5 { padding: 0; font: 11px Arial, Helvetica, sans-serif; color: #006699;}
.pointlist5 ul{ display: block; padding: 10px 0 0 15px; text-indent: 0px; }
.pointlist5 li{ list-style: none; margin-bottom: 8px; display: block; background: url(../images/listicon-gray.gif) top left no-repeat; text-align: left; line-height: 12px; padding-left: 15px; }

.standard-list { padding: 5px; font: 13px Arial, Helvetica, sans-serif; color: #666;}
.standard-list p { margin: 5px 0; font: 11px Arial, Helvetica, sans-serif; }
.standard-list ul{ display: block; padding: 10px 0 0 15px; text-indent: 0px; }
.standard-list li{ list-style: none; margin-bottom: 12px; display: block; text-align: left; line-height: 12px; }

.standard-list-sm { padding: 5px; font: 10px Arial, Helvetica, sans-serif; color: #666;}
.standard-list-sm  p { margin: 5px 0; font: 11px Arial, Helvetica, sans-serif; }
.standard-list-sm  ul{ display: block; padding: 10px 0 0 15px; text-indent: 0px; }
.standard-list-sm  li{ list-style: none; margin-bottom: 12px; display: block; text-align: left; line-height: 11px; }

.width250 { width: 250px; }
.width300 { width: 300px; text-align: left; }
.width270 { width: 270px; text-align: left; }
.width580 { width: 580px; text-align: left; }
.widthsm { width: 70px; text-align: left; }
li.no-border { border-bottom: none; }

#featured-title h1 { font: 500 18px Verdana, Arial, Helvetica, sans-serif; }
#featured-title h2 { font: 500 14px Verdana, Arial, Helvetica, sans-serif; }