/** ------------------------------------------------------------------------------------------------------
						                        CSS RESET
** ---------------------------------------------------------------------------------------------------- */
/* http://meyerweb.com/eric/tools/css/reset/ | v2.0 | 20110126 | License: none (public domain) */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, hr {
	margin: 0; padding: 0; border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }

* {
	margin:0; padding:0;
	outline: none;
	outline-style: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/** ------------------------------------------------------------------------------------------------------
						                        DEFAULT
** ---------------------------------------------------------------------------------------------------- */
html, body { width: 100%; height: 100%;}
body { font-size: 16px; }
a, a img {
	text-decoration: none;
}
.no-select {
	/* Disabled the text selection on any element */
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: default;
}
.border-box {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;	
}
#main-frame {
	width: 100%; height: 100%;
	overflow-y: auto;
}

/** ------------------------------------------------------------------------------------------------------
						                   Z-INDEXES
** ---------------------------------------------------------------------------------------------------- */
div.header { z-index: 10;}/* Header and footer are required to be higher z index than container*/
div.footer { z-index: 10;}/* as they draw a shadows over the container. and needs to be in higher depth*/
#titleBar { z-index: 9;}
#topHolder { z-index: 8;}
#container {z-index: 1;}/**/
.scan-div-element { z-index: 15;}

/** ------------------------------------------------------------------------------------------------------
						                   HEADER STYLES
** ---------------------------------------------------------------------------------------------------- */
div.header {
	height: 6em;
	width: 100%;
	text-align: center;
}
.brandingLogo {
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	background: url(../images/brandingLogo.png) no-repeat center;
	background-size: contain;
	width: 12em;
	height: 3em;
	margin: auto;
}

/*
 @ HEADER LEFT BOX 
 The Header Left Box that will display only in the desktop version.
 The Defult CSS will have the the css attribute 'display:none' and 
 will be overritten in this media as a valid display type eg. table/block etc.
 which will show the box with contents.
*/
.header-left-content {
	display: none;
	/*The calc will count the paddings spedified to the header in styles.css*/
	height: 100%;
	float: left;
	position: absolute;
	top: 0;
	color: #fff; /*#E6EAED;*/
}
.header-left-content.mobile-display {
	display: none;	
}
.header-left-content div {
	display: table-cell;
	vertical-align: middle;	
}
.header-app-name {
	text-align: center;
	padding: 0 15px;
	font-family: 'americansansbold';
	font-size: 1.09em;
	text-shadow: 2px 2px 2px #000;
}
.header-app-line div{
	width: 1px;
	background: #003c69;
	border-left: solid 1px #008df7;
	height: 5em;
}
.header-current-time{
	text-align: left;
	padding: 0 15px;
	font-size: 1em;
	font-family: 'americansans_lightregular';
}
/*----------------------------------TOP MENU BUTTONS----------------------------------------------------*/
.topMenuButton, .topMenuButton-back {
	font-family: 'americansans_mediumregular';
	font-size: 1.6em;
	cursor: pointer;
}
.topMenuButton.logoutButton {
	width: 135px;
	height: 63px;
	position: absolute;
	top: 13px;
	right: 10px;
}
.topMenuButton.refreshButton {
	width: 135px;
	height: 63px;
	position: absolute;
	top: 13px;
	left: 10px;
}
.topMenuButton-back {
	width: 135px;
	height: 63px;
	position: absolute;
	top: 13px;
	left: 10px;
}
/*-------------------------------------------------------------------------------------------------------*/
.user-id-box {
	font-family: 'americansans_lightregular';
	background: #334555; /* Old browsers */	
	height: auto;
	text-align: right;
	font-size: .8em;
	margin: 0;
	color: #fff;
	padding-right: 10px;
	position: relative;
	padding-bottom: 3px;
	margin-top: -6px;
}
/*-------------------------------------------------------------------------------------------------------*/
.recoveryMode {
	background-color: #FF7419;
	text-align: center;
	-box-shadow: 0 2px 3px RGBA(0, 0, 0, 0.6) ;
	-width: 90%;
	margin: 0 0 1em 0;
}
.recoveryMode p {
	line-height: 2em;
	font-size: 1.8em;
	margin: 0;
	color: #fff;
	font-family: americansansregular;
	text-shadow: RGBA(0, 0, 0, 0.3) 0 1px;
}
.recoveryMode.dractive {
	display: block;
}
.recoveryMode.drinactive {
	display: none;
}

