@charset "utf-8";
/* CSS Document */

/**************************************************/
/* WebCatch Digital Styles by webcatchdigital.com */
/**************************************************/ 

*, body, html, img {
	font-size:1em;
	padding:0;
	margin:0;
}

img {border:none;}

body {
	margin: 0;
	padding:0;
	color:#4D555B;
	background-color: #fff;
	font:0.8em Arial, Helvetica, sans-serif;
	background: transparent url(../images/header-bg.png) top center repeat-x;
	text-align:center;
}

.right { float:right; }
.left { 	float:left; }
.right-image { float:right; margin-left:20px; }
.left-image { float:left; margin-right:20px; }

div.container {
  	width: 960px;
  	margin: 0 auto;
	padding: 0;
	background-color: transparent;
	text-align:left;
}

#header {
	height:106px;	
	background: transparent url(../images/header-pink.png) top center no-repeat;
}

#call {
	text-transform:uppercase;
	letter-spacing:0.1em;
	font-size:0.9em;
	color:#fff;
	float:right;
	padding-top:5px;
	margin:2px 14px 0 0;
}

#nav {
	float:right;
	margin-right:19px;
	color:#fff;
	width:460px; 
}

/* Main menu styles */
	
ul#main-menu {
	position: relative;
	height: 31px;
	width: 571px;  
	margin: 50px 0 0 0;
	overflow: hidden;
}
ul#main-menu li {
	display:inline;
	float: left;
	list-style: none;
}
ul#main-menu li a {
	background:url("../images/menu-bg.png") no-repeat top;
	display:block;
	float:left;
	font: 17px Georgia;
	text-decoration: none;
	color: #ec0d79;
	outline: none;
	text-align: center;
	letter-spacing: 0;
	height: 31px; 
	padding-top:5px;
}

ul#main-menu li a.home { background-position:0px 0; width:66px; }
ul#main-menu li a.about { background-position:-66px 0; width:65px; }
ul#main-menu li a.ecommerce { background-position:-131px 0; width:108px; }
ul#main-menu li a.webdesign { background-position:-240px 0; width:111px; }
ul#main-menu li a.portfolio { background-position:-352px 0; width:85px; }
ul#main-menu li a.blog { background-position:-438px 0; width:53px; }
ul#main-menu li a.contact { background-position:-492px 0; width:78px; }
ul#main-menu li a.home:hover, ul#main-menu li a.HomeOn { background-position:0 -31px; width:66px; }
ul#main-menu li a.about:hover, ul#main-menu li a.AboutOn { background-position:-66px -31px; width:65px; }
ul#main-menu li a.ecommerce:hover, ul#main-menu li a.EcommerceOn { background-position:-131px -31px; width:108px; }
ul#main-menu li a.webdesign:hover, ul#main-menu li a.WebdesignOn { background-position:-240px -31px; width:111px; }
ul#main-menu li a.portfolio:hover, ul#main-menu li a.PortfolioOn { background-position:-352px -31px; width:85px; }
ul#main-menu li a.blog:hover, ul#main-menu li a.BlogOn { background-position:-438px -31px; width:53px; }
ul#main-menu li a.contact:hover, ul#main-menu li a.ContactOn { background-position:-492px -31px; width:78px; }

ul#main-menu li a:hover, ul#main-menu li a.HomeOn, ul#main-menu li a.AboutOn,
ul#main-menu li a.EcommerceOn, ul#main-menu li a.WebdesignOn, ul#main-menu li a.WebdesignOn,
ul#main-menu li a.PortfolioOn, ul#main-menu li a.BlogOn,  ul#main-menu li a.ContactOn { color:#fff; } 


/* Side menu */

ul#side-menu { padding:0; margin:0 0 0 20px;  }
ul#side-menu li { 
	list-style:none;    
	margin:5px 0; 
	padding:0 10px;
	height:35px;
	line-height:35px;
}

ul#side-menu li a, ul#side-menu li a:visited  { 
	text-decoration:none; 
	color:#fff; 
	background-color:#ec0d79; 
	padding:10px; 
	text-transform:uppercase;
	font-size:0.9em;
}

ul#side-menu li a:hover, ul#side-menu li a.active  { 
	background-color:#4e4e4e!important; 
}

