/*
	Resourcing Comms fx.css (for Mootools js effects)
	=====================================================================
	(c) Copyright 2008 Alexander Mann Solutions
	=====================================================================
*/ 

/*------ Home Slider ------*/

.mask1{
	position:relative;
	width:940px;
	height:270px;
	margin: 10px 10px 0 10px;
	overflow:hidden;
	font-size:12px;
}

#box1{
	position:absolute;
}

#box1 div{
	width:940px;
	height:270px;
	float:left;
}

.info{
	width:940px;
	height:14px;
	background:#000;
	position:absolute;
}

#info1{
	bottom:0;
	color: #fff;
	padding: 18px 0 18px 18px;
}

.info p, .info h4{
	color:#fff;
	padding:3px 8px;
}

.info h4{
	font-size:14px;
}

.info h4 a{
	float:right;
	background:#fff;
	color:#000;
	font-size:10px;
	padding:0 3px;
	text-decoration:none
}

#box1 p {
	display:none;
}

#handles {
	list-style: none; 
	position: absolute;
	top: 230px;
	right: 10px;
	padding:5px;
}

#handles li {
	width: 19px;
	height: 18px;
	float: left;
	color:#fff;
	padding: 4px 2px 0;
	margin-left: 8px;
	text-align: center;
	cursor:pointer;
	font: bold 10px Verdana;
	background: url(images/slideButtons.gif) no-repeat;
	background-position: -24px 0;
}

#handles li.active, #handles li:hover {
	background-position: 0 0;
	color:#000;
}


/*------ Content Accordions ------*/

dl#accordion2 {
	margin-bottom: 20px;
	width: 560px;
}

dl#accordion2 dt {
	height: 10px;
	cursor: pointer;
	color: #fff;
	font-size: 120%;
	padding: 15px 20px 35px;
	background: url(images/headerTeal.gif) no-repeat;
	background-position: 0 0;
}

dl#accordion2 dt.orange {
	background: url(images/headerOrange.gif) no-repeat;
}

dl#accordion2 dt.yellow {
	background: url(images/headerYellow.gif) no-repeat;
}

dl#accordion2 dt.blue {
	background: url(images/headerGreen.gif) no-repeat;
}

dl#accordion2 dt.active {
	background-position: 0 -60px;
}

dl#accordion2 dd {
	background: #252525;
}

dl#accordion2 dd div.peopleLeft {
	margin-top: 20px;
	width: 386px;
	float: left;
	display: inline;
}




dl#accordion2 dd h2 {
	border-top: solid 1px #666;
	border-bottom: solid 1px #666;
	margin: 0px 0px 15px;
	color: #ccc;
	padding: 10px 20px;
	font-size: 15px;
}
dl#accordion2 dd p {
	padding: 0 20px 20px;
	color: #ccc;
}
dl#accordion2 dd ul {
	margin-left: 30px;
	margin-right: 30px;
	padding-left: 10px;
}


dl#accordion2 dd div.peopleRight {
	margin-top: 20px;
	width: 154px;
	float: left;
	display: inline;
}

dl#accordion2 dd div.peopleRight p {
	padding: 0 0px 0px;
}

dl#accordion2 dd ul.connect {
	margin-left: 0;
	padding: 0;
}	

dl#accordion2 dd ul.connect li {
	border-top: solid 1px #444;
	width: 154px;
	font-size: 90%;
}	


img.mugshot {
	display: block;
	border: solid 1px #333;
	padding: 6px;
	margin: 0px 6px 6px 0px;
}

a.twt:link, a.twt:visited {
	display: block;
	width: 154px;
	padding: 5px 5px 5px 32px;
	background: url(images/peopleLinkTwt.gif) no-repeat;
	background-position: 0px 0px;
	color: #ccc;
}

a.twt:hover {
	background-position: 0px -28px;
	color: #fff;
}

a.lkdin:link, a.lkdin:visited {
	display: block;
	width: 154px;
	padding: 5px 5px 5px 32px;
	background: url(images/peopleLinkLkdin.gif) no-repeat;
	background-position: 0px 0px;
	color: #ccc;
}

a.lkdin:hover {
	background-position: 0px -28px;
	color: #fff;
}





/*------ case study gallery ------*/


#clients {
	clear: both;
}

#arrowLeft {

}

#viewport {
	width: 529px;
	height: 300px;
	overflow: hidden;
	clear: both;
	border: solid 3px #444;
}

#scroller {
	width: 1605px;
	height: 300px;
	background: #333;
}

#scroller a img {
	margin: 0;
	padding: 0;
}

#scroller a:link, #scroller a:visited {
	display: block;
	float: left;
	width: 535px;
	height: 300px;
}

#selector {
	list-style: none;
	height: 30px;
	margin-top: 7px;
	padding-left: 3px;
}

#selector li {
	float: left;
	margin-right: 2px;
}

#selector li a:link, #selector li a:visited {
	text-decoration: none;
	display: block;
	width: 8px;
	height: 5px;
	color: #00a59d;
	border: solid 1px #00a59d;
	text-indent: -9999px;
}

#selector li a:hover, #selector li a:focus {
	background: #00a59d;
}
.current {
	background: #00a59d;
}



/*------ Tool Tips ------*/

.tip-top		{width:150px; height: 13px; background: url(images/tipTop.png) no-repeat top left;}
.tip			{width:150px; background:url(images/tipMid.png) repeat-y center left;}
.tip-title		{color:#ffcc00; font-size: 12px; font-weight:bold; text-align: center; padding: 0 10px;}
.tip-text		{display: none;}
.tip-bottom		{width:150px; height: 6px; background:url(images/tipBottom.png) no-repeat bottom left;}



/*-------- Watermark -------*/

#gototop { 
	display:none;
	position:fixed;
	right:0px;
	bottom:5px;
	padding: 5px 10px 6px 30px;
	background: url(images/toTop.gif) no-repeat top left;
	
}



/* SLIMBOX */

#lbOverlay {
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #111;
	cursor: pointer;
}

#lbCenter, #lbBottomContainer {
	position: absolute;
	z-index: 9999;
	overflow: hidden;
	background-color: #111;
}

.lbLoading {
	background: #111 url(images/loading.gif) no-repeat center;
}

#lbImage {
	position: absolute;
	left: 0;
	top: 0;
	border: 10px solid #111;
	background-repeat: no-repeat;
}

#lbPrevLink, #lbNextLink {
	display: block;
	position: absolute;
	top: 0;
	width: 50%;
	outline: none;
}

#lbPrevLink {
	left: 0;
}

#lbPrevLink:hover {
	background: transparent url(images/btnPrevious.png) no-repeat 0 45%;
}

#lbNextLink {
	right: 0;
}

#lbNextLink:hover {
	background: transparent url(images/btnNext.png) no-repeat 100% 45%;
}

#lbBottom {
	font-size: 10px;
	color: #666;
	line-height: 1.4em;
	text-align: left;
	border: 10px solid #111;
	border-top-style: none;
}

#lbCloseLink {
	display: block;
	float: right;
	width: 75px;
	height: 22px;
	background: transparent url(images/btnClose.png) no-repeat center;
	margin: 5px 0;
	outline: none;
}

#lbCaption, #lbNumber {
	margin-right: 71px;
}

#lbCaption {
	font-weight: bold;
}