/* 

Client:
Created: 
Last Modified:

*/

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

	body {
		margin: 0px;
		padding: 0px;
		font-family: Arial, Verdana, Helvetica, sans-serif;
		font-size: 0.8em;
		color: #50606b;
		background: #0082be url('../images/generic/body-bg.gif') center top repeat-x;
		}
		
	#wrapper {
		width: 935px;
		margin: 0px auto;
		padding: 0px;
		background: #ffffff;
		}
		
	#feedbackFormWrapper {
		padding: 20px;
	}
	
	img {
		padding:0; margin:0; line-height: 0;
		}
		
	.clear {
		clear:both;
		position:relative;
		font-size:0px;
		height:0;
		line-height:0; 
		}
		
	.h1Container {
		padding: 15px 20px;
		height: 23px;
		background: url(../images/generic/h1-container-bg.gif) repeat-x;
	}	
		
	h1, h2, h3, h4, h5, h6 {
		padding:0;
		margin: 0;
	}
	
	h1 {
		font-size: 1.5em;
		color: #ffffff;
	}
	
	h2 {
		font-size: 1.3em;
		margin-bottom: 10px;
	}
	
	h3 {
		font-size: 1em;
		color: #0f91cf;
		border-bottom: 1px solid #cccccc;
		margin-bottom: 15px;
	}
	
	a img {
		border:none;
	}
		
	a { 
		color: #0166a0;
		font-weight:700;
	}
	
	a:hover { color:#999999; }
	
	p { 
		padding: 0 0 1.2em 0;
		margin: 0;
		line-height: 1.4em;
	}	
	
	.breadcrumb {
		font-size: 0.85em;
		margin: 15px 0;
	}
	
	.breadcrumb a {
		font-weight: normal;
	}
	
	.mainColumn p {
		width: 370px;
	}
	
	.mainColumnMiddle p {
		width: 350px;
	}
	
	.columnSingle p {
		width: 570px;
	}
	
	ul {
		margin: 0 0 15px 25px;
		padding: 0;
	}
		
	
	
/* ---- HEADER ------
-------------------------------------------------------------------- */

	.logoMain {
		display: block;
		width: 204px;
		height: 89px;
		margin: 0;
		text-indent: -9999px;
		background: url('../images/generic/logo-main.gif') 0 0 no-repeat;
	}

	#header {
		padding: 20px;
		height: 90px;
	}
	

/* ---- COLUMN GRIDS ------
-------------------------------------------------------------------- */

	.content, .columnSingle {
		padding: 20px 20px 0 20px;
		background:url(../images/generic/content-bg.gif) 0 bottom repeat-x;
	}
	
	.contentContainer {
		padding: 0;
		margin: 0;
		background:url(../images/generic/faux-column.gif) repeat-y;
	}
	
	.sideColumn {
		float: left;
		width: 182px;
		padding: 0 20px;
	}

	.mainColumn, .mainColumnNoImage, .mainColumnMiddle {
		float: right;
		padding: 15px 20px;
		width: 667px;
	}
	
	.columnSingle {
		min-height: 250px;
		height: auto !important;
		height: 250px;
		padding-bottom: 20px;
	}
	
	.columnLeftContact {
		float: left;
		width: 500px;
		padding: 20px;
	}
	
	.columnRightContact {
		float: right;
		width: 355px;
		padding: 20px;
	}
	
