@charset "utf-8";

/* Body and change styles
----------------------------------------------------------------------*/

body {
	background:#000;
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
}

/* Main Structure Styles
----------------------------------------------------------------------*/

.navigation {
	background:url('../images/structure-backgrounds/dropdown-bg.png') repeat;	
}

.quick-links {
	background:url('../images/structure-backgrounds/quick-links-bg.png') repeat;
	border-top:1px solid #222;
	font-size:11px;
}

.footer-bar {
	background:#252525;
	font-size:12px;
	line-height:30px;
	text-transform:lowercase;
}

.content {
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background:url('../images/structure-backgrounds/content-bg.png') repeat;
}

.quick-link-box {
	background:url('../images/structure-backgrounds/quick-links-box-bg.png') right repeat-y;
}

/* Generic Styles
----------------------------------------------------------------------*/

strong {
	font-weight:bold;
}

h1 {
	font-size:25px;
	line-height:120%;
	margin:10px 0;
}

h2{
	font-size:16px;
	line-height:120%;
	margin:10px 0;

}

h3 {
	font-size:16px;
	line-height:120%;
	margin:10px 0;
}

h5 {
	display: inline;
	padding-right: 5px;
	}

p {
	font-size:12px;
	line-height:150%;
	margin:10px 0;
	text-align:justify;
}

p:first-child {
	margin-top:0;
}

a:link, a:visited, a:active {
	color:#FFF;
	text-decoration:none;
}

a:hover, a:focus {
	color:#5EBEFF;
	text-decoration:underline;
}

li {
	font-size:12px;
	line-height:120%;
}

/* Navigation Styles
----------------------------------------------------------------------*/

.navigation ul {
	margin: 0;
}

.navigation ul li {
	float:left;
	margin-right:30px;
	font-size:18px;
}

.navigation ul li a:link, .navigation ul li a:active {
	display:block;
	padding:11px 0 11px;
}

.navigation ul li a:visited, .navigation ul li a:active {
	display:block;
	padding:11px 0 11px;
}

.navigation ul li a:hover, .navigation ul li a:focus {
	text-decoration:none;
	color:#5EBEFF;
}

.navigation li.dropdown ul  { 
	display: none; 
	position:absolute;
	background:url('../images/structure-backgrounds/dropdown-bg.png');
}

.navigation li.dropdown ul#wwd  { 
	left:0;
	width:940px;	
}

.navigation li.dropdown ul#wwd li { 
	display: inline; 
	float:left;
	width:111px;
	font-size:12px;
	font-weight:normal;
	margin-left:10px;
	margin-right:10px;
	margin-bottom:20px;
	margin-top:10px;
}

.navigation li.dropdown ul#wwd li p {
	text-align:left;
	line-height:120%;
}

.navigation li.dropdown ul#wwd li:first-child { 
	margin-left:20px;
}

.navigation li.dropdown ul#wwd li:last-child { 
	margin-right:20px;
}

.navigation li.dropdown ul#wwa li { 
	float:none;
	display: block; 
	font-size:14px;
	font-weight:normal;
	margin-left:20px;
	margin-right:20px;
	margin-bottom:5px;
	margin-top:5px;
}

.navigation li.dropdown ul#wwa li:first-child { 
	margin-top:10px;
}

.navigation li.dropdown ul#wwa li:last-child { 
	margin-bottom:10px;
}

/*.navigation li.dropdown:hover ul { display: block; }*/

/* Background Switcher */

#toolbox, #access {
	float:right;
	display:block;
	right:0;
	padding:14px 40px 14px 20px;;
	border-right:1px solid #333;
	border-left:1px solid #333;
	font-size:12px;
	margin-left:20px;
	cursor:pointer;
	background:url(../images/tool-box/tool-box-arrow.png) top right no-repeat;
}

#toolbox.active {
	background-position:bottom right;
	color:#5EBEFF;
}