.phone 
{
	font-family: Georgia, "Times New Roman", Times, serif;
	float:right;
	text-align:right;
	height:40px;
	line-height:40px;
	color:#4d4d4d;
	font-size:1.1em;
	margin:30px 0px 20px 0px;
}

.phone span{
	font-size:1.6em;
	font-weight:bold;
    color:#EC0578;
}

#MooFlow
{
    clear:right;
}

.login {
	float:right;
	text-align:right;
	height:40px;
	line-height:40px;
	font-style:italic;
	color:#999;
	font-size:0.8em;
}

.login input{
	width:70px;
}


.home-h1 { 
	font: 0.25em Arial,Helvetica,sans-serif;
    line-height: 1.5em;
    margin-bottom: 12px;
	letter-spacing: 0px;
	font-weight:normal;
}

#contentWrapper{
	margin-top:10px;
}

.content {
	width:320px;
	float:left;
}

.content div {
	padding-right:10px;
}

.contentWide {
	width:640px;
	float:left;
}

.box {
	padding:10px;
	border:1px solid #dedede;
	margin:10px 20px 10px 0px;	
	height:220px;
}

.box ul {
	margin-left:20px;
}

.boxBig {
	padding:10px;
	border:1px solid #dedede;
	margin:10px 20px 10px 0px;	
	height:329px;
}

.boxBig ul {
	margin-left:20px;
}

.light-grey-top {
	background: #e2e2e2 url(../images/light-grey-bg.png) top center repeat-x;	
	padding-top:40px;
}

.light-grey-bottom {
	clear:both;
	background: transparent url(../images/light-grey-bg2.png) top center repeat-x;	
	height:31px;
}

.grey-top {
	background: #cccccc url(../images/grey-bg.png) top center repeat-x;	
	padding-top:40px;
}

.grey-bottom {
	clear:both;
	background: #e2e2e2 url(../images/grey-bg2.png) top center repeat-x;	
	height:31px;
}

.quoteForm
{
    color:#666;
    border:#666 1px solid;
    background-color:#fff;
    margin:3px 0px;
    width:170px;
    font-size:0.9em;
}

.quoteForm .cost{
	float:right;
	text-align:right;
}

.quoteForm ul {
	border-top:1px solid #DEDEDE;
	margin:10px 0;
	padding:0;
}

.quoteForm ul li {
	border-bottom:1px solid #DEDEDE;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	margin:0;
	padding:4px 0;
}

.partner-logos {
	clear: both;
    text-align: center;
}
.partner-logos img {
    margin: 15px 18px 10px;
}

#footerWrapper {
	background-color:#e2e2e2;	
}

#footer 
{
    clear:both;
    color:#888;
    font-size:0.9em;
    padding:0px 0 20px 0;
}

.footer-top
{
    border-top:2px #A5A6A8 solid;
}

.footer-images{
	float:right;
}

.footer-icon{
	margin:0 10px 10px 0;
	float:left;
}

.bloglist ul {
	border-top:1px solid #ccc;
	margin:10px 10px 10px 0px;
	padding:0;
}

.bloglist ul li {
	border-bottom:1px solid #ccc;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	margin:0;
	padding:4px 0;
}

.linkTop
{
    margin: 0px; 
    padding: 5px 10px; 
    float: right; 
    background-color: #A5A6A8; 
    display: inline;
}

.linkTop a, .linkTop a:visited, .linkTop a:hover
{
    color:#fff !important;
    text-decoration:none !important;
}

.thumbnails {
	width:260px;
	margin:0 auto;
	text-align:center;
}

.thumbnails div {
	clear:both;
}

.thumbnails a:link img, .thumbnails a:visited img {
	border:1px solid #DEDEDE;
	margin:0 10px 10px 0;
	padding:5px;
	text-decoration:none;
}

.thumbnails a:hover img {
	border:6px solid #EC0578;
	padding:0;
	text-decoration:none;
}

.thumbnails span {
	clear:both;
}

.features {
	/*width:260px;*/
	margin:0 auto;
}

ul.features {
	border-top:1px solid #efefef;
	margin:10px 20px;
	padding:0;
}