/** ------------------------------------------------------------------------------------------------------
				                            TITLE BAR STYLES
** ---------------------------------------------------------------------------------------------------- */
.title-bar {
	width: 100%;
	height: 3.3em;
	display: table;
	background-color: #eaecec;
}
.title-bar div {
	font-family: "americansansregular";
	display: table-cell;
	vertical-align: middle;
	line-height: 1em;
	height: 100%;
}
.title-bar div.msg {
	color: #36495a;
	font-size: 1.6em;
	padding-left: 5%;
}
.title-bar div.emid {
	color: #576776;
	font-size: 1.2em;
	text-align: right;
	padding-right: 2%;
}

/** ------------------------------------------------------------------------------------------------------
				                           FOOTER STYLES
** ---------------------------------------------------------------------------------------------------- */
div.footer {
	position: fixed;
	width: 100%;
	bottom: 0; left: 0; right: 0;
	display: table;
}
div.footer .navigationButton {
	display: table-cell;
	width: 33.3333%;
	cursor: pointer;
}
div.footer .navigationButton.ScanBP.active .navicon {
	background: url(../images/navigation/h160/active/scanbp.png) no-repeat center;
}
div.footer .navigationButton.Lookup.active .navicon {
	background: url(../images/navigation/h160/active/lookUpPax.png) no-repeat center;
}
div.footer .navigationButton.BagTag.active .navicon {
	background: url(../images/navigation/h160/active/enterBagTag.png) no-repeat center;
}
div.footer .navigationButton.ScanBP .navicon {
	background: url(../images/navigation/h160/inactive/scanbp.png) no-repeat center;
}
div.footer .navigationButton.Lookup .navicon {
	background: url(../images/navigation/h160/inactive/lookUpPax.png) no-repeat center;
}
div.footer .navigationButton.BagTag .navicon {
	background: url(../images/navigation/h160/inactive/enterBagTag.png) no-repeat center;
}
div.footer .navigationButton .navicon, div.footer .navigationButton.active .navicon {
	width: 100%;
	height: 100%;
	background-size: contain !important;
}
div.footer.agentLogin,
div.footer.stationCode1,
div.footer.stationCode2 {
	font-size: 1em;
	line-height: 1.4em;
}
div.footer.agentLogin .versionInfo,
div.footer.stationCode1 .versionInfo,
div.footer.stationCode2 .versionInfo {
	text-align: center;
	color: #fff;
	width: 100%;
}
div.footer.agentLogin hr,
div.footer.stationCode1 hr,
div.footer.stationCode2 hr {
	background: #00213b;
	border: none;
	height: 1px;
}
/*
HACK : This div element is used to cover up the space used by the footer.
Because the Footer elemetn is kept at fixed position and the body content 
will be hidden. any elemnt goes behind the footer will be hidden and cannot be scrolled
By adding this space box if the body expands vertically beyond the footer box
the scroll bar will be visible.
Usage: update the height in media css files where footer height is overridden.
Specify the height in Mobile Style shteets.
*/
.footer-space {}
/*
HACK : This div element is used to provide extra padding at the bottom to the
.container class element to scroll up leaving some space at the bottom.
Specify the height in Mobile Style shteets.
*/
.extra-spacer {}



/** ------------------------------------------------------------------------------------------------------
				                        DIALOG BOX STYLES
** ---------------------------------------------------------------------------------------------------- */
#popupBG {
	background-color: rgba(0,0,0,.75);
	position:fixed;
	width: 100%;
	height: 100%;
	top: 0; left: 0;
	z-index: 5000;
}
#popupContainer {
	position: absolute;
	background-color: #0077D1;
	margin: 0 auto 0;
	left:0; right:0;
	padding: 10% 10% 10%;
	width: 80%;
	color: #fff;
	z-index: 5001;
	-webkit-border-radius: .5em;
	border-radius: .5em;
	box-shadow: 0 10px 25px 2px rgba(0,0,0,.75);
}
#popupContainer h2 {
	font-family: 'americansansbold';
	text-align: center;
	font-size: 2em;
	margin: 0 0 5% 0;
}
#popupContainer p {
	word-wrap: break-word;
	font-family: 'americanregular';
	text-align: center;
	margin: 0;
	padding: 0;
	font-size: 1.5em;
}
#popupContainer p::-webkit-scrollbar {
	width: 8px;
}
#popupContainer p::-webkit-scrollbar-track {
	background: #0E5D99;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
