/* 

Client: Tick Tock
Created: Nov 1, 2008
Last Modified: 
Author: Ben Kendall

*/

/* ---- DEFAULT STYLES ------
-------------------------------------------------------------------- */

	body {
		margin: 0px;
		padding: 0px;
		background: #1b1626 url('../images/generic/body-bg.gif') 0 0 repeat-x;
		font-family: Arial, Verdana, Helvetica, sans-serif;
		font-size: 0.75em;
		color: #dddddd;
		}
		
	body.sendPage {
		margin: 0;
		padding: 20px;
		background: #1b1626;
		font-family: Arial, Verdana, Helvetica, sans-serif;
		font-size: 0.75em;
		color: #dddddd;
		}
		
	#wrapper {
		width: 900px;
		margin: 0px auto;
		background:#1b1626;
		}
	
	form {
		padding:0; margin:0; 
		}
		
	.clear {
		clear:both;
		position:relative;
		font-size:0px;
		height:0;
		line-height:0; 
		}
		
	h1, h2, h3, h4, h5, h6 {
		padding:0;
		margin: 0;
		font-family:Arial, Helvetica, sans-serif;
	}
	
	h1 {
		font-size: 1.4em;
		color: #FFFFFF;
		padding-bottom: 10px;
	}
	
	h2 {
		font-size: 1.4em;
		margin: 5px 0 15px 0;
		border-bottom: 1px solid #38314a;
	}
	
	h3 {
		font-size: 1.6em;
		margin: -1px 0 0 0;
		height: 30px;
	}
	
	h4 {
		font-size:12px;
		color:#000000;
	}	
		
	a { 
		color: #ee3f5f;
	}
	
	a:hover { color:#ffffff; }
	
	p { 
		margin: 0 0 1.2em;
		line-height: 1.4em;
		padding: 0;
	}	
	
	
	#breadcrumb {
		background: url(../images/breadcrumb-bg.gif);
		padding: 5px 0 5px 25px;
		color:#000000;
	}
	
	#breadcrumb a {
		font-weight: normal;
	}
	
	a img { 
		border:0;
	}
	
	a.button {
		height: 20px;
		width: 86px;
		padding: 0;
		margin:0;
		border: 1px solid #342d44;
		display: block;	
	}
	
	a.button:hover {
		border: 1px solid #ff0066;
	}
	
	a.goBack {
		width: 44px;
		height: 20px;
		background:url(../images/generic/button-go-back.gif) 0 0;
		text-indent: -9999px;
		display:block;
		border: 1px solid #342d44;
	}
	
	 a.goBack:hover {
		border: 1px solid #ff0066;
	}
	
	a.previous {
		float: right;
		width: 63px;
		height: 20px;
		background:url(../images/generic/button-previous.gif) 0 0;
		text-indent: -9999px;
		display:block;
		border: 1px solid #342d44;
	}
	
	 a.previous:hover {
		border: 1px solid #ff0066;
	}
	
	a.next {
		float: right;
		width: 40px;
		height: 20px;
		margin-left: 1px;
		background:url(../images/generic/button-next.gif) 0 0;
		text-indent: -9999px;
		display:block;
		border: 1px solid #342d44;
	}
	
	 a.next:hover {
		border: 1px solid #ff0066;
	}
	
	.emphasis {
		font-weight: 700;
		color: #ff4366;
	}
	
	.bodyImage {
		float: right;
		padding: 0 0 20px 20px;
	}
	
	#share {
		padding-top: 25px;
	}
	
	.pagination {
		clear: both;
		padding: 10px 0;
		height: 20px;
		border-top: 1px solid #4f485c;
		
	}

/* ---- HEADER ------
-------------------------------------------------------------------- */

	#header {
		background:#ffffff;
		height: 110px;
		position: relative;
	}
		
	.logoMain {
		position: absolute;
		width: 228px;
		height: 16px;
		margin: 60px 0 0 20px;
		text-indent: -9999px;
		background: url(../images/logo-main.gif) 0 0 no-repeat;
	}