ul.features li {
	border-bottom:1px solid #efefef;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	margin:0;
	padding:4px 0;
}

ul.features li a {
	background-image:url(../images/arrow.jpg);
	background-position:8px 8px;
	background-repeat:no-repeat;
	padding:6px 6px 6px 22px;
	text-decoration:none;
}

.features2 {
	width:300px;
	margin:0 auto;
}

.features2 div {
	clear:both;
	height:145px;
}

.features2 div img {
	float:left;
	margin-right:10px;	
}

#casestudy {
	float:right;
	width:600px;
	text-align:right;	
	top:8px;
	position:relative;
}

#casestudy a, #casestudy a:visited {
	color:#fff;
	border-bottom:#fff 1px solid;
	text-decoration:none;

}

#caseImg{
	z-index:1;
	margin-top:5px;
	
}

#caseQuote{
	z-index: 99;
	position:absolute;
	top:230px;
	right:363px;
	width:550px;
}

.quote {
	background-color:#EC0578;
	color:#FFFFFF;
	line-height:1.7em;
	padding:3px;
	font-size:1.1em;
}

.quoteName {
	color:#4e4e4e;
	line-height:1.5em;
	text-transform:uppercase;
	letter-spacing:0.1em;
	margin-top:5px;
	font-size:0.8em;
}

.quoteName a, .quoteName a:visited {
	color:#4e4e4e;
	text-decoration:underline;
}

.quoteName a:hover {
	color:#4e4e4e;
	text-decoration:none;
}


ul#fade { margin:0; padding:0; list-style:none; }
ul#fade li { position:relative; }
ul#fade .text { position:absolute; top:20px; left:20px; width:400px; }

.ecom h2
{
	text-align:center;
	color:#EC0578;
}

.ecom h4
{
	color:#434343;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size:1.3em;
	font-weight:normal;
	line-height:1.2em;
	margin:0 0 15px !important;
}

.ecom {
    float:left;
    width:300px;
	margin-right:20px;
}

.ecom div img
{
    float:left;
    margin-right:10px;
}

.ecom div
{
    height:170px;
    font-size:0.9em;
    clear:both;
}

#case-img
{
    float:left;
    display:inline;
    margin-left:50px;
}

#thumbnails
{
    float:left;
    display:inline;
}

#thumbnails div
{
    float:left;
    padding: 20px 20px 0px 0px;
    display:inline;
    width:165px;
}

#thumbnails div.last
{
    float:left;
    padding: 20px 0px 0px 0px;
    display:inline;
    width:155px;
}

#thumbnails div h2
{
    font: normal 20px/18px Georgia;
    text-align:left;
}

#thumbnails h3
{
    text-transform:uppercase;
    font-family:Georgia;
    font-weight:normal;
    font-size:1em;
}

#thumbnails div p
{
    font: normal 13px/18px Arial, Helvetica, sans-serif;
    text-align:left;
    color:#333;
}

#thumbnails div p.more
{
    font: normal 13px/18px Georgia;
    text-align:right;
    color:#333;
    padding-right:10px;
}

#thumbnails a:link img, #thumbnails a:visited img {
border:1px solid #DEDEDE;
margin:0 10px 10px 0;
padding:5px;
text-decoration:none;
}

#thumbnails a:hover img {
border:6px solid #EC0578;
padding:0;
text-decoration:none;
}

#links
{
    float:left;
    display:inline;
    margin-left:50px; 
    margin-top:50px;  
}

#links div {
	width:405px;
	height:50px;
	line-height:50px;
	background: transparent url('../images/link_bg.png') top left no-repeat;
	overflow:hidden;
	text-align:center;
	margin-bottom:8px;
}

#links div a, #links div a:visited {
    font-size:1.1em;
    color:#E6E6E6;
    font-family: Arial;
    text-decoration:none;
    font-style:normal;
}
#links div a:hover {
    text-decoration:underline;
}

#about {
	padding: 10px 0 20px 0px;
	clear: both;
	float:left;
	display:inline;
	width:500px;
	color:#333;
	font: normal 14px/16px Arial, Helvetica, sans-serif;
}

#partners
{
    float:left;
    display:inline;
    margin-left:50px;   
}