#toolbox-panel {
	display:none;
	position:absolute;
	left:0;
	top:40px;
	width:940px;
	background:url('../images/structure-backgrounds/dropdown-bg.png');
}

.panel-close {
	background:url('../images/structure-backgrounds/close.png') bottom left no-repeat;
	position:absolute;
	right:-20px;
	bottom:-20px;
	width:40px;
	height:40px;
	cursor:pointer;
}

.panel-close:hover {
	background:url('../images/structure-backgrounds/close.png') top left no-repeat;
}

#toolbox-panel ul li { 
	display: inline; 
	float:left;
	width:111px;
	font-size:12px;
	font-weight:normal;
	margin-left:10px;
	margin-right:10px;
	margin-bottom:20px;
	margin-top:10px;
	cursor:pointer;
}

#toolbox-panel ul li.tool-text { 
	width:242px;
	text-align:left;
	cursor:text;
	margin-top:25px;
}


#toolbox-panel ul li:first-child { 
	margin-left:20px;
}

#toolbox-panel ul li:last-child { 
	margin-right:20px;
}

#bg1, #bg2, #bg3 {
	border:2px solid #2B2B2B;
}
#access {position:relative;}
#access-panel {
	cursor:default;
	display:none;
	position:absolute;
	left:-1px;
	top:40px;
	background:url('../images/structure-backgrounds/dropdown-bg.png');
}

#access-panel ul li { 
	font-size:12px;
	font-weight:normal;
	margin-left:20px;
	margin-right:20px;
	margin-bottom:10px;
	margin-top:10px;
}

#access-panel ul li:first-child { 
	margin-top:20px;
}

#access-panel ul li:last-child { 
	margin-bottom:20px;
}

#txt1, #txt2, #txt3 {
	border:2px solid #2B2B2B;
	cursor:pointer;
}
/* Content Styles
----------------------------------------------------------------------*/
/* Home Page Styles */
.cb-title, .cb-link, .lp-title {
	text-transform:lowercase;
}

.lb .cb-main {
	background:url('../images/icons/chatter-end-icon.png') bottom right no-repeat;
	padding-bottom:10px;
	margin-bottom:20px;
	text-align:justify;
}

.cb-title {
	padding:0 0 2px 30px;
	background:url('../images/icons/chatter-icon.png') left center no-repeat;
}

.cb-link:link, .cb-link:active, .cb-link:visited {
	line-height:normal;
	display:block;
	padding:5px 35px 5px 0;
	background:url(../images/icons/link-icons.png) right top no-repeat;
}

.cb-link:hover, .cb-link:focus {
	background:url(../images/icons/link-icons.png) right bottom no-repeat;
	text-decoration:none;
}

.lp-title {
	margin-top:-5px;
	padding-left:30px;
	background:url('../images/icons/procjet-icon.png') left center no-repeat;
}

.mb blockquote {
	font-size:12px;
	line-height:120%;
	font-style:italic;
}

/** What we've done graphics **/

#wwd-webdd, #wwd-cms, #wwd-ecom, #wwd-promo, #wwd-com, #wwd-ss, #wwd-re {
	background-image:url(../images/icons/tasks-icons.png);
	background-repeat:no-repeat;
	display:block;
	float:left;
	margin-right:5px;
	width:26px;
	height:26px;
}

#wwd-webdd {
	background-position:0 0;
}

#wwd-cms {
	background-position: -26px 0;
}

#wwd-promo {
	background-position: -52px 0;
}

/* Scroller Styles
----------------------------------------------------------------------*/
.scroller-bg {
	background:#E5E5E5;
	margin-bottom:50px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.scroller-container {
	margin:10px;
	height:220px;
}

#flowpanes {
	position:relative;
	overflow:hidden;
	clear:both;
}

/* override single pane */
#flowpanes div {
	float:left;
	display:block;
	width:920px;
	cursor:pointer;
	font-size:14px;
	height:220px;
	color:#000;
}

