

/* --------------------------- */
/* NAV                         */
/* --------------------------- */

ul#nav {
	margin: 0; padding: 30 0 10 0;
	list-style: none;
	float: left;
	width: 960px;
	position:relative;
	overflow:hidden;
}
ul#nav li {
	float: left;
	margin: 0; padding: 0;
}

ul#nav a {
	float: left;
	display: block;
	height: 99px;
	background-position: left top;
}
ul#nav a:hover {
	background-position: left -100px;
}
ul#nav li.Home-Roll a {
	background-image: url(../../images/nav/home-nav.png);
	width: 160px;
}
ul#nav li.AboutUs-Roll a {
	background-image: url(../../images/nav/aboutus-nav.png);
	width: 160px;
}
ul#nav li.LatestWork-Roll a {
	background-image: url(../../images/nav/latestwork-nav.png);
	width: 160px;
}
ul#nav li.News-Roll a {
	background-image: url(../../images/nav/news-nav.png);
	width: 160px;
}
ul#nav li.WhatWeDo-Roll a {
	background-image: url(../../images/nav/whatwedo-nav.png);
	width: 160px;
}
ul#nav li.Contact-Roll a {
	background-image: url(../../images/nav/contact-nav.png);
	width: 160px;
}

#homepage li.Home-Roll a, 
#aboutuspage li.AboutUs-Roll a,
#latestworkpage li.LatestWork-Roll a,
#newspage li.News-Roll a,
#whatwedopage li.WhatWeDo-Roll a,
#contactpage li.Contact-Roll a
{
	background-position: left -200px;
}

/* --------------------------- */
/* WHAT WE DO NAV              */
/* --------------------------- */

#iPad-Apps{
height:100%; width:192px; color: #FFF; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/nav_01.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#iPad-Apps:active{
height:100%; width:192px; color: #FFF; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/nav_01.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#iPad-Apps:hover{
height:100%; width:192px; color: #FFE200; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/hover_01.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}

#iPhone-Apps{
height:100%; width:192px; color: #FFF; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/nav_02.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#iPhone-Apps:active{
height:100%; width:192px; color: #FFF; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/nav_02.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#iPhone-Apps:hover{
height:100%; width:192px; color: #FFE200; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/hover_02.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}

#Android-Apps{
height:100%; width:192px; color: #FFF; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/nav_03.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Android-Apps:active{
height:100%; width:192px; color: #FFF; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/nav_03.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Android-Apps:hover{
height:100%; width:192px; color: #FFE200; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/hover_03.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}

#Blackberry-Apps{
height:100%; width:192px; color: #FFF; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/nav_04.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Blackberry-Apps:active{
height:100%; width:192px; color: #FFF; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/nav_04.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Blackberry-Apps:hover{
height:100%; width:192px; color: #FFE200; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/hover_04.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}

#Mobile-Apps{
height:100%; width:192px; color: #FFF; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/nav_05.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Mobile-Apps:active{
height:100%; width:192px; color: #FFF; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/nav_05.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Mobile-Apps:hover{
height:100%; width:192px; color: #FFE200; text-decoration: none;
background:url('../../images/layout/what-we-do-nav/images/hover_05.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}

/* --------------------------- */
/* CONTACT NAV                 */
/* --------------------------- */

#Mailing{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/mailing.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Mailing:active{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/mailing.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Mailing:hover{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/mailing-hover.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}

#Twitter{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/twitter.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Twitter:active{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/twitter.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Twitter:hover{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/twitter-hover.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}

#Employment{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/employment.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Employment:active{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/employment.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#Employment:hover{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/employment-hover.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}

#M-and-L{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/media.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#M-and-L:active{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/media.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#M-and-L:visited{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/media.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}
#M-and-L:hover{
height:100%; width:239px;
background:url('../../images/layout/contact-nav/images/media-hover.png') 0 0 no-repeat;
cursor: pointer; display:inline; float:left;}


/* --------------------------- */
/* SLIDER NAV                  */
/* --------------------------- */

#prenav a {
cursor:pointer;
display:block;
width:16px;
height:20px;
background:url('/Images/Products/Layout/bullets2.png') no-repeat 50% 0;
text-indent:-9999px;
border:0;
float:left;
}

#prenav a.activeSlide {background-position:50% -22px;}
#prenav a:hover {background-position:50% -44px;}

.rotating-images{
margin:0 0 10px 0;
}
	
	
/* --------------------------- */
/* BODY                        */
/* --------------------------- */