#partners div
{
    float:left;
    padding: 10px 0px 15px 0px;
    display:inline;
    width:195px;
}

#partners a:link img, #partners a:visited img {
    border:1px solid #DEDEDE;
    margin:0 10px 10px 0;
    padding:20px;
    text-decoration:none;
}

#partners a:hover img {
    border:6px solid #EC0578;
    padding:15px;
    text-decoration:none;
}

.social-buttons {
	text-align:center;
	margin-right:20px;	
}

.social-buttons img {
	margin:0px 5px 10px 5px;	
}

#twitter_div
{
    /*padding:10px 20px;*/
}

#twitter_div a:link, 
#twitter_div a:visited, 
#twitter_div a:hover
{
    color:#333;
}

#twitter_update_list
{
    list-style:none;
    margin:0;
    padding:0;
}

#twitter_update_list li span
{
    margin:0;
    padding:0;
    text-indent:0;
    font-size:inherit;
}


.clr {
	margin: 0 !important;
	padding: 0 !important;
	display: block !important;
	clear: both !important;
	float: none !important;
}


.hidden {
	display : none;
	font-size: 1px;
	color: #000;
	line-height: 1px;
}


/* Content Pages */

h1.tagline, h1.tagline-webdesign { font-size:5.5em; padding-bottom:0.2em; border-bottom:1px solid #cccccc; display:block; margin-bottom:20px; }
h1.tagline .more, h1.tagline-webdesign .more { font-size:0.3em; font-weight:normal; }

h1.tagline a, h1.tagline-webdesign a { text-decoration:none; color:#4e4e4e; }
h1.tagline a .more, h1.tagline-webdesign a .more { text-decoration:none; color:#EC0578; }

h1.tagline-webdesign { background: #fff url('../images/computer.jpg') bottom right no-repeat; }

.quote-right {
	float:right;
	border-top: 1px solid #000;
	border-bottom:1px solid #000;	
	font: 1.8em Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	color:#212121;
	margin: 10px 10px 20px 20px;
	padding: 20px 5px;
	width:240px;
} 

.image-caption-left { width:300px; margin:0 30px 10px 0; float:left; }
.image-caption-right { width:300px; margin:0 0 10px 30px; float:right; }
.image-caption-left span, .image-caption-right span {
	font-style:italic;
	text-align:left;
	color:#666666;
	border-bottom:1px solid #000;
	width:300px;
	padding: 10px 0px;	
	display:block;	
	font: italic 0.9em Georgia, "Times New Roman", Times, serif;	
}

/* Projects - Portfolio Page */

.project {
	margin:0 auto; 
	width:280px;
	font-size:0.9em;
	background: transparent url('../images/stripe.png') top left repeat;
	padding:10px 10px 40px 10px;
	position:relative;
}
.project a:link, .project a:visited { text-decoration:none; margin-bottom:10px; display:block; }
.project a:hover { text-decoration:none; }

.project a .client, .project a .desc { display:block; padding:10px 10px 0 10px; background-color:#fff; }
.project a .client {color:#ec0d79; font-family: Georgia, "Times New Roman", Times, serif; font-size:1.5em; line-height:1.3em; }
.project a .desc { color:#4D555B; font-size:1em; line-height:1.5em; padding-bottom:10px; }

.project a .links {
	color:#4e4e4e;
	line-height:1.5em;
	text-transform:uppercase;
	letter-spacing:0.1em;
	font-size:0.9em;
	background-color:#ec0d79;
	color:#fff;
	padding:5px 10px;
	position:absolute;
	margin-bottom:15px;
	bottom:0;
}

.project a:hover .client, .project a:hover .desc { background-color:#ec0d79; color:#fff; }

.portfolio-ecommerce { background: transparent url('../images/portfolio/portfolio-ecommerce.png') top center no-repeat; height:195px; }
.portfolio-webdesign{ background: transparent url('../images/portfolio/portfolio-webdesign.png') top center no-repeat; height:195px; }
.portfolio-webdev { background: transparent url('../images/portfolio/portfolio-webdev.png') top center no-repeat; height:195px; }

.portfolio-ecommerce a:link, .portfolio-webdesign a:link, .portfolio-webdev a:link,
.portfolio-ecommerce a:visited, .portfolio-webdesign a:visited, .portfolio-webdev a:visited{ text-decoration:none; }
.portfolio-ecommerce a:hover, .portfolio-webdesign a:hover, .portfolio-webdev a:hover{ text-decoration:none; }

.portfolio-ecommerce a .h2, .portfolio-webdesign a .h2, .portfolio-webdev a .h2 {
	font-size:2.6em;
	line-height:1em;
	padding:20px 30px 0;
	color:#ec0d79;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	margin:0 0 15px !important;
	text-decoration:none!important;
	display:block;
}

.portfolio-ecommerce a .p, .portfolio-webdesign a .p, .portfolio-webdev a .p { 	padding:0 30px 0; display:block; color:#4D555B; }
.portfolio-ecommerce a .view, .portfolio-webdesign a .view, .portfolio-webdev a .view {	text-indent:-9999px; display:block; padding:15px; }

.portfolio-ecommerce-head { background: transparent url('../images/portfolio/portfolio-ecommerce-head.png') top center no-repeat; height:60px; width:960px; }
.portfolio-webdesign-head{ background: transparent url('../images/portfolio/portfolio-webdesign-head.png') top center no-repeat; height:60px; width:960px; }
.portfolio-webdev-head { background: transparent url('../images/portfolio/portfolio-webdev-head.png') top center no-repeat; height:60px; width:960px; }

.portfolio-ecommerce-head h2, .portfolio-webdesign-head h2, .portfolio-webdev-head h2 {
	line-height:58px;
	padding:0 30px;
	font-size:1.8em;
}

.portfolio-divider { 
	height:8px; 
	border-top:1px solid #dedede;
	border-bottom:1px solid #dedede;
	margin:12px 0;
}

/***********************************************/
/* Text styles                                 */
/***********************************************/ 

div, li, ul, ol, h1, h2, h3, h4, h5, h6, img, a {
	margin: 0;
	padding: 0;
	border: 0;
	outline: none;
}

h1 {
	color:#4d4d4d;
	font-size:3.8em;
	line-height:1.1em;
	margin:0 0 10px;
	letter-spacing:-1px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight:lighter;	
}

h2.header {
	color:#4d4d4d;
	font-size:3.5em;
	line-height:1.1em;
	margin:0 0 10px;
	letter-spacing:-1px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight:lighter;	
}

h2 {
	color:#ec0d79;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size:1.5em;
	font-weight:normal;
	line-height:1.3em;
	margin:0 0 15px !important;
}

h3 {
	color:#333;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size:1.2em;
	font-weight:normal;
	line-height:1.3em;
	margin:0 0 15px !important;
}

p {
	line-height:1.5em;
	font-size:1em;
	margin-bottom:12px;
}

ul {line-height:1.5em;margin:0 0 15px 20px;}

.white{color:#fff}
.header{color:#a8b7bf;font-weight:bold}

.pink{color:#d82790;}
.price {float:left; width:130px;}
.price h2 {text-align:left;font: normal 28px/30px Arial, Helvetica, sans-serif;}
.priceImg {float:left;margin:0 30px;}
.small {font-size:0.8em;}
.quote {line-height:1.7em; background-color:#EC0578; color:#fff; padding:3px;}
acronym{border-bottom: 1px dotted;}
.more a, .more a:visited {text-transform:uppercase; text-decoration:none;font-size:0.9em;}
.more a:hover{text-decoration:underline;} 

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}
/***********************************************/
/* Link styles                               */
/***********************************************/ 

a:link, a:visited, a:hover 
{
    color: #EC0578;
	text-decoration: underline;
}
a:hover {
	text-decoration: none;
}

a.inv:link, a.inv:visited, a.inv:hover 
{
    color: #EC0578;
	text-decoration: none;
}
a.inv:hover {
	text-decoration: underline;
}

a.white:link, a.white:visited, a.white:hover {
	color: #fff;
	text-decoration: underline;
}

a.white:hover {
	text-decoration: none;
}

a.whiteIn:link, a.whiteIn:visited, a.whiteIn:hover {
	color: #fff;
	text-decoration: none;
}

a.whiteIn:hover {
	text-decoration: underline;
}