/* ---- COLUMN GRIDS ------
-------------------------------------------------------------------- */
	
	#contentHome {
		background: url(../images/generic/content-bg.gif) bottom repeat-x;
	}

	.oneColumn {
		width: 150px;
		padding-top: 2px;
		float:left;
	}
	
	.twoHalfColumn {
		width: 485px;
		float: left;
	}
	
	.threeColumn {
		width: 710px;
		float: left;
	}

	.leftColumnHome {
		width: 460px;
		padding: 20px;
		float:left;
		background:url(../images/left-column-home-bg.jpg) repeat-x;
	}
	
	.singleColumn {
		padding: 15px 20px 15px 20px;
		background: url(../images/generic/content-bg.gif) repeat-x;
		min-height:450px;
  		height:auto !important;
  		height:450px;
	}
	

	
	/* ---- LEFT PANEL SPECIFIC ------
-------------------------------------------------------------------- */

	#newsletterModule {
		display: none;
		padding: 10px 5px;
	}

	.rightPanelForm input {
		border: 1px solid #cccccc;
		width: 92px;
		padding: 2px 3px;
		color: #333;
		margin: 0;
		vertical-align: top;
		font-family: Arial, Helvetica, sans-serif;
		background: url(../images/generic/form-input-bg.gif) 0 0 repeat-x;
		font-size: 0.8em;
	}
	
	.rightPanelForm input.submitButton {
		border: 0;
		padding: 0;
		margin: 0 0 0 2px;
		width: auto;
		cursor:pointer;	
		color:#FFFFFF;
		font-size: 1.2em;
	}

/* ---- NAV 1 ------
-------------------------------------------------------------------- */

	#nav1Container {
		background:url(../images/nav1-container-bg.jpg) repeat-x;
		height: 49px;
		padding:0;
		position:absolute;
		top: 66px;
		left: 440px;
		}
		
	ul#nav1 {
		margin:0;
		padding:0;
	}

	#nav1 li {
		float:left;
		position:relative;
		padding: 0 0 0 38px;
		margin:0;
		list-style:none;
		
		}

	#nav1 li a {
		display:block;
		height:17px;
		text-indent:-999px;
		overflow:hidden;   
		}
		
	#nav1 li:hover ul, #nav1 li.hover ul {
		display:block
		}

	#nav1 li a:hover {
		background-position:0 -17px !important;
		height: 17px;
		padding-bottom: 4px;
	
		}

	#nav1 li a.nav1Home {
		background:url(../images/nav/nav1-home.gif) no-repeat left top;
		width:41px
		}
		
		#nav1 li a.nav1Profile {
		background:url(../images/nav/nav1-profile.gif) no-repeat left top;
		width:41px
		}
		
		#nav1 li a.nav1News {
		background:url(../images/nav/nav1-news.gif) no-repeat left top;
		width:37px
		}


		
	#nav1 li a.nav1Portfolio {
		background:url(../images/nav/nav1-portfolio.gif) no-repeat left top;
		width:61px
		}

	#nav1 li a.nav1Contact {
		background:url(../images/nav/nav1-contact.gif) no-repeat left top;
		width:54px
		}
				
	/* selected nav */

	#nav1 li a#active { 
		height: 17px;
		background-position:0 -17px !important;
		padding-bottom: 4px;
		
		}
		
		