/* our additional wrapper element for the items */
#flowpanes .items {
	width:20000em;
	position:absolute;
	clear:both;
	margin:0;
	padding:0;
}

#flowpanes .less, #flowpanes .less a {
	color:#999 !important;
	font-size:11px;
}

#webdd {
	background:#99CC33 url('../images/structure-backgrounds/web-design-development-head.jpg') no-repeat;
}

#cms {
	background:#3399CC url('../images/structure-backgrounds/cms-head.jpg') no-repeat;
}

#ecommerce {
	background:#FF9933 url('../images/structure-backgrounds/e-commerce-head.jpg') no-repeat;
}

#seo {
	background:#FF0033 url('../images/structure-backgrounds/seo-head.jpg') no-repeat;
}

#community {
	background:#FFCC33 url('../images/structure-backgrounds/community-head.jpg') no-repeat;
}

#software {
	background:#9933CC url('../images/structure-backgrounds/specialist-software-head.jpg') no-repeat;
}

#research {
	background:#FF33CC url('../images/structure-backgrounds/research-head.jpg') no-repeat;
}

#page-head {
	background:#000 url('../images/structure-backgrounds/page-head.jpg') no-repeat;
}

#webdd, #cms, #ecommerce, #seo, #community, #software, #research, #page-head {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;	
}

#page-head h1 {
	position: absolute;
	left:40px;
	bottom:40px;
	width:620px;
	font-size:40px;
	margin:0;
}

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

.contact-form label, .contact-form input, .contact-form textarea {
	float:left;
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
}

.contact-form br {
	clear:both;
}

.contact-form label {
	width:110px;
	margin:10px 0;
}

.contact-form input, .contact-form textarea {
	margin:5px 0;
	padding:2px;
	width:200px;
}

.contact-form input[type=text],.contact-form textarea {
	border:1px solid #2D2D2D;
	border-collapse:collapse;
}

.contact-form input[type=text]:focus, .contact-form textarea:focus {
	border:1px solid #5EBEFF;
}


.contact-form input[type=submit] {
	margin-left:110px;
	width:120px;
	border-collapse:collapse;
	border:1px solid #2D2D2D;
	background:#191817;
	color:#FFF;
	padding:3px 0;
}

.contact-form input[type=submit]:hover {
	border:1px solid #5EBEFF;
	color:#5EBEFF;
}

/* Quick Links Footer Styles
----------------------------------------------------------------------*/

.inner-quick-links h3 {
	margin:20px 0;
	text-transform:lowercase;
	line-height:150%;
}

.ql ul, .ql li {
	text-transform:lowercase;
	font-size:11px;
}

.ql li {
	margin:3px 0;
}

.ql ul ul li {
	list-style:disc inside;
}

.sm ul, .sm li {
	font-size:11px;
}

.sm li {
	padding: 5px 0 5px 25px;
	margin:3px 0;
}

#twitter {
	background:url('../images/social-media/twitter-small.png') left center no-repeat;
}

#facebook {
	background:url('../images/social-media/facebook-small.png') left center no-repeat;
}

#linkedin {
	background:url('../images/social-media/linkedin-small.png') left center no-repeat;
}

#skype {
	background:url('../images/social-media/skype-small.png') left center no-repeat;
}

#blogger {
	background:url('../images/social-media/blogger-small.png') left center no-repeat;
}

#rss {
	background:url('../images/social-media/rss-small.png') left center no-repeat;
}

.ts {
	margin-right:0;
}

.ts-img {
	margin-right:20px;
	margin-bottom:25px;
	float:left;
}

.ts-head {
	padding-top:10px;
}

.cd p, .ts p {
		font-size:11px;
}

.ts p {
	clear:both;
	padding:3px 0 3px 30px;
	margin:8px 0;
	background:url('../images/icons/3-steps-numbers.png') left no-repeat;
	text-transform:lowercase;
	line-height:normal;
}

.ts p.ts-1 {
	background-position:top left;
}

