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

a:link    {color: #006699; text-decoration: none;}
a:visited {color: #006699; text-decoration: none;}
a:hover   {color: #0000FF; text-decoration: underline;}
a:active  {color: #006699; text-decoration: none;}



a.external
{
    margin-left:3px;
    padding-left:13px;
    color: #000000;
    text-decoration:none;
    border-bottom:1px dotted #000000;
    background-image:  url(../images/41.gif);
    background-repeat: no-repeat;
    background-position: 0 2px ; 
outline: none;
}

a:link.external, a:visited.external 
{
    color: #000000;
    text-decoration:none;
    border-bottom:1px dotted #000000;
    background-image:  url(../images/41.gif);
    background-repeat: no-repeat;
    background-position: 0 2px ; 
}

a:hover.external 
{
    color: #0000FF;
    text-decoration: none;
    border-bottom:1px dotted #0000FF;
    background-image:  url(../images/40.gif);
    background-repeat: no-repeat;
    background-position: 0 2px; 
}

a:active.external 
{color: #000000; text-decoration: none;}

.title-link a:link, .title-link a:visited {
    color:#656F7B;
}

.title-link a:hover {
    color:#464646;
    text-decoration:none;
}

/* Container
------------------------------------------------ */


body
{
     padding:0px;
     margin:0px;
     background: #393939;
     background-image: url("../images/32.jpg");
     background-repeat: repeat-x;
     text-align: center; 
}


#all
{
	position: relative;
	margin: 20px auto 20px auto;
	width: 779px;
	border: 0px none;
}



#main
{       
    width:767px ;
    margin: 0 auto;
    padding:6px;
    text-align:left;
    background:#fff;
}


/* Header
------------------------------------------------ */

#header
{
    float:left;
    width:767px ;
    margin: 0 auto;
    padding:6px 0px 6px 0px;
    text-align:left;
    background-image: url("../images/44.jpg");
    background-color:#EAEAEA;
    background-position:bottom left;
    background-repeat: repeat-x;
}



/* Footer
------------------------------------------------ */
.footer 
{

        float: left;
	clear: both;
	width: 767px;
        height: auto;
	margin: 0px 0px 0px 0px;
	padding: 6px 0px 6px 8px;
        font: normal 90% Verdana, Arial, Helvetica, sans-serif;
	line-height:1.6em;
        color: #FFFFFF;
        text-decoration: none;
}

.footer a  {color: #F0F0F0; text-decoration: underline;}
.footer a:link  {color: #F0F0F0; text-decoration: underline;}
.footer a:visited  {color: #F0F0F0; text-decoration: underline;}
.footer a:hover  {color: #FFFFFF; text-decoration: underline;}
.footer a:active  {color: #F0F0F0; text-decoration: underline;}

/* Layout
------------------------------------------------ */

.content-float-rigid
{
	height: auto;
	float: right;
	width:766px;
	padding: 0px;
   	margin: 0px;
}

.first-float-rigid
{
        height: auto;
        float: left;
	width: 1px;
	padding: 0px;
        margin: 0px;	
}

.second-float-rigid
{
        height: auto;
        float: left;
	width: 500px;
	padding: 0px;
	margin: 6px 0 0 0 ;
}

.third-float-rigid
{
        height: auto;
        float: right;
	width: 260px;
	padding: 0px;
	margin: 6px 0 0 0 ;
}



.gradient
{
   	background-image: url("../images/46.jpg");
   	background-repeat: repeat-x;
}

.plain
{
  	background-color: #E4E4E4;
   	background-image: url("");
   	background-repeat: repeat-x;
}


#lhscontainer
{
	width: auto;
	position: relative;
	font: normal 100% Verdana, Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 0px;
	text-align: left;
  	color: #444444;
}

#maincontainer
{
	height: auto;
	font: normal 100% Verdana, Arial, Helvetica, sans-serif;
  	color: #161616;
	position: relative;
    padding:16px;
	margin:0;
     
}

#landingcontainer
{
	height: auto;
	font: normal 100% Verdana, Arial, Helvetica, sans-serif;
  	color: #161616;
	position: relative;
    padding:8px;
	margin:0;
     
}

#rhscontainer
{
	width: auto;
	position: relative;
	font: normal 100% Verdana, Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 16px;
	text-align: left;
  	color: #444444;
}

#rhscontainer h3 a {color: #656F7B;}
#rhscontainer h3 a:visited {color: #656F7B; text-decoration: none;}
#rhscontainer h3 a:hover   {color: #464646; text-decoration: none;}
#rhscontainer h3 a:active  {color: #656F7B; text-decoration: none;}

/* BLOG & RELATED
------------------------------------------------ */
#blog-home {width:100%;height:auto;}

#blog h1 {color:#393939;font-size:40px;font-weight:bold;letter-spacing:-2px;}
#blog-home h2 {color:#393939;font-size:40px;font-weight:bold;letter-spacing:-2px;}

.blog-home-main-container {width:100%;height:auto;background:#fdfdfd;padding:0 5px 15px 10px;position:relative;}

.blog-home-main-article {width:492px;height:auto;color:#424242;border-right:1px solid #f1f1f1;float:left;padding:0 5px 0 0;}

.blog-home-date {width:94px;height:62px;position:absolute;top:0px;left:-44px;background:url(../images/252.png) no-repeat;font-family:"Lucida Sans Unicode", "Lucida Grande", Trebuchet MS, Arial, Helvetica, sans-serif;color:#fff;text-align:center;font-size:16px;padding:3px 0 0 0;line-height:16px;}

.blog-home-title h3, .blog h3
{padding:0 0 0 65px;font-family:"Lucida Sans Unicode", "Lucida Grande", Trebuchet MS, Arial, Helvetica, sans-serif;font-size:24px;color:#1375ac;margin:0;}

.blog-home-thumbnail {float:left;margin:0 10px 10px 0;}
div.blog-home-thumbnail img {border:5px solid #e8e8e8;}

#blog-home a:link, #blog a:link, #blog-home a:visited, #blog a:visited {color:#1375ac;font-weight:bold;}
#blog-home a:hover, #blog a:hover, #blog a:active, #blog-home a:active {color:#1a90d2;font-weight:bold;text-decoration:none;}

#blog-home-sidebar {float:left;padding:0 0 0 10px;width:245px;}
#blog-home-sidebar h4 {font-weight:bold;color:#393939;font-size:18px;width:150px;border-bottom:1px solid #f1f1f1;width:235px;padding:0 0 5px 0;margin:0;}

#blog-home-sidebar ul {list-style:none;margin:0;padding:0;}
#blog-home-sidebar ul li {list-style:none;margin:0;padding:5px 0;}

#blog-home-tag-cloud {line-height:1.3em;text-align:center;}
#blog-home-tag-cloud h4 {text-align:left;}


#blog {
        height: auto;
        float: left;
	width: 500px;
	padding: 0px;
	margin: 6px 0 0 0 ;
}


.blog-tags {padding:3px 0 4px 10px;background:#ececec;}
div.author {padding:7px 0 0 10px;color:#999;font-family:Georgia, Times New Roman, Times, Serif;font-style:italic;}


/* Navigation & Lists
------------------------------------------------ */


#navMain
{
    height: 34px;
    width:767px;
    position: relative;
margin: 0px;
    padding: 0;
}


#navMain ul
{
width: 767px;
height: auto;
padding: 0;
margin-left: 0px;
display: block;
}

#navMain ul li
{
width: auto;
height: auto;
list-style-type: none;
padding: 6px 12px 0px 40px;
margin: 0px;
display: block;
float: left;
font: 140% Arial, Helvetica, "Lucida Grande", verdana, sans-serif;
text-align: right;
}

#navMain a
{
color: #F0F0F0;
text-decoration: none;
display: block;
width: auto;
height: auto;
margin: 0px;
padding: 0px;
outline:none;
line-height:1.4em;
}

#navMain a:hover {color: #00BEF2;}
#navMain li a.active {color: #00BEF2; }
#navMain a:active {color: #00BEF2;}



.articlelist
{ 	
    width: auto;
    height: auto;
    padding: 1px 0px 8px 6px; 
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 110%;
    line-height: 1.2em;
}

.articlelist ul
{
     margin: 0;
     padding: 0px;
     list-style-type: none;
     text-decoration: none; 
}

.articlelist li
{
     margin: 2px 0 4px 0;
     padding: 0px;
     list-style-type: none;
}

.articlelist a
{
     padding: 0px;
     width: auto;
     text-decoration: none;
     border:none;
outline: none;
}


.articlelist a:link{ color: #444444; text-decoration: none; }
.articlelist a:visited { color: #444444; }
.articlelist a:hover { color:  #00BEF2;  }
.articlelist a:active { color: #00BEF2;  }
.articlelist li a.active { color: #00BEF2;}



#navFooter 
{
    height: 32px;
    width: 667px;
    position: relative;
margin: 0px auto 0px auto;
}


#navFooter ul
{
width: 667px;
height: auto;
padding: 0px ;
margin: 0px auto 0px auto;
display: block;
font: 110% "Lucida Grande", Helvetica, Arial, sans-serif;
}

#navFooter ul li
{
width: auto;
height: 15px;
list-style-type: none;
padding: 0px;
margin: 0px 0px 0px 8px;
display: block;
float: left;
text-align: left;
}

#navFooter a
{
color: #fff;
text-decoration: none;
display: block;
width: auto;
height: auto;
margin: 0px;
padding: 0px;

}

#navFooter a:hover {color: #0000FF;}
#navFooter li a.active {color: #fff; }
#navFooter a:active {color: #fff;}

.carousel-noscript {
   width:150px;
   height:135px;
   float:left;
   list-style-type:none;
   margin:2px;
   padding:5px;
   text-align:center;
}
div.carouselItemContainer {display:none;}

img.projectFeatureImage {border:5px solid #ccc;margin:10px 10px 10px 0;}
img.featureLeft {float:left;margin-left:0;}
img.featureRight {float:right;margin-right:0;margin-left:10px;}

/* Panels
---------------------------------------------------------------- */
.panel
{
        height: auto;
        float: right;
	width: 228px;
	padding: 16px;
	margin: 6px 0 0 0 ;
}


.project-listing
{
	width: 470px;
	padding: 0px;
        padding: 16px 0px 16px 0px;	
        clear:both;
}


.project-listing-image
{
        height: auto;
        float: left;
	width: 133px;
	padding: 0px;
        margin: 0px 0px 0px 6px;	
}

.project-listing-image img
{
        border:1px solid #656F7B;
}


.project-listing-excerpt
{
        height: auto;
        float: left;
	width: 330px;
	padding: 0px;
        margin: 0px;	
}

.article-image img {
    margin:20px 0 10px 0;
}

#landing-content, #landing-contact, #landing-carousel
{
	width: auto;

	margin: 0px;
	padding: 16px;
	text-align: left;
  	color: #444444;
}

#tailored-business-websites.landing-panel 
{
   	background-image: url("../images/203.jpg");
   	background-repeat: repeat-x;
        background-position: top right;
}

#ecommerce-solutions.landing-panel 
{
   	background-image: url("../images/205.jpg");
   	background-repeat: repeat-x;
        background-position: top right;
}

#bespoke-development-work.landing-panel 
{
   	background-image: url("../images/208.jpg");
   	background-repeat: repeat-x;
        background-position: 100% 0px;
}

#custom-wordpress-blogs.landing-panel 
{
   	background-image: url("../images/207.jpg");
   	background-repeat: repeat-x;
        background-position: top right;
}

#email-marketing-newsletter-design.landing-panel 
{
   	background-image: url("../images/209.jpg");
   	background-repeat: repeat-x;
        background-position: top right;
}



.landing-panel
{
        height: auto;
	width: auto;
	padding: 0px;
	margin: 0 ;
  	background-color: #fff;
}


.landing-panel-title h1
{ 
        font-size: 210%;
        color:#161616;
	padding: 0px;
	margin: 0 ;
}

#landing-contact h2, #landing-carousel h2
{ 
        font-size: 160%;
        color:#161616;
}


.landing-panel-title p
{
	font-style: italic;
        font-size: 110%;
        height: auto;
	width: auto;
	padding: 0;
	margin: 0 0 0 36px ;
}

.landing-panel-details
{
        float:left;
        height: auto;
	width: 350px;
	padding: 0px;
	margin: 0 ;
}

.landing-panel-button
{ 
        float:right;
        height: auto;
	width: 86px;
	padding: 0;
	margin: 97px 0 0 0 ;
}

.landing-panel-details ul
{
     margin:12px 0 0 18px;
     padding:0px;
     list-style-type: none;
     text-decoration: none; 
}

.landing-panel-details li
{
     margin: 0px;
     padding: 0px;
     list-style-type: none;
     display: block;
     padding: 0px 2px 6px 24px;
     text-decoration: none; 
     border:0;
     background-position: 2px 0px;
     background-repeat: no-repeat;	
     background-image: url(../images/204.gif);
     font: normal 130% Verdana, Arial, Helvetica, sans-serif;
}

div#homeSlider {
  width:767px;
  height:250px;
  background:url(../images/234.jpg) repeat-x;
  position:relative;
  overflow:hidden;
}
div#homeSliderTitle {
  width:757px;
  padding:4px 0 4px 10px;
  background:#0472c7;
  color:#fff;
}
div.boxgrid {
  width:767px;
  height:250px;
  float:left; 
  position: absolute;
  overflow:hidden;
}
.boxgrid img { 
  position: absolute;
  top: 0; 
  left: 0; 
  border: 0; 
}
div.show {
  z-index:500;
}
.boxcaption { 
  float: right; 
  position: absolute;
  right:0px;
  background: #000; 
  height: 250px; 
  width: 390px; 
  opacity: .8; 
/* For IE 5-7 */
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
/* For IE 8 */
  -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}
.captionfull .boxcaption {
  top: 0;
  right: -349px;
}
.caption .boxcaption {
  top: 0;
  right: 0;
}
div.captionArrows {
  float:left;
  width:36px;
  padding:8px 0 0 4px;
  height:242px;
  color:#fff;
  font-size:1.8em;
}
.boxcaption div.captionExcerpt {
  float:left;
  width:350px;
  height:250px;
  color:#fff;
  font-family:Arial, Helvetica, Verdana, sans-serif;
}
div.captionExcerpt h3 {
  color:#02bdf2;
  font-weight:bold;
  font-size:30px;
}
div.captionExcerpt p {
  font-weight:bold;
  font-size:18px;
  padding:0 10px 0 0;
}
div.featureButton {float:right;margin:0 10px 0 0;}
div.featureButton img {position:static;}

/* Headers and Paragraphs:
---------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6
{
     line-height: 1.1em;
     padding-bottom: 0px;
font-family: Helvetica, Arial, verdana, sans-serif;
}


h1 { font-size: 180%; font-weight: normal; color: #656F7B; }
h2 { font-size: 150%; font-weight: normal; color: #656F7B; }
h3 { font-size: 160%; font-weight: normal; color: #656F7B; }
h4 { font-size: 130%; font-weight: normal; color: #444444; }
h5 { font-size: 110%; font-weight: bold; color: #444444; }
h6 { font-size: 110%; font-weight: bold; color: #000000; }

h1, h2, h3, h4, h5, h6, pre,
blockquote, ul, ol, dl, address
{
     margin:  .2em 0;
     padding: 0;
}

p
{
     line-height: 1.4em;
     margin: 0;
     padding-bottom: 10px;
}

/* Apply Left Margin:
---------------------------------------------------------------- */
ul, li, dd, blockquote
{
     margin-left: 1.6em;
}

ul
{
     padding-bottom: 1em;
}

ul ul
{
     padding-bottom: 0.5em;
}

li
{
     padding-bottom: .2em;
}

blockquote
{
     background:#F0F0F0;
     color:#444444;
     font-size: 110%;
     padding: 4px 12px 4px 12px;
     margin-right:1.3em;
     margin-bottom:1em;
}



/* Neutralize styling:
   Elements we want to clean out entirely
   and we reset the base font-size to 10px
---------------------------------------------------------------- */
html, body, form, fieldset
{
     margin: 0;
     padding: 0;
     font: normal 100.01%/1.1em "Lucida Grande", Verdana, "Lucida Sans Unicode", sans-serif;
}

html { font-size: 65%; } /* 1em = 10px */
html { font-size: 70%; } /* override it ... go bigger */




/* Miscellaneous Conveniences
---------------------------------------------------------------- */
form label {cursor: pointer;}
fieldset {border: none;}

.clear { clear: both; line-height: 1px; font-size: 1px; height: 1px; visibility: hidden; }

textarea
{ font: normal 110% Arial, Verdana, Helvetica, sans-serif;}

/* Form Styles
---------------------------------------------------------------- */

#offer-booking-form, #offer-booking-form-noscript
{
border: 1px solid #7FB41E;background:#ffffff;padding:12px;width:auto:height:auto;margin-top:12px;
}

form fieldset.contact
{
	width: 480px;
	height: auto;
	padding: 12px ;
	margin: 12px 0px 12px 0px;
	border: 1px solid #CCCCCC;
}

.form-container { width: auto;float:left;height: auto; margin: 0; padding: 0;}

.form-row {clear:both; margin:0px; padding: 4px 0px 4px 0px; ; text-align:left;}

input, input.zemRequired, input.zemRequirederrorElement  {float:left;margin: 0;padding:2px;}

label, label.zemRequired, label.zemRequirederrorElement  {font-weight:bold;width:150px;float:left;font-size: 100%;}

label.zemRequired, label.zemRequirederrorElement  
{font-weight:bold;}
label 
{font-weight:normal;}

label.Address2{color:#fff;}

label.zemCheckbox
{margin-left:8px;width:200px;margin-top:-2px;}

input.zemCheckbox
{margin-bottom:-2px;}

textarea.zemRequired {font-size: 110%;padding:2px;}


#newsletter-signup label, #newsletter-signup input {float:none;}

#zemContactForm fieldset {border: 0;}

.zemError 
{
	font: normal 90% Verdana, Arial, Helvetica, sans-serif;
	padding: 6px 0 12px 0;
	margin: 0px;
	width: auto;
}


.zemError li
{
	padding: 0 0 5px 0;
	list-style: none;
	margin: 0px;
	color: #FF0000;
}


/* Images / Graphics
------------------------------------------------ */

img {border:none;}

.hr {height: 1px; width: auto;background-image: url('../images/dash.gif'); background-repeat: repeat-x;}
.image-right { float: right;height: auto;width: auto;position: relative; margin: 12px 0 6px 8px; border:none;}
.image-left {float: left;height: auto;width: auto; position: relative;margin: 12px 12px 6px 0; border:none;}


.gallery-thumb {float: left; height: auto;width:auto; position: relative;text-align: center;font-size: 90%; margin: 12px 12px 6px 12px;}
.gallery-thumb img { position: relative;padding:4px;margin: 0px;border:1px solid #DFDFDF;background:#FFF;}
.gallery-thumb a { border:none;outline: none;}
.gallery-thumb img:hover {border:1px solid #666666;}

.rssThumbFloat {float: left; height: 100px;width:85px;position: relative;text-align: center;font-size: 90%; margin: 0px 0px 0px 8px;}
.rssThumbFloat img {position: relative;   padding:4px; margin: 0px;border:1px solid #DFDFDF;background:#FFF;}
.rssThumbFloat a{border:none;outline: none;}
.rssThumbFloat span {width:85px; float:left;font-size: 70%;text-align: center;}
.rssThumbFloat img:hover {border:1px solid #666666;}



.caption {float: left; height: auto;width:125px; position: relative;text-align: left;margin-top:3px;}

/* Pagination
------------------------------------------------ */

#pagination
{
	width:auto;
	height:auto;
	margin: 0px ;
	padding: 0px;
	position: relative;
}


.pagination ul
{
	margin-left: 0px;
	padding: 0px;
	list-style-type: none;
	text-decoration: none;
}

.pagination li
{

	margin:  5px 5px 0px 0px;
	list-style-type: none;
	display: block;
	float: left;
        border: 1px solid #CECECE;
        padding:3px;
	width: 10px;
	height: 10px;
	color: #666666;
        font: normal 90%  Arial, Helvetica, Verdana, sans-serif;
        line-height:1em;
        text-align:center;
background-color:#FFFFFF;
}

.pagination a
{
	text-decoration: none; 
	width: 10px;
	height: 10px;
outline: none;
}

.pagination li a:link, .pagination a:visited { color: #666666; text-decoration: none;outline: none;border:none}

.pagination li:hover {color: #000000; text-decoration: none;border: 1px solid #666666;}

.pagination li:hover.inactive {color: #FFFFFF; text-decoration: none;border: 1px solid #CECECE;}

.pagination  li:active{ width: 10px; height: 10px; padding:3px;color: #FFFFFF; text-decoration: none;font-weight:bold;background:#CECECE;}
.pagination  li.active{	width: 10px; height: 10px; padding:3px;color: #FFFFFF; text-decoration: none;font-weight:bold;background:#CECECE;}

div#no-css-nav {display:none;}