/* ---- SIDE NAV SPECIFIC ------
-------------------------------------------------------------------- */		
		
	#sideNav ul {
		margin:0;
		padding:0 20px 0 0;
		list-style-type: none;
	}
	
	#sideNav li {
		list-style: none;
		margin:0;
		padding:5px 0;
		border-bottom: 1px solid #4f485c;
	}
	
	#sideNav a {
		display:block;
		width: 130px;
		padding:0 0 4px 0;
		text-decoration: none;
		color: #FFFFFF;
	}
	
	#sideNav a:hover {
		 color: #ee3f5f;
	}
	
	#sideNav li.active {
		display: block;
		width: 130px;
		padding:5px 0;
		color: #ee3f5f;
	}
	
	#sideNav li.active a{
		color: #ee3f5f;
	}	
	
	
	#moduleNav {
		padding: 10px 0;
		margin: 30px 0;
		background:#1b1626;
		width: 130px;
	}	
		
	#moduleFriend, #moduleEnquire, #moduleNewsletter {
		width: 130px;
		height: 26px;
		display: block;
		text-indent: -9999px;
		margin: 0;
	}
	
	a#moduleFriend {
		background: url(../images/nav/tell-friend.gif)  0 0 no-repeat;
	}
	
	a#moduleEnquire {
		background: url(../images/nav/enquire-now.gif) no-repeat;
	}	
	
	a#moduleNewsletter {
		background: url(../images/nav/newsletter.gif) no-repeat;
	}
	
	a#moduleFriend:hover {		
		background: url(../images/nav/tell-friend.gif)  0 -26px no-repeat;
	}
	
	a#moduleEnquire:hover {		
		background: url(../images/nav/enquire-now.gif)  0 -26px no-repeat;
	}
	
	a#moduleNewsletter:hover {		
		background: url(../images/nav/newsletter.gif)  0 -26px no-repeat;
	}
		
		
		
	
/* ---- HOME PAGE SPECIFIC ------
-------------------------------------------------------------------- */

	#contentHome {
		padding-bottom: 20px;
		background:url(../images/generic/home-content-bg.gif) repeat-x;
	}

	#intro {
		position: relative;
		padding: 20px;
		width: 390px;
		float: left;
	}
	
	.latestNews {
		float:left;
		width: 194px;
		margin-top: 20px;
		padding: 0 20px 0 20px;
		border-left: 1px solid #1b1626;
	}
	
	.newsletter {
		float:right;
		width: 194px;
		margin-top: 20px;
		padding: 0 20px 0 20px;
		border-left: 1px solid #1b1626;
	}
	
	#intro h2, .latestNews h2, .newsletter h2 {
		border: none;
	}
	
	#timeStampLogo {
		padding-bottom: 10px;
	}
	
	
	ul.latestNewsList {
		margin:0;
		padding:0;
	}
	
	ul.latestNewsList li {
		margin: 0 0 5px 0;
		padding-bottom: 8px;
		list-style-type:none;
	}
	
	/*ul.latestNewsList li a {
		color:#c3b3bc;
		font-size: 1.2em;
		color: #ffffff;
		text-decoration: none;
	}
	
	ul.latestNewsList li a:hover {
		color: #ffffff;
		text-decoration: underline;
	}*/
	
	
	#feature {
		width: 910px;
		height: 250px;
	}
	
	
	/* ---- ABOUT SPECIFIC ------
-------------------------------------------------------------------- */
	#aboutContent {
		width: 485px;
		float: left;
	}
	
	

	/* ---- NEWS SPECIFIC ------
-------------------------------------------------------------------- */
	ul#newsList {
		list-style-type:none;
		margin:0;
		padding:0;
	}
	
	ul#newsList li {
		list-style-type:none;
		margin:0;
		padding:0;
		
	}
	
	ul#newsList li a {
		height: 62px;
		padding: 5px 5px 5px 10px;
		margin-bottom: 6px;
		display: block;
		cursor:pointer;
		text-decoration: none;
		color:#948ca2;
		border: 1px solid #322c41;
	}
	
	ul#newsList li a:hover {
		border: 1px solid #be3460;
		color:#ffffff;
	}
	
	.newsListImg {
		float: right;
		width: 130px;
		height: 60px;
		margin: 0 0 0 15px;
	}
	
	.newsListDate {
		display: block;
		padding-top: 5px;
		margin: 0 20px 0 0;
		color:#ffffff;
		font-size: 0.9em;
	}
	
	.newsListHeadline {
		width: 500px;
		float: left;
		color: #aaaaaa;
		margin-top: 5px;
	}

	#dateColumn {
		float: left;
		width: 150px;
	}
	
	.newsImg {
		float: right;
		padding: 0 0 20px 20px;
	}
	
	#newsDesc {
		width: 300px;
		float: left;
	}
	
	#newsAction {
		width: 165px;
		float: left;
		margin-left: 20px;
	}