#popupContainer p::-webkit-scrollbar-thumb {
	background: #034170;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

#popupContainer > div#buttons {
	text-align: center;
}
#popupContainer > div#buttons input[type="button"] {
	font-family: 'americanregular';
	border: none;
	display: inline-block;
	color: #0077D1;
	-webkit-border-radius: .3em;
	border-radius: .3em;
	font-size: 1.6em;
	width: 5em;
	padding: .5em 0;
	margin: 1em 5px 0;
}
#popupContainer > div#buttons input[type="button"]:hover {
	box-shadow: 0 2px 5px 1px rgba(0,0,0,1);
}
#popupContainer > div#buttons input[type="button"]:active {
	box-shadow: inset 0 2px 5px 1px rgba(0,0,0,1);
}
#popupContainer .processing {
	width: 32px;
	height: 32px;
	display: block;
	margin: 0 auto 2em;
}
#popupContainer .bagTagMessage {
	font-size: 1.5em;
	letter-spacing: 0;
	margin: 0 0 5% 0;
}

/** ------------------------------------------------------------------------------------------------------
				                        COMMON ELEMENT STYLES
** ---------------------------------------------------------------------------------------------------- */
.standardInput {
	font-family: "americansansregular";
	font-size: 1.5em;
	color: #2D2F30;
	width: 100%;
	height: 2.4em;
	padding: 0 2%;
	border: 1px solid #c1c1c1;
	background-color: #fefefe; /* Old browsers */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}
.standardInput:disabled {
	background: #E1E1E1;	
	color: #6d7275;
}
.content-margin-frame {
	margin: 0 auto 0;
	width: 90%;
}
.button {
	cursor: pointer;
}
.scan-div-element {
	display: none;
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 1em;
	font-size: 1em;
}
.app-notifiation { display: none; }
/** ------------------------------------------------------------------------------------------------------
------------------------------- BORDER RADIUS FOR ELEMENTS WITH DIFFERENT SIDES ------------------------ */
.border-radius-all {
	-webkit-border-radius: .5em;
	border-radius: .5em;
}
.border-radius-top {
	-webkit-border-radius: .5em .5em 0 0;
	border-radius: .5em .5em 0 0;
}
.border-radius-bottom {
	-webkit-border-radius: 0 0 .5em .5em;
	border-radius: 0 0 .5em .5em;
	margin-top: -1px;
}
.border-radius-none {
	-webkit-border-radius: 0 0 0 0;
	border-radius: 0 0 0 0;
	margin-top: -1px;
}

/** ------------------------------------------------------------------------------------------------------
------------------------------- BROWSER INPUT TEXT/PASSWORD PLACEHOLDER STYLES ------------------------ */
/*Override the Opacity of the color. Some browsers still not supporting the placeholder
Light Color value.*/
::-webkit-input-placeholder { /* WebKit browsers */
	color: #6d7275;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color: #6d7275;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
	color: #6d7275;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
	color: #6d7275;
}

/** ------------------------------------------------------------------------------------------------------
-------------------------------------------------- BUTTONS -------------------------------------------- */
.mainMenu {
	margin-top: 1em;
	width: 100%;
}
.mainMenuButton {
	font-family: "american_lightregular";
	text-align: left;
	font-size: 1.8em;
	color: #fff;
	display: table;
	cursor: pointer;
	margin: auto;
	width: 90%;
	padding: .5em;
}
.mainMenuButton div {
	display: table-cell;
	vertical-align: middle;
	text-align: left;
}
.blueButton{
	display: inline-block;
	padding: .4em 0;
	width: 100%;
	font-size: 1.8em;
	cursor: pointer;
	font-family: "americansansregular";
	color: #fff;
}
.blueButton.agentlogin{
	margin: 1.8em auto auto auto;	
}
.blueButton.continue {
	margin-top: 1em;	
}
.blueButton.refresh, .blueButton.back{
	display: none;	
}


.welcome-logo {
	width: 50%;
	height: 10em;
	margin: 20% auto 0;
	background: url(../images/brandingLogo-color.png) center no-repeat;
	background-size: contain !important;	
}
.welcome-text {
	margin: .6em 0 0 0;
	text-align: center;
	font-family: 'americansans_mediumregular';
	font-size: 1.7em;
	color: #36485A;
}





/*=====================================================================================================
				                           LOGIN SCREEN STYLES
=====================================================================================================*/
.agent-login-form {
	margin: 2.5em auto;
	width: 90%;
}
.standardInput.stationcode2 {
	margin: 30% 0 0 0;
}
.standardInput.pswd {
	margin-top: -1px;
}
.standardInput.stationcode {
	margin-top: -1px;
}






/*=====================================================================================================
                                      SCAN BOARDING PASS SCREEN STYLES
=====================================================================================================*/
.scan_icon_box {
	width: 80px;
	height: 77px;
	display: table-cell;
	background-size: 100% auto;
}
.scan_icon_box.pass {
	background: url(../images/Icon_ScanPass.png) no-repeat;
}






/*=====================================================================================================
                                      SEARCH PASSENGER SCREEN STYLES
=====================================================================================================*/
.passenger-lookup-form { margin-top: 1em;}
.pnrDivider {
	background: url(../images/pnrDivider.png)  center no-repeat; 
	width: 100%;
	height: 11px;
	margin: 10px auto;
}
.search-pnr-btns {
	width: 100%;
}






/*=====================================================================================================
                                      PASSENGER LIST SCREEN STYLES
=====================================================================================================*/
.pax-msg-holder {
	position: relative;
}
.paxMessage {
	font-family: 'american_lightregular';
	width: 85%;
	padding: .4em 0;
	font-size: 1.3em;	
	color: #36495a;
}
.segment-btn, .segment-btn.opened {
	position: absolute;
	right: -2px;
	top: 0;
	bottom: 0;
	width: 54px;
	height: 54px;
	cursor: pointer;
}
.segment-btn {
	background: url(../images/passArrow-closed.png) no-repeat;
	background-size: contain;
}
.segment-btn.opened {
	background: url(../images/passArrow-open.png) no-repeat;
	background-size: contain;
}
/** ------------------------------------------------------------------------------------------------------
-------------------------------------------- SEGMENT INFO BOX ------------------------------------------ */
.segment-info {
	display: none;
	width: 100%;
	background: #ffffff;
	-webkit-border-radius: .5em;
	border-radius: .5em;
	box-shadow: inset 0 2px 3px 1px RGBA(0,0,0,.3);
	margin: 0 0 .8em 0;
}
.segment-info.opened {
	display: block;	
}
.segment-box {
	letter-spacing: 0;
	color: #36495a;
	display: table;
	width: 100%;
	padding: .6em 0 .3em;
	border-bottom: solid 1px #dedede;
}
.segment-box:last-child { border: none; }
.segment-box div {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}
.segment-box .row {
	display: table-cell;
	text-align: left;
}
.segment-box .row.c1 {
	width: 35%;
	padding-left: 1em;
}
.segment-box .row.c2 {
	width: 45%;
}
.segment-box .row.c3 {
	width: 20%;
}
.segment-box .row > div {
	width: 100%;
	font-size: 1.2em;
	font-family: 'americansansregular';
	padding: .2em 0 .2em 0;
}
.segment-box .row > div.flightNumber {
	padding-left: 0;
}
.segment-box .row > div.flightStatus {
	position: relative; 
	white-space: nowrap;
	color: #0078d2;
}

.segment-box div.flightStatus.notOnTime {
	color: #FF751C;
}
.segment-box > div .flightarrow {
	display: inline-block;
	width: 17px;
	height: 18px;
	background: url(../images/greenArrow.png) no-repeat;
	background-size: contain;
}
.paxlist-selectAll {
	font-family: 'americansansregular';
	font-size: 1.5em;
	padding: .85em 0 .85em 5%;
	color: #ffffff;
}
/** ------------------------------------------------------------------------------------------------------
-------------------------------------------- PASSENGER LIST VIEW -------------------------------------- */
.passenger-list {
	background: #ffffff;
	max-height: 31.8em; /* is equal to 6times of '.passenger' height */
	overflow-y: scroll;
	overflow-x: hidden;
}
.passenger-list .passenger-row {
	
}
.passenger-list .passenger {
	font-family: 'american_lightregular';
	border-bottom: solid 1px #9da6ab;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	height: 5.3em;/* is equal to '.passenger > div' ceal(fontsize) */
}
.passenger-list .passenger:first-child {
}
.passenger-list .passenger.pressed {
	box-shadow: inset 0 1px 4px 1px RGBA(0,0,0,.8);
}
.passenger-list .passenger > div {
	vertical-align: text-top;
	display: inline-table;
	font-size: 1.6em;
	color: #36495a;
	height: 100%;
}
.passenger-list .passenger div.tick {
	width: 13%;
}
.passenger-list .passenger > div.name {
	width: 87%;
}
.passenger-list .passenger > div.name div {
	width: 100%;
	height: 100%;
	display: table-cell;
	vertical-align: middle !important;
}
.passenger-list .passenger.selected div.tick {
	background: url(../images/tick.png) no-repeat center;
	background-size: contain;
}







/*=====================================================================================================
                                        BAG STATUS SCREEN STYLES
=====================================================================================================*/
.top-holder {
	width: 100%;
	margin: 0;
	padding: 0 0 2% 0;
	background: #eaecec;
	box-shadow: 0 6px 5px 0 RGBA(0,0,0,.5);
}
.counter-holder {
	width: 90%;
	margin: auto;
	vertical-align: middle;
}
.counter-holder div.counter {
	width: 6.5em;
	display: inline-block;
	-webkit-border-radius: .4em;
	border-radius: .4em;
	box-shadow: inset 0 0 1px 0 RGBA(0,0,0,1);
	font-family: 'americansansregular';
	font-size: 1.18em;
	line-height: 2.1em;
	color: #36495a;
	margin: 0 .4em 0 0;
	overflow: hidden;
}
.counter-holder div.counter span {
	display: inline-block;
	width: 2em;
	margin: 0 .3em 0 0;
	font-family: 'americansans_mediumregular';
	text-align: center;
	color: #fff;
	border: none;
	-webkit-border-radius: .4em 0 0 .4em;
	border-radius: .4em 0 0 .4em;
	box-shadow: inset 0 0 2px 1px RGBA(0,0,0,.5);
}
.counter-holder div.counter.active span { background: #00b989; }
.counter-holder div.counter.inactive span { background: #f52305; }
.counter-holder div.counter.total span { background: #ffffff;color: #36495a; }

.pax-list-scroll {
	display: none;
	text-align: right;
	font-size: 1em;
}
.pax-list-scroll p {
	height: 3em;
	display: inline-block;
	text-align: center;
	line-height: 3.3em;
	color: #36495a;
	font-family: 'american_lightregular';
}
.pax-list-scroll .button {
	display: none;
	height: 3.3em;
	width: 3.3em;
	box-shadow: 0 1px 2px 0 RGBA(0,0,0,1);
	border-radius: .4em;
	margin: 0 0 0 5px;
	vertical-align: top;
}
.pax-list-scroll .button.up.pressed, .pax-list-scroll .button.dw.pressed {
	box-shadow: inset 0 1px 2px 0 RGBA(0,0,0,1);
}
.pax-list-scroll .button.up {
	background: url(../images/nav-arrow-up.png) no-repeat center, #62b0e2;
	background-size: 76%;
}
.pax-list-scroll .button.dw {
	background:  url(../images/nav-arrow-down.png) no-repeat center, #62b0e2;
	background-size: 76%;
}
.pax-list-scroll .button.up.disabled {
	background: url(../images/nav-arrow-up.png) no-repeat center, #a2d5f3;
	background-size: 76%;
	box-shadow: none;
}
.pax-list-scroll .button.dw.disabled {
	background:  url(../images/nav-arrow-down.png) no-repeat center, #a2d5f3;
	background-size: 76%;
	box-shadow: none;
}
/** ------------------------------------------------------------------------------------------------------
------------------------------------------PASSENGER BAG LIST VIEW--------------------------------------- */
.pbags-list-area {
	width: 90%;
	margin: 0 auto 1em;
}
.passenger-box {
	display: block;
	width: 100%;
	background: #ffffff;
	-webkit-border-radius: .5em;
	overflow: hidden;
	box-shadow: 0 0 8px 1px RGBA(0,0,0,.7);
	margin: 0 0 2em;
	border: solid 1px #ffffff;
	border-radius: .5em;
}
.passenger-box > div { }
.passenger-box > div.passenger-info {
	width: 100%;
	height: 5.5em;
	display: inline-table;
	border-radius: .5em .5em 0 0;
	vertical-align: middle;
	padding: 0 0 0 0;
}
.passenger-info .box-l, .passenger-info .box-r {
	display: table-cell;
	height: 100%;
}
.passenger-info .box-l {
	width: 80%;
	vertical-align: top; 
	padding: 0 0 2% 3%;
}
.passenger-info .box-r {
	width: 20%;
	text-align: right;
	vertical-align: middle;
	padding: 0 3% 0 0;
}

.passenger-info .box-l p {
	display: inline-block;
	font-family: 'americansansregular';
	color: #006bbb;
	width: 100%;
	padding: 0;
	margin: 0;
}



.passenger-info .pax-details div{ 
	float: left;
	padding: 0;
	margin: 0;
}


.passenger-info .pax-details .details-l{ 
	vertical-align: top;
	padding: 0;
	margin: 0;
	max-width: 60%
}

.passenger-info .pax-details .iti { 
	float: right;
	padding: 0 0.3em 0 0;
	margin: 0;
	width: 2.7em;
}

.passenger-info .pax-details .iti-img { 	
    height: 1.5em;
    width: 2.5em;
}

.passenger-info .box-l p.pname {
	font-size: 1.7em;
	color: #006bbb;
	margin: 6px 0 -2px 0;
	text-transform: uppercase;
	width: 100%;
	/*fix the height, wrap the text, hide the over flow.
	This way the passenger name if bigger then the additional text willbe hidden.*/
	overflow: hidden;
	-white-space: nowrap;
	word-break: break-all;
	text-overflow: ellipsis;
}
.passenger-info .box-l p.infotext {
	font-size: .9em;
	color: #576776;
	width: 100%;
}
.passenger-info .box-l .pseat, .passenger-info .box-r .pseat {
	font-family: 'americansansregular';
	font-size: 1.2em;
	text-align: left;
	color: #006bbb;
}
.passenger-info .box-l .pseat {
	display: none; 
	font-family: 'americansansregular';
}
.passenger-info .tier-stripe {
	height: .4em;
	-webkit-border-radius: 2px;
	border-radius: 2px;
}

/* TIER & PRIORITY STYLES.
This section defines the color themes for top-tier and priority access customenrs.
These colors will be applied based on the passenger tier and priority stauts.
While creating the passenger box the releated tier and priority class names will be applied.*/
.passenger-box.adv-explat .tier-stripe, .passenger-box.adv-gold .tier-stripe,
.passenger-box.adv-platinum .tier-stripe, .passenger-box.adv-nontier .tier-stripe {
	margin: 0 0 .4em 0;
}
.passenger-box.adv-explat .tier-stripe {
	background: #000000; /* Old browsers */
	background: -moz-linear-gradient(left,  #000000 0%, #515151 15%, #c7c8ca 26%, #000000 46%, #444444 49%, #717171 63%, #000000 79%, #626262 80%, #505050 91%, #000000 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#000000), color-stop(15%,#515151), color-stop(26%,#c7c8ca), color-stop(46%,#000000), color-stop(49%,#444444), color-stop(63%,#717171), color-stop(79%,#000000), color-stop(80%,#626262), color-stop(91%,#505050), color-stop(100%,#000000)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #000000 0%,#515151 15%,#c7c8ca 26%,#000000 46%,#444444 49%,#717171 63%,#000000 79%,#626262 80%,#505050 91%,#000000 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #000000 0%,#515151 15%,#c7c8ca 26%,#000000 46%,#444444 49%,#717171 63%,#000000 79%,#626262 80%,#505050 91%,#000000 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #000000 0%,#515151 15%,#c7c8ca 26%,#000000 46%,#444444 49%,#717171 63%,#000000 79%,#626262 80%,#505050 91%,#000000 100%); /* IE10+ */
	background: linear-gradient(to right,  #000000 0%,#515151 15%,#c7c8ca 26%,#000000 46%,#444444 49%,#717171 63%,#000000 79%,#626262 80%,#505050 91%,#000000 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=1 ); /* IE6-9 */
}
.passenger-box.adv-gold .tier-stripe {
	background: #786931; /* Old browsers */
	background: -moz-linear-gradient(left,  #786931 0%, #fff4dc 7%, #fff4dc 29%, #73652b 62%, #fff4dc 88%, #73652b 96%, #786931 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#786931), color-stop(7%,#fff4dc), color-stop(29%,#fff4dc), color-stop(62%,#73652b), color-stop(88%,#fff4dc), color-stop(96%,#73652b), color-stop(100%,#786931)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #786931 0%,#fff4dc 7%,#fff4dc 29%,#73652b 62%,#fff4dc 88%,#73652b 96%,#786931 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #786931 0%,#fff4dc 7%,#fff4dc 29%,#73652b 62%,#fff4dc 88%,#73652b 96%,#786931 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #786931 0%,#fff4dc 7%,#fff4dc 29%,#73652b 62%,#fff4dc 88%,#73652b 96%,#786931 100%); /* IE10+ */
	background: linear-gradient(to right,  #786931 0%,#fff4dc 7%,#fff4dc 29%,#73652b 62%,#fff4dc 88%,#73652b 96%,#786931 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#786931', endColorstr='#786931',GradientType=1 ); /* IE6-9 */
}
.passenger-box.adv-platinum .tier-stripe {
	background: #fdfdfd; /* Old browsers */
	background: -moz-linear-gradient(left,  #fdfdfd 0%, #e7e8e8 15%, #c7c8ca 26%, #fdfdfd 46%, #e7e8e8 52%, #c7c8ca 63%, #f1f1f1 79%, #c7c8ca 80%, #d8dada 97%, #fdfdfd 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#fdfdfd), color-stop(15%,#e7e8e8), color-stop(26%,#c7c8ca), color-stop(46%,#fdfdfd), color-stop(52%,#e7e8e8), color-stop(63%,#c7c8ca), color-stop(79%,#f1f1f1), color-stop(80%,#c7c8ca), color-stop(97%,#d8dada), color-stop(100%,#fdfdfd)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #fdfdfd 0%,#e7e8e8 15%,#c7c8ca 26%,#fdfdfd 46%,#e7e8e8 52%,#c7c8ca 63%,#f1f1f1 79%,#c7c8ca 80%,#d8dada 97%,#fdfdfd 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #fdfdfd 0%,#e7e8e8 15%,#c7c8ca 26%,#fdfdfd 46%,#e7e8e8 52%,#c7c8ca 63%,#f1f1f1 79%,#c7c8ca 80%,#d8dada 97%,#fdfdfd 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #fdfdfd 0%,#e7e8e8 15%,#c7c8ca 26%,#fdfdfd 46%,#e7e8e8 52%,#c7c8ca 63%,#f1f1f1 79%,#c7c8ca 80%,#d8dada 97%,#fdfdfd 100%); /* IE10+ */
	background: linear-gradient(to right,  #fdfdfd 0%,#e7e8e8 15%,#c7c8ca 26%,#fdfdfd 46%,#e7e8e8 52%,#c7c8ca 63%,#f1f1f1 79%,#c7c8ca 80%,#d8dada 97%,#fdfdfd 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdfdfd', endColorstr='#fdfdfd',GradientType=1 ); /* IE6-9 */
}
.passenger-box.adv-nontier .tier-stripe {
	background: #69c2f3; /* Old browsers */
	background: -moz-linear-gradient(left,  #69c2f3 0%, #0084cd 15%, #00649d 26%, #69c2f3 46%, #0084cd 52%, #00649d 63%, #69c2f3 79%, #00649d 80%, #0084cd 94%, #69c2f3 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#69c2f3), color-stop(15%,#0084cd), color-stop(26%,#00649d), color-stop(46%,#69c2f3), color-stop(52%,#0084cd), color-stop(63%,#00649d), color-stop(79%,#69c2f3), color-stop(80%,#00649d), color-stop(94%,#0084cd), color-stop(100%,#69c2f3)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  #69c2f3 0%,#0084cd 15%,#00649d 26%,#69c2f3 46%,#0084cd 52%,#00649d 63%,#69c2f3 79%,#00649d 80%,#0084cd 94%,#69c2f3 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  #69c2f3 0%,#0084cd 15%,#00649d 26%,#69c2f3 46%,#0084cd 52%,#00649d 63%,#69c2f3 79%,#00649d 80%,#0084cd 94%,#69c2f3 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  #69c2f3 0%,#0084cd 15%,#00649d 26%,#69c2f3 46%,#0084cd 52%,#00649d 63%,#69c2f3 79%,#00649d 80%,#0084cd 94%,#69c2f3 100%); /* IE10+ */
	background: linear-gradient(to right,  #69c2f3 0%,#0084cd 15%,#00649d 26%,#69c2f3 46%,#0084cd 52%,#00649d 63%,#69c2f3 79%,#00649d 80%,#0084cd 94%,#69c2f3 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#69c2f3', endColorstr='#69c2f3',GradientType=1 ); /* IE6-9 */
}
/*----------------- PASSENGER BAG ROW ------------------ */
.bags-wrapper {
	
}
.bags-holder { font-size: 1.3em; }
.bags-wrapper .bag-scroll-left, .bags-wrapper .bag-scroll-right { display: none; }
.bagstatus-bag {	
	color: #fff;
	display: table;
	width: 100%;
	border-top: solid 1px #eaeaea;
}
.bagstatus-bag.pressed {
	box-shadow: inset 0 2px 5px 0 rgba(0,0,0,1);
}
.bagstatus-bag:last-child {
	/*Overriding in Mobile css files.*/
}
.bagstatus-bag.active { background: #00b989; }
.bagstatus-bag.inactive { background: #f52305; }
.bagstatus-bag.drmode { background: #9da6ab; }
.bagstatus-bag.drmode.active { background: #00b989; }

.bagstatus-bag .bag {
	display: table-cell;
	font-size: 1em;
	width: 3.3em;
	height: 3em;
	border-right: solid 1px #eaeaea;
	background: url(../images/bagIcon.png) no-repeat center;
	background-size: 61%;
}
.bagstatus-bag .scode, .bagstatus-bag .middle, .bagstatus-bag .status, .bagstatus-bag .pstatus {
	display: table-cell;
	vertical-align: top;
	font-size: 1em;
	height: 3em;
}
.bagstatus-bag .scode {
	font-family: 'americansansregular';
	padding: .4em 0 0 .5em;	
}
.bagstatus-bag .middle { padding: .4em 0 0 0; }
.bagstatus-bag .middle .city, .bagstatus-bag .middle .bagno {
	font-family: 'americansansregular';
	padding: 0 0 .4em 0;	
}
.bagstatus-bag .status {
	width: 2em;
	vertical-align: middle;
	text-align: center;
	margin: 0;
	padding: 0;
}
.bagstatus-bag .status p {
	font-family: 'americansans_mediumregular';
	font-size: 1.75em;
}

.bagstatus-bag .pstatus {
	width: 1.8em;
	height: 3em;
	vertical-align: middle
}
.bagstatus-bag .pstatus div {
	font-family: 'americansans_mediumregular';
	font-size: 1em;
	text-align: center;
	width: 100%;
	height: 80%;
	line-height: 2.2em;
	-webkit-border-radius: .3em 0 0 .3em;
	border-radius: .3em 0 0 .3em;
}
.bagstatus-bag.active .status .s-a { display: inline; }
.bagstatus-bag.active .status .s-i { display: none; }
.bagstatus-bag.active .status .s-d { display: none; }

.bagstatus-bag.inactive .status .s-a { display: none; }
.bagstatus-bag.inactive .status .s-i { display: inline; }
.bagstatus-bag.inactive .status .s-d { display: none; }

.bagstatus-bag.drmode .status .s-a { display: none; }
.bagstatus-bag.drmode .status .s-i { display: none; }
.bagstatus-bag.drmode .status .s-d { display: inline; }

.bagstatus-bag.drmode.active .status .s-a { display: inline; }
.bagstatus-bag.drmode.active .status .s-i { display: none; }
.bagstatus-bag.drmode.active .status .s-d { display: none; }

.bagstatus-bag.priority .pstatus div, .bagstatus-bag.standby .pstatus div {
	border: solid 1px #E4E4E4;
	border-style: solid none solid solid;	
}
.bagstatus-bag.priority .pstatus div {
	background: url(../images/int-priority.png) center no-repeat, #FE6F07;
	background-size: contain;
}
.bagstatus-bag.standby .pstatus div { background: #FF01BD; }
/* TIER & PRIORITY STYLES. */


.standardInput.bagtag {
	margin: 0 auto 1.2em;	
}
.numberpad-searchBagTag {
	display: none;	
}