body { padding: 0; margin: 0; font-family: Arial, Verdana, Helvetica; font-size: 13px; color:#777; line-height: 1.7em;}
p { margin-top: 0;}
ul { margin: 0; text-indent:0px; padding:0 0 0 0;}
ol { margin-top: 0;  padding:0 0 15px 25px;}

/* --------------------------- */
/* LINKS                       */
/* --------------------------- */

A:link { color: #C96; text-decoration: none; }
A:active { color: #C96; text-decoration: none; }
A:visited { color: #C96; text-decoration: none; }
A:hover { color: #000; text-decoration: none; }
#footer div, #footer a { color: #737373; text-decoration: none;}
#footer a:hover { color: #333; text-decoration: none; }


/* --------------------------- */
/* HEADINGS                    */
/* --------------------------- */

h1 { font-size: 45px; color: #000; margin:0;}
h2, h3 { font-size: 25px; color: #777; margin:0 0 0.2em 0;}
h4 { font-size: 19px; color: #666; margin:0; line-height:1.8;}
h5 a { color: #bf202f; text-decoration: none; }
h6 { font-size: 14px; color: #666; margin:0; line-height:1.8;}
h7 { font-size: 15px; color: #666; margin:0; line-height:2; font-weight:bold;}


/* --------------------------- */
/* DIVS                        */
/* --------------------------- */

#container {
	width:960px;
	overflow:hidden;
	position:relative;
	margin:1px auto 1px auto;
}

#nav {
	padding-top:30px;
	padding-bottom:10px;
	position:relative;
	width:960px;
	height:100px;
	overflow:hidden;
}

#subnav {
	position:relative;
	vertical-align:top;
	color:#FFF;
	width:960px;
	height:55px;
	overflow:hidden;
}

#banner {
	position:relative;
	width:960px;
	height:438px;
	overflow:hidden;
	border-width: 4px 0px 4px 0px;
	border-color:#000;
	border-style:solid;
}

#heading {
	width: 960px;
	margin-top:25px;
	overflow:hidden;
	position:relative;
	text-align:left; 
}

#content {
	width: 960px;
	margin-top:20px;
	margin-bottom:15px;
	overflow:hidden;
	position:relative;
	text-align:left; 
}

#clients {
	clear:both; 
	width:960; 
	text-align:center; 
	margin-top:20px; 
	margin-bottom:20px;
}

#selector{
	width: 960px;
	height: 250px;
}

#slider{
	height:280px;
	width:460px;
}

/* --------------------------- */
/* COLUMNS                     */
/* --------------------------- */

.col2 {
	float:left;
	width:460px;
}

.col3 {
	float:left;
	width:310px;
	margin-right:15px;
}

.col3:nth-of-type(3) {
	margin-right:0;
}

/* unsorted */

.section {
	float:left; width:960px; padding: 0px;
	padding-bottom:40px;
	border-bottom:1px solid #000;
}

#platforms {
}

#platforms li {
	list-style:none;
	float:left;
	width:225px;
	margin-right:20px;
	text-align:center;
}

#platforms li:last-child {
	margin-right:0;
}

#platforms img {
	border:0;
}

.catalogue-points {
	display:block;
	float:right;
	width:360px;
}

.catalogue-points h4 {
	line-height:22px;
	margin-bottom:6px;
}

.catalogue-points p {
	margin-bottom:5px;
	line-height:20px;
}

/* --------------------------- */
/* FOOTER                      */
/* --------------------------- */

#footer{
	width: 960px;
	padding:6px 0 50px 0;
	font-size:11px;
	border-top-width: 4px;
	border-top-color:#000;
	border-top-style:solid;
}

#social {
	width:960px;
	height:45px;
	background:url('../../images/footer/social-bg.png') no-repeat;
	margin-bottom:6px;
}

#social-fb {
	margin:5px;
  float:right;
	width:490px;
	height:36px;
	background:url('../../images/footer/social-fbbg.png') no-repeat;
}

#social-join, #mc_embed_signup{
	position:relative;
	overflow:hidden;
	margin:5px;
	height:36px;
	width:350px;
	background:url('../../images/footer/social-join.png') -0px -0px;
	float:left;
}

#social-join:hover, #mc_embed_signup:hover{
	position:relative;
	overflow:hidden;
	margin:5px;
	height:36px;
	width:350px;
	background:url('../../images/footer/social-join.png') -0px -36px;
	float:left;
}

input.error, select.error {
background-color: #fffacd;
border: 1px solid #E01E1E;
}
label.error{font-size:0;}