/* ---- PORTFOLIO SPECIFIC ------
-------------------------------------------------------------------- */
	.portfolioList {
		float:left;
		padding: 0;
		margin:0 0 10px 0;
		list-style: none;
	}
	
	.portfolioList li {
		float: left;	
		font-size: 0.9em;
		list-style: none;
		margin: 0 3px 6px 3px;
	}
	
	.portfolioList li a {
		float: left;
		width: 212px;
		padding: 8px 8px 5px 8px;
		text-decoration: none;
		color: #aaaaaa;
		border: 1px solid #38314a;
	}
	
	.portfolioList li a:hover {
		color: #ffffff;
		border: 1px solid #be3460;
	}
	
	.portfolioList img {
		float: right;
		width: 211px;
		height: 87px;
		padding: 0 0 4px 0;
	}
	
	
	/* ---- PROJECT DETAIL SPECIFIC ------
-------------------------------------------------------------------- */	

	.projectDesc {
		width: 225px;
		margin-right: 20px;
		float: left;
	}
	
	.projectGallery {
		margin-bottom: 10px;
	}

	.projectComponents {	
		float: left;
		width: 465px;
	}
	
	ul.componentsList {
		margin:0;
		padding: 0;
		font-size: 0.9em;
		list-style: none;
	}
	
	ul.componentsList li {
		margin:0 0 2px 0;
		padding: 0 0 0 15px;
		list-style: none;
		background:url(../images/generic/list-arrow.gif) 0 5px no-repeat;
	}
	
	ul.componentsList li a {
		color: #ffffff;
		text-decoration: none;
	}
	
	ul.componentsList li a:hover {
		color: #ee3f5f;
		text-decoration: underline;
	}	
	
	a.buttonLaunch {
		width: 136px;
		height: 42px;
		background:url(../images/generic/button-launch.gif) 0 0;
		text-indent: -9999px;
		display:block;
	}
	
	 a.buttonLaunch:hover {
		background:url(../images/generic/button-launch.gif) 0 -40px;
	}
	
	ul.bulletList {
		padding: 0;
		margin: 5px 0 10px 0 ;
	}
	
	.bulletList li {
		list-style: none;
		padding: 0px 8px 0 10px;
		margin: 0 3px 6px 10px;
		background: url(../images/generic/list-style-square.gif) 0 5px no-repeat;
	}
	
	
	
	
	/* ---- CLIENT LIST SPECIFIC ------
-------------------------------------------------------------------- */
	.clientList {
		width: 710px;
		float:left;
		padding: 0;
		margin:0;
		list-style: none;
	}
	
	.clientList li {	
		float: left;
		list-style: none;
		width: 200px;
		height: 20px;
		padding: 0px 8px 0 10px;
		margin: 0 3px 6px 0;
		text-decoration: none;
		color: #aaaaaa;
		background: url(../images/generic/list-style-square.gif) 0 5px no-repeat;
	}
	
	/* ---- PAGINATION SPECIFIC ------
-------------------------------------------------------------------- */	
	
	
	#pagination {
		clear:both;
		height: 22px;
		margin: 0 0 0 0;
		background: #0c0a11;
	}
	
	ul#paginationList {
		float:right;
		margin: 0;
		padding:0;
	}	
	
	ul#paginationList li {
		display:inline;
		background:none;
		margin:0;
		padding: 0;
		width: auto;
	}
	
	#paginationList li a {
		display:block;
		float: left;
		height: 16px;
		margin-left: 1px;
		padding:6px 8px 0 8px;
		color:#FFFFFF;
		font-size: 0.75em;
		text-decoration:none;
		background: #2e2741;
		font-weight: normal;
	}
	
	#paginationList li a:hover, #paginationList li a.active {
		background: #554e69;
	}
	


/* ---- CONTACT SPECIFIC ------
-------------------------------------------------------------------- */

	#contactDetails td {
		padding:5px 0;
		vertical-align: top;
		border-bottom: 1px solid #352f43;
		
	}