/* ---- NAV 1 ------
-------------------------------------------------------------------- */

	#nav1Container {
		height: 53px;
		width: 923px;
		padding: 0 5px;
		margin: 0 1px;
		background: url(../images/nav/nav1-container-bg.gif) repeat-x;	
		}
		
	ul#nav1 {
		margin:0;
		padding:0;
	}

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

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

	#nav1 li a:hover {
		background-position:0 -53px !important;
		height: 53px;
		}

	#nav1 li a.nav1Home {
		background:url('../images/nav/nav1-home.gif') no-repeat left top;
		width:59px
		}
		
	#nav1 li a.nav1About {
		background:url('../images/nav/nav1-about.gif') no-repeat left top;
		width:77px
		}

	#nav1 li a.nav1CommercialAlarm {
		background:url('../images/nav/nav1-commercial.gif') no-repeat left top;
		width:105px
		}
		
	#nav1 li a.nav1AccessControl {
		background:url('../images/nav/nav1-access-control.gif') no-repeat left top;
		width:110px
		}	

	#nav1 li a.nav1Cctv{
		background:url('../images/nav/nav1-cctv.gif') no-repeat left top;
		width:71px
		}
		
	#nav1 li a.nav1Remote {
		background:url('../images/nav/nav1-24hr-remote.gif') no-repeat left top;
		width:101px
		}
		
	#nav1 li a.nav1Service {
		background:url('../images/nav/nav1-service.gif') no-repeat left top;
		width:98px
		}
		
	#nav1 li a.nav1Integrated {
		background:url('../images/nav/nav1-integrated.gif') no-repeat left top;
		width:78px
		}
		
	#nav1 li a.nav1Biometric {
		background:url('../images/nav/nav1-biometric.gif') no-repeat left top;
		width:78px
		}
		
	#nav1 li a.nav1Tscm {
		background:url('../images/nav/nav1-tscm.gif') no-repeat left top;
		width:59px
		}

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

	#nav1 li a#active { 
		height: 53px;
		background-position:0 -53px !important	
	 }
	 
	 
	/* ---- SIDE NAV SPECIFIC ------
-------------------------------------------------------------------- */		
		
	.sideNav ul {
		margin:0;
		padding:15px 0 0 0;
		list-style-type: none;
		font-size: 0.9em;
	}
	
	.sideNav li {
		list-style: none;
		margin:0;
		padding:5px 0;
		border-bottom: 1px solid #d2d2d2;
	}
	
	.sideNav a {
		display:block;
		width: 182px;
		padding:0 0 4px 0;
		text-decoration: none;
		color: #45555f;
	}
	
	.sideNav a:hover {
		 color: #0493b0;
	}
	
	.sideNav li.active {
		display: block;
		width: 182px;
		padding:5px 0;
		color: #0493b0;
	}
	
	.sideNav li.active a{
		color: #0493b0;
	}	 
	 
	 
	 
	 
	 
	 /* ---- HOMEPAGE SPECIFIC ------
-------------------------------------------------------------------- */
	
	.mainHome {
		float: right;
		margin: 0;
	}
	
	
	.module {
		float: left;
		position: relative;
		width: 280px;
		height: 125px;
		padding: 15px 10px 20px 20px;
		margin: 0 0 1px 1px;
		font-size: 0.85em;
		background:url(../images/home/module-bg.gif) repeat-x;
	}
	
	.module img {
		float: left;
		width: 82px;
		margin-right: 8px;
	}
	
	.module p {
		float: left;
		width: 180px;
		line-height: normal;
	}
	
	a.buttonMoreModule {
		position: absolute;
		display: block;
		width: 57px;
		height: 32px;
		top: 125px;
		left: 20px;
		margin: 0;
		text-indent: -9999px;
		background: url('../images/generic/button-more-module.gif') 0 0 no-repeat;
	}
	
	a.buttonMoreModule:hover {
		background: url('../images/generic/button-more-module.gif') 0 -32px no-repeat;
	}
	
	
	/* ---- OTHER ------
-------------------------------------------------------------------- */
	
	.slideshowImage {
		float: right;
		padding: 5px;
		margin-left: 20px;
		border: 1px solid #cccccc;
	}
	
	.mainContent {
		float: left;
	}
		/* ---- FORM STYLE ------
-------------------------------------------------------------------- */

	.form {
		margin: 0 0 20px;
		border: 0;
	}

	.form .label {
		width: 180px;
		padding: 6px 0;
		margin-bottom: 2px;
	}
	
	.form td {
		border-bottom: 1px solid #eeeeee;
	}
	


	.form input.text, .form textarea, .form.input.fileUpload {
		border: 1px solid #cccccc;
		width: 220px;
		color: #333;
		padding: 3px;
		margin: 0;
		vertical-align: middle;
		background: #ffffff;
		font-size: 0.85em;
		font-family: Arial, Verdana, Tahoma;

	}

	.form select {
		color: #333;
		padding: 0;
		vertical-align: middle;
		font-size: 0.85em;

	}

	input.submitButton {	
		border: 0;
		width: auto;
		padding: 3px;
		background: #4b6064;
		cursor:pointer;	
		color:#FFFFFF;
		font-size: 0.9em;
	}	
	
	input.postcode {
		color: #333;
		width: 70px;
		vertical-align: middle;
		border: 1px solid #cccccc;
		background: #ffffff;
		font-size: 0.9em;
		padding: 3px;
	}
	
	input.radio {
		margin: 0 6px;
		width: auto;
	}
	
	.required {
		visibility: hidden;
		margin: 0 0 0 10px;
		padding: 2px 0 0 0;

	}
	
	 /* ---- FOOTER ------
-------------------------------------------------------------------- */	
	
	
	#footer {
		position: relative;
		clear:both;
		padding: 8px 0 0 20px;
		height: 128px;
		font-size: 0.85em;
		color:#647584;
		background:url(../images/generic/footer-bg.gif) repeat-x;
	}

	#footer a {
		padding: 0 3px;
		font-weight: normal;
		color: #647584;
	}
	
	#footer a:hover {
		color: #333;
	}
	
	.legal {
		margin-bottom: 20px;
	}
	
	a.ticktock {
		position: absolute;
		display: block;
		width: 113px;
		height: 12px;
		top: 10px;
		left: 800px;
		margin: 0;
		text-indent: -9999px;
		background: url('../images/generic/tick-tock.gif') 0 0 no-repeat;
	}
	
	a.ticktock:hover {
		background: url('../images/generic/tick-tock.gif') 0 -12px no-repeat;
	}
	
	/* ---- sIFR ------
-------------------------------------------------------------------- */

/*****************************************************************************
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.
*/
@media screen {
  .sIFR-active h1 { font-family: Verdana; visibility: hidden; }
}