.ts p.ts-2 {
	background-position:center left;
	padding:2px 0 3px 30px;
}

.ts p.ts-3 {
	background-position:bottom left;
}

.ts div.ts-link {
	margin-top:20px;
	text-align:right;
	font-size:14px;
}
	

.ts div.ts-link a:link, .ts div.ts-link a:active, .ts div.ts-link a:visited {
	color:#5EBEFF;
	font-weight:bold;
	text-shadow:5px 5px #000;
}
.ts div.ts-link a:hover, .ts div.ts-link a:focus {
	color:#FFF;
	text-shadow:5px 5px #000;
	text-decoration:none;
}


/* Footer Bar Styles
----------------------------------------------------------------------*/

#pdcpost {
	margin-left:10px;
	background:url('../images/icons/pdc-post-footer-link.png') top no-repeat
}

#pdcpost:hover {
	background:url('../images/icons/pdc-post-footer-link.png') bottom no-repeat
}


/* Misc (alignment changes and colour variations)
----------------------------------------------------------------------*/

.rtl {
	text-align:right;
}

.lgrey {
	color:#CCC;
}

.mgrey {
	color:#666;
}

.dgrey {
	color:#333;
}

.blue {
	color:#5EBEFF;
}

.red {
	color:#FF0033;
}
	
.pink {
	color:#cc3399;		
}

.yellow {
	color:#ffdd33;
}
	
.orange {
	color:#ff9327;
}

.green {
	color:#99cc33;
}

.purple {
	color:#9933cc;
}

ul#wwd li.webdesign a:hover {
	color:#99cc33;
}

ul#wwd li.cms a:hover {
	color:#5EBEFF;
}

ul#wwd li.ecommerce a:hover {
	color:#FF9327;
}

ul#wwd li.seo a:hover {
	color:#FF0033;
}

ul#wwd li.onlinecommunity a:hover {
	color:#ffdd33;
}

ul#wwd li.specialised a:hover {
	color:#9933cc;
}

ul#wwd li.research a:hover {
	color:#cc3399;
}

.meetteam {
	padding:20px;
}

#meet-the-team {
width: 662px;
padding: 0px;
margin: 0px;
}

#meet-the-team li {
display:inline; 
}

#meet-the-team a img {

}

#meet-the-team a img:hover {
filter:alpha(opacity=60);
opacity:0.6;
}

.whatwedo:hover {
filter:alpha(opacity=60);
opacity:0.6;
}

ul#main-nav li ul#wwd li a img:hover {
filter:alpha(opacity=60);
opacity:0.6; 
 }
 
.sitemap ul {text-transform:lowercase;}
 
.sitemap ul ul {
	list-style:inside circle;
	font-size:12px;
}

.sitemap ul li {
	margin-top:5px;
	margin-bottom:5px;
}

/********************* Twitter Feed **************************/

.twitted {
}

.twitted h2 {
	margin: 0;
	padding: 0.3em 0;
	font-size: 1em;
	color: #fff;
	background-color: #888;
}

.twitted p.preLoader {
	margin: 0;
	padding: 1em 1em 1em 3em;
	background: transparent url("../images/loader.gif") 1em center no-repeat;
	/* generate your own loader gif: http://www.ajaxload.info */
}

.twitted ul#twitter_update_list {
	margin: 0;
	list-style-type: none;
}

.twitted ul#twitter_update_list li {
	margin: 0;
	padding: 0.8em 0 0.8em 0;
	border-bottom: 1px solid #999;
}

.twitted ul#twitter_update_list li span {
	/* tweet content */
	display: block;
}

.twitted ul#twitter_update_list li span a {
	/* links in tweet content */
	color: #5EBEFF;
}

.twitted ul#twitter_update_list li a {
	/* timestamp link */
	color: #5EBEFF;
}

.twitted ul#twitter_update_list li.firstTweet {
}

.twitted ul#twitter_update_list li.lastTweet {
	border-bottom: none;
}