/* ---- FORM STYLE ------
-------------------------------------------------------------------- */
	
	#formContainer td {
		width: 300px;
		padding: 6px 0;
		border-bottom: 1px solid #352f43;
	}
	
	#sendFriendContainer  {
		font-size: 0.9em;
	}
	
	#sendFriendContainer td {
		width: 300px;
		padding: 6px 0;
		border-bottom: 1px solid #352f43;
	}
		
	.form input, .form textarea, .form.input.fileUpload {
		border: 1px solid #cccccc;
		width: 145px;
		padding: 2px 3px;
		color: #333;
		margin: 0;
		vertical-align: middle;
		font-family: Arial, Helvetica, sans-serif;
		background: #ffffff url(../images/generic/form-input-bg.gif) 0 bottom repeat-x;
		font-size: 0.9em;
	}

	.form select {
		width: 154px;
		border: 1px solid #DCDCDC;
		color: #333;
		font-family: Arial, Helvetica, sans-serif;
		padding: 0;
		margin: 0;
		vertical-align: middle;
		background: url (../images/generic/form-input-bg.gif) 0 0 repeat-x;
		font-size: 0.9em;
	}
	
	.form .checkbox {
		background: NONE;
		width: auto;
		border: NONE;
	}
	
	.required {
		visibility: hidden;
		margin: 0 0 0 10px;
		padding: 2px 0 0 0;

	}

	.form input.submitButton {	
		border: 0;
		padding: 0;
		margin: 0 0 0 2px;
		width: auto;
		cursor:pointer;	
		color:#FFFFFF;
		font-size: 1.2em;
		
	}
	
	.newsletterForm select {
		width: 130px;
		border: 1px solid #DCDCDC;
		color: #333;
		font-family: Arial, Helvetica, sans-serif;
		padding: 0;
		margin: 0;
		vertical-align: middle;
		background: url (../images/generic/form-input-bg.gif) 0 0 repeat-x;
		font-size: 0.9em;
	}
	
	.newsletterForm input.submitButton 	{
		border: 0;
		padding: 0;
		margin: 0 0 0 2px;
		width: auto;
		cursor:pointer;	
		color:#FFFFFF;
		font-size: 1.2em;
		
	}
	
	.newsletterForm input {
		border: 1px solid #cccccc;
		width: 120px;
		padding: 3px 3px;
		color: #333;
		margin: 0;
		vertical-align: top;
		font-family: Arial, Helvetica, sans-serif;
		background: #ffffff url(../images/generic/form-input-bg.gif) 0 bottom repeat-x;
		font-size: 0.8em;
	}


	/* ---- FOOTER ------
-------------------------------------------------------------------- */

	#footer {
		height: 90px;
		padding: 10px;
		margin: 10px;
		font-size: 0.9em;
		line-height: 1.4;
		border-top: 1px solid #322c41;
		font-family: "Tahoma", Arial, Helvetica, sans-serif;
	}
	
	ul#footerLinks {
		padding: 0;
		margin: 0;
		list-style: none;
	}
	
	#footerLinks li {
		float: left;
		padding: 0;
		margin: 0 10px 0 0;
		list-style: none;
	}
	

	#footerLinks li a {
		color:#FFFFFF;
		text-decoration: none;
		
	}
	
	#footer a:hover {
		color:#ff3170;
		text-decoration: underline;
	}



/*****************************************************************************
scalable Inman Flash Replacement (sIFR) version 3.

Copyright 2006 – 2008 Mark Wubben, <http://novemberborn.net/>

Older versions:
* IFR by Shaun Inman
* sIFR 1.0 by Mike Davidson, Shaun Inman and Tomas Jogin
* sIFR 2.0 by Mike Davidson, Shaun Inman, Tomas Jogin and Mark Wubben

See also <http://novemberborn.net/sifr3> and <http://wiki.novemberborn.net/sifr3>.

This software is licensed and provided under the CC-GNU LGPL.
See <http://creativecommons.org/licenses/LGPL/2.1/>
*****************************************************************************/

@media screen {
  .sIFR-flash {
    visibility: visible !important;
    margin: 0;
    padding: 0;
  }
  
  .sIFR-replaced, .sIFR-ignore {
    visibility: visible !important;
  }
  
  .sIFR-alternate {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    display: block;
    overflow: hidden;
  }
  
  .sIFR-replaced div.sIFR-fixfocus {
    margin: 0pt; 
    padding: 0pt; 
    overflow: auto; 
    letter-spacing: 0px; 
    float: none;
  }
}

