@charset "utf-8";
/* CSS Document */

body {
	/*background: url(../images/backgrounds/body-bg.png) repeat;*/
	background:#171917;
	color:#fff;
	font-family: "Georgia", Arial, Verdana, Helvetica, sans-serif;
	font-size:75%;
	margin:0 auto;
	padding: 0;
	}
	
	a:active, a:link { color: #fff; }
	
	a:hover { color:#FF6633; }
	
	h1 { color:#CC3333; font-size:1.5em; }
	
	img { border: 0; }
	
	/***************** Wrapper *****************/
	#wrapper { /*background: #171917 url(../images/backgrounds/wrapper-bg.jpg) no-repeat left top;*/ position: relative; margin: 0 auto; text-align: left; width: auto; max-width:1002px; overflow: hidden; min-height: 604px; }
	
	.iPhone {
	background: #171917 url(../images/backgrounds/pagebgiphone.jpg) no-repeat left top;
	}	
	
	.iPad {
	background: #171917 url(../images/backgrounds/pagebgipad.jpg) no-repeat left top;
	}	
	
	.wp7 {
	background: #171917 url(../images/backgrounds/pagebgwp7.jpg) no-repeat left top;
	}	
	.android {
	background: #171917 url(../images/backgrounds/pagebgandroid.jpg) no-repeat left top;
	}
	
	
	/*********FWA left top tag*********/
	.fwa-left {
	position: absolute;
	top:0;
	left: 0;
	z-index: 1000;	
	}

	.fwa-left a {
		background:url(../images/fwa_motd_topleft.png);
		width: 68px;
		height: 68px;
		display: block;
	}
	
	/******/
	
		/***************** Header *****************/
	#header { float:left; padding: 0 0 0 73px; width: 929px; height: 107px; }
	
	#header h1 { width:430px; margin:0; float: left;  }
	
	#header h1 a {  display:block; height:93px; text-indent:-9000px; padding:10px 0 0; }
	
	#header ul { margin:0; padding:0; list-style-type: none; }
	
	#header ul li { float: right; padding: 2.4em 1em 0 0; } #header ul li.iPhone-btn { padding: 2.7em 1em 0 0 !important; } 
	
	#header ul li.iPad2-btn { padding: 2.85em 1em 0 0 !important; } 
	#header ul li.wp7-btn { padding: 2.7em 1em 0 0 !important; } 
	#header ul li.android-btn { padding: 2em 1em 0 0 !important; } 
	/***************** Mid section *****************/
	
	#content-wrapper { float: left; width: 650px; }	 #content-wrapper-iPad { float: left; width: 995px; } 	#content-wrapper-wp7 { float: left; width: 673px; }	 

	
	#content-section { width: 484px; float:left; margin:30px 0 0 100px; font-size: 1.35em; color:#fafaea; background: Transparent; }
	
	
	
	
	#content-section2 { width: 445px; float:left; margin:40px 0 0 100px; background:url(../images/traveller-graphic.png) no-repeat left top; height: 70px; padding: 51px 0 30px 55px;}
	
	#content-section3 { float: left; width: 530px; margin:10px 0 0 90px; font-size: 1.55em;}
	
	#content-app-requirements { width: 222px; float:right; margin:47px 64px 0 0; background:url(../images/traveller-graphic.png) no-repeat left top; padding: 9px 0 30px 55px;}
	
	.app-store { float: left; margin:0 12px 0 0; }
	
	.green-box { font-size: 0.80em; float: left; background:url(../images/green-box.png) no-repeat left top; height: 62px; width: 215px; padding: 8px; }
	
	.green-box-iPhone { font-size: 0.80em; float: left; height: 62px; width: 215px; padding: 8px; clear: both }
	
	.screen-display { float: right; margin: -39px 101px 0 0; width: 222px; }
	
	#content-section-iPad { margin:20px 0 0 70px; width:378px; float:left; font-size: 1.35em; color:#fafaea; padding: 15px 12px 0 0; }
	
	#content-section2-iPad { width: 445px; float:left; margin:0 0 0 -42px; background:url(../images/traveller-graphic.png) no-repeat left top; height: 70px; padding: 51px 0 30px 55px; clear: both;}
	
	.webbys-section-iPad { width: 505px; float:left; margin:0 0 35px -42px; background:url(../images/sas_site_webby.png) no-repeat left top; height: 232px; clear: both;}	
	
		.webbys-section-iPad a { display: block; width: 66px; height: 25px; /*background: #ccc;*/ float: right; margin:180px 148px 0 0; }
	
	.image-holder-trueways { float: left; margin: 20px 0 40px 69px; }
	
	.webbys-section-iPhone { width: 250px; float:right; margin:-182px 62px 35px; background:url(../images/sas_site_webby_iphone.png) no-repeat left top; height: 350px; clear: both;}	
	
		.webbys-section-iPhone a { display: block; width: 66px; height: 25px; /*background: #ccc;*/ float: right; margin:314px 31px 0 0; }

	.webbys-section-wp7{ width: 250px; float:right; margin:-140px 62px 35px; background:url(../images/sas_site_webby_iphone.png) no-repeat left top; height: 350px; clear: top;}	

	/***************** Menu *****************/
	
	ul#menu { float: left; width: auto; margin:0 0 0 73px; list-style-type: none; padding: 0; height: 40px; }
	
	ul#menu li { float: left; margin-left:7px;}
	
	ul#menu li.appStore a { background:url(../images/buttons/appstore_small.png) no-repeat left top; width: 108px; height: 40px; }
	
	
	ul#menu li.appStore a:hover { background:url(../images/buttons/appstore_small_mo.png) no-repeat left top; width: 108px; height: 40px; }
	
	ul#menu li a { background:url(../images/buttons/button_normal.png) no-repeat left top; display: block; width: 108px; height: 22px; color:#FFF; font-size: 13px; text-align: center; font-weight: bold; padding: 8px 0 0 0; text-decoration: none;}
				
		ul#menu li a:hover { font-weight: bolder; background:url(../images/buttons/button_hover.png) no-repeat left top; }
		
	
		ul#menu li a.actv-Home, ul#menu li a.actv-Gallery, ul#menu li a.actv-Extras, ul#menu li a.actv-Press {   font-weight: bolder; background:url(../images/buttons/button_active.png) no-repeat left top; width: 108px; height: 28px; font-size: 15px; padding: 12px 0 0 0;}
		
	
	/***wp7******/
	ul#menu li.wps a { background:url(../images/buttons/marketplace_small.png) no-repeat left top; width: 108px; height: 40px; }
	ul#menu li.wps a:hover { background:url(../images/buttons/marketplace_small_mo.png) no-repeat left top; width: 108px; height: 40px; }
	
	ul#menu li.adrs a { background:url(../images/buttons/android-marketplace.png) no-repeat left top; width: 108px; height: 40px; }	
	ul#menu li.adrs a:hover { background:url(../images/buttons/android-hover.png) no-repeat left top; width: 108px; height: 40px; }
	
	
	/********** Footer section ********************/
		
		#footer { background:transparent url(../images/backgrounds/footer-bg.jpg) no-repeat left top; height:63px; margin: 0 auto; text-align: left; width:1002px;}
		
		#footer a { color:#fff; } #footer a:hover { color:#ff6633; }
		
		#footer .left { margin: 32px 0 0 20px; float: left; }
		
		#footer .left ul { margin:0; padding:0; list-style-type:none; width: 500px; vertical-align: bottom !important; height: 25px; }
		
		#footer .left ul li { float: left; padding: 7px 0 0; } #footer .left ul li.no-top { float: left; padding: 0; }
		
		a.collins-logo  { background:url(../images/backgrounds/collins_logo.png) no-repeat left top; width: 92px; height: 22px; display: block; margin: 0 6px 0 6px;  text-indent:-9000px; }
	
	
	 a.collins-logo:hover { background:url(../images/backgrounds/collins_logo_mo.png) no-repeat left top; width: 92px; height: 22px; }
	 
	 a.trellisys-logo  { background:url(../images/backgrounds/trellisys_logo.png) no-repeat left top; width: 130px; height: 16px; display: block; margin: 0 6px 0 6px;  text-indent:-9000px;}
	
	
	 a.trellisys-logo:hover { background:url(../images/backgrounds/trellisys_logo_mo.png) no-repeat left top; width: 130px; height: 16px; }
		
		#footer .right { margin: 32px 20px 0 0; float: right; /*font-size: 0.90em;*/ color: #CCC; }
		
		
		/***************** Display buttons *****************/
	
	ul#button { float: left; margin:97px 0 0 0; list-style-type: none; padding: 0; height: 40px; }
	
	.iPad-btn { margin: 21px 0 0 100px !important; height:31px !important; }
	
	.iPhone-slide-btns { margin: 16px 0 0 29px !important; }
	
	.wp7-slide-btns { margin: 25px 0 0 65px !important; }
	
	ul#button li { float: left; margin-left:10px; cursor: pointer;}
	
	ul#button li a { background:url(../images/buttons/gallerynav_button.png) no-repeat -11px top; display: block; width: 11px; height: 11px; display: block;}
				
		ul#button li a:hover { background:url(../images/buttons/gallerynav_button.png) no-repeat left top; cursor: pointer; }
		
		ul#button li.active { background:url(../images/buttons/gallerynav_button.png) no-repeat 1px top; cursor: pointer;  width: 0px; height: 11px; display: block; margin-left:9px;}
		
		ul#button li.active-blink { background:url(../images/buttons/gallerynav_button.png) no-repeat -11px top; cursor: pointer;  width:  11px; height: 11px; display: block; }
		
		
		ul#button li.active a { background:none; display: block; width: 0px; height: auto;}
		
		
		ul#img { float: left; margin:0; list-style-type: none; padding: 7px;}
		
		ul#img li { cursor: pointer; } ul#img li img { border: 2px solid #000; } ul#img li img:hover { border: 2px solid #ff6633; }
		
		ul#img li img:select { border: 2px solid #ff6633; }
		
		.green-txt  { color: #8fca80; } ul.green-txt  li{ color: #8fca80; font-size: 0.85em; padding: 4px 0 0; }
		
		/**************Slider CSS******************/
		
		#slide-show-section { float: left; padding:6px 0 0 29px; }
		#slide-show-section-iPad { float: left; padding:0 0 0 114px; width: 421px; }
		#slide-show-section-wp7 { float: left; padding:40px 0 0 27px;  }
		#slide-show-section-andriod { float: left; padding:30px 0 0 28px;  }
		
		
		#myslide {	width:222px;	overflow:hidden;	position: relative;	height:440px;/*margin-bottom:20px; left:166px;*/}
		#myslide-iPad { width:420px;overflow:hidden;position: relative;height:378px;clear: both;/*margin-bottom:20px; left:166px;*/}
		#myslide-wp7 { 	width:235px;	overflow:hidden;	position: relative;	height:401px;	clear: both;/*margin-bottom:20px; left:166px;*/}
		#myslide-android { 	width:234px;	overflow:hidden;	position: relative;	height:398px;	clear: both;/*margin-bottom:20px; left:166px;*/}
 

		#myslide .cover{ 			width:3000px; /*------- class mystuff width * number of mystuff divs (160 * 3 = 480)---------- */ 		position: absolute;		height:350px;	}
		#myslide-iPad .cover{ 		width:4300px; /*------- class mystuff width * number of mystuff divs (160 * 3 = 480)---------- */		position: absolute;		height:350px;	}
		#myslide-wp7 .cover{ 		width:3000px; /*------- class mystuff width * number of mystuff divs (160 * 3 = 480)---------- */		position: absolute;		height:390px;	}
		#myslide-android .cover{ 		width:3000px; /*------- class mystuff width * number of mystuff divs (160 * 3 = 480)---------- */		position: absolute;		height:390px;	}
 

		#myslide .mystuff {width:222px;float:left;padding:56px 0 0;}
		#myslide-iPad .mystuff {width:420px;float:left;padding: 0; margin:31px 0 0;}
		#myslide-wp7 .mystuff {width:235px;float:left;padding:11px 0 0;}
		#myslide-android .mystuff {width:234px;float:left;padding:8px 0 0;}

 
	.button1,.button2,.button3{background:#999;padding:6px;display:block;float:left;margin-right:5px;}
	.active{background:#111;padding:6px;display:block;float:left;outline:none;}
	.active-none { background: none; padding:0; }
	.clear{clear:both;}
	
	

 
 
 
	
	/*********** Safari Hack ****************/
	/*\*/
	html*#myslide-iPad {
	/*background:blue;*/
		
	}/*end*/
	
	/*********** Opera Hack ****************/
	
		@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0)
	{
	head~body ul#menu { margin: 2px 0 0 73px; }
	}