@media print {
  .sIFR-flash {
    display    : none !important;
    height     : 0;
    width      : 0;
    position   : absolute;
    overflow   : hidden;
  }
  
  .sIFR-alternate {
    visibility : visible !important;
    display    : block   !important;
    position   : static  !important;
    left       : auto    !important;
    top        : auto    !important;
    width      : auto    !important;
    height     : auto    !important;
  }
}

/*
Place CSS rules for to-be-replaced elements here. Prefix by .sIFR-active
so they only apply if sIFR is active. Make sure to limit the CSS to the screen
media type, in order not to have the printed text come out weird.
*/

  .sIFR-active h1, .sIFR-active h2, .sIFR-active h3 {
    visibility: hidden;
  }
  
  
 	/* ---- SHADOW BOX ------
-------------------------------------------------------------------- */ 

	#sb-container,#sb-wrapper {
		text-align:left;
	}
	
	#sb-container,#sb-overlay {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		margin:0;
		padding:0;
	}
	#sb-container {
		height:100%;
		display:none;
		visibility:hidden;
		z-index:999;
	}
	
	body>#sb-container {
		position:fixed;
	}
	
	#sb-overlay {
		height:expression(document.documentElement.clientHeight+'px');
	}
	
	#sb-container>#sb-overlay {
		height:100%;
	}
	
	#sb-wrapper{
		position:relative;
	}
	
	#sb-wrapper img {
		border:none;
	}
	
	#sb-body {
		position:relative;
		margin:0;
		padding:0;
		overflow:hidden;
		border:1px solid #303030;
	}
	
	#sb-body-inner { 
		position:relative;
		height:100%;
	}
	
	#sb-content.html {
		height:100%;
		overflow:auto;
	}
	
	#sb-loading {
		position:absolute;
		top:0;
		width:100%;
		height:100%;
		text-align:center;
		padding-top:10px;
	}
	
	#sb-body,#sb-loading {
		background-color:#060606;
	}
	
	#sb-title,#sb-info {
		position:relative;
		margin:0;
		padding:0;
		overflow:hidden;
	}
	
	#sb-title-inner,#sb-info-inner {
		position:relative;
		font-family:'Lucida Grande',Tahoma,sans-serif;
		line-height:16px;
	}
	
	#sb-title,#sb-title-inner {
		height:26px;
	}
	
	#sb-title-inner {
		font-size:16px;
		padding:5px 0;
		color:#fff;
	}
	
	#sb-info,#sb-info-inner {
		height:20px;
	}
	
	#sb-info-inner {
		font-size:12px;
		color:#fff;
	}
	
	#sb-nav {
		float:right;
		height:16px;
		padding:2px 0;
		width:45%;
	}
	
	#sb-nav a {
		display:block;
		float:right;
		height:16px;
		width:16px;
		margin-left:3px;
		cursor:pointer;
	}
	
	#sb-nav-close{
		background-image:url(../images/shadowbox/close.png);
		background-repeat:no-repeat;
	}
	
	#sb-nav-next{
		background-image:url(../images/shadowbox/next.png);
		background-repeat:no-repeat;
	}
	
	#sb-nav-previous{
		background-image:url(../images/shadowbox/previous.png);
		background-repeat:no-repeat;}
	
	#sb-nav-play{
		background-image:url(../images/shadowbox/play.png);
		background-repeat:no-repeat;
	}
	
	#sb-nav-pause{
		background-image:url(../images/shadowbox/pause.png);
		background-repeat:no-repeat;
	}
	
	#sb-counter{
		float:left;padding:2px 0;width:45%;
	}
	
	#sb-counter a {
		padding:0 4px 0 0;
		text-decoration:none;
		cursor:pointer;color:#fff;
	}
	
	#sb-counter a.sb-counter-current {
		text-decoration:underline;
	}
	
	div.sb-message{
		font-family:'Lucida Grande',Tahoma,sans-serif;
		font-size:12px;padding:10px;
		text-align:center;
	}
	
	div.sb-message a:link,div.sb-message a:visited {
		color:#fff;
		text-decoration:underline;
	}