/*general instructions:

- check all 13 included .htm pages in several browsers
- modify only this page, no modifications to the .htm will be accepted
- conform to CSS level 1 tags for best results
- some classes here may not be perfectly represented in the included .htm files,
so make changes using 'search and replace' so you change all instances of a color
to your color, or font to your font.  Then a seldom used class will still match, if it is triggered
in the application.
*/


/* Set background color */
body { background-color: #ffffff; }

/* General text using in XQuote, paragraphs, table cells, and lists default to this text. */
#xquote, #xquote p, #xquote td, .xQuote li {
	font-family: verdana, sans-serif;
	font-size: 10px;
}

/* The next three styles define the link, visited link, and hover link colors within XQuote */
#xquote a:link { color: #cc3300; }
#xquote a:visited { color: #996633; }
#xquote a:hover { color: #ff6633; }

/* Unordered list margins */
#xquote ul {
	margin-bottom: 0px;
}

/* XQuote h1 style, used for header on each page.  e.g. "Select Aircraft", "Build Itinerary" */
#xquote h1 {
	font-weight: bold;
	margin-bottom: 4px;
	margin-top: 23px;
	font-size: 18px;
	color: #993300;	
}

/* Smaller header, used for company name on last 3 steps, select aircraft,
trip details, confirmation */
#xquote h3 {
	font-size: 14px;
	margin-bottom: 0px;
}

/* Header used for company names on Choose Operator page.  Not used if Choose Operator step is not in your XQuote. */
#xquote h4 {
	font-size: 14px;
	margin: 0px;
	color: #993300;	
}

/* XQuote table header style, used on headers of small tables.  e.g. total flight time on select aircraft page. */
#xquote th {
	font-weight: bold;
	text-align: left;
	font-size: 10px;
	background-color: #e5e5e5;
}


/* Line style used in select aircraft, confirmation, trip details screens */
#xquote hr {
	color: #666666;
	height: 1px;
}

#xquote #xquoteHeader {
	font-weight: bold;
}

#xquote #stepSummary {
	width: 180px;
	padding: 10px 0px 10px 10px;
	float: left;
}

#xquote 
{
	width: 700px;
}

#xquote #mainContent {
	width: 500px;
	float: left;
	margin: 10px 0px 10px 10px;
}

#xquote .formLabel 
{
	font-weight: bold; 
	display: inline;
}

/* Used for inactive summary buttons in the trip builder on the left of the page.  (E.g., "Change Itinerary") */
#xquote .summary_button_off { 
	background-image: url('/images/quote/vanilla/btn_summary_off.gif');
	background-repeat: no-repeat;
	background-color: transparent;
	border: 0px;
	width: 139px;
	height: 18px;
	text-align: left;
	color: #cccccc; 
	font-size: 9px;
	font-weight: bold;
	font-family: verdana, arial, helvetica, sans;
	padding-top: 2px;
	padding-left: 19px;
	text-decoration: none;
}

/* Used for ACTIVE summary buttons in the trip builder on the left of the page (E.g., "Change Itinerary") */
#xquote .summary_button { 
	background-image: url('/images/quote/vanilla/btn_summary.gif');
	background-repeat: no-repeat;
	background-color: transparent;
	border: 0px;
	width: 139px;
	height: 18px;
	text-align: left;
	color: #ffffff; 
	font-size: 9px;
	font-weight: bold;
	font-family: verdana, arial, helvetica, sans;
	padding-top: 2px;
	padding-left: 19px;
	cursor: pointer; cursor: hand;
	text-decoration: none;
}

/* The next three classes define the link color for the ACTIVE summary buttons */
#xquote .summary_button a:link { color: #ffffff; text-decoration: none; }
#xquote .summary_button a:hover { color: #ffffff; text-decoration: none; }
#xquote .summary_button a:visited { color: #ffffff; text-decoration: none; }


/* The next several styles define continue buttons of varying widths (e.g., "Select & Continue") */
#xquote .wideButton {
	background-image: url('/images/quote/vanilla/btn_continue_wide.gif');
	background-repeat: no-repeat;
	background-color: transparent;
	border: 0px;
	width: 240px;
	height: 19px;
	text-align: center;
	color: #ffffff; 
	font-size: 9px;
	font-weight: bold;
	font-family: verdana, arial, helvetica, sans;
	cursor: pointer; cursor: hand;
	text-decoration: none;
}

#xquote .wideButton a:link { color: #ffffff; text-decoration: none; }
#xquote .wideButton a:hover { color: #ffffff; text-decoration: none; }
#xquote .wideButton a:visited { color: #ffffff; text-decoration: none; }

#xquote .mediumButton {
	background-image: url('/images/quote/vanilla/btn_continue_med.gif');
	background-repeat: no-repeat;
	background-color: transparent;
	border: 0px;
	width: 215px;
	height: 19px;
	text-align: center;
	color: #ffffff; 
	font-size: 9px;
	font-weight: bold;
	font-family: verdana, arial, helvetica, sans;
	cursor: pointer; cursor: hand;
	text-decoration: none;
}

#xquote .mediumButton a:link { color: #ffffff; text-decoration: none; }
#xquote .mediumButton a:hover { color: #ffffff; text-decoration: none; }
#xquote .mediumButton a:visited { color: #ffffff; text-decoration: none; }

#xquote .narrowButton {
	background-image: url('/images/quote/vanilla/btn_continue_narrow.gif');
	background-repeat: no-repeat;
	background-color: transparent;
	border: 0px;
	width: 177px;
	height: 19px;
	text-align: center;
	color: #ffffff; 
	font-size: 9px;
	font-weight: bold;
	font-family: verdana, arial, helvetica, sans;
	cursor: pointer; cursor: hand;
	text-decoration: none;
}

#xquote .narrowButton a:link { color: #ffffff; text-decoration: none; }
#xquote .narrowButton a:hover { color: #ffffff; text-decoration: none; }
#xquote .narrowButton a:visited { color: #ffffff; text-decoration: none; }


/* Defines the style of the Add and Remove leg buttons on the itinerary page */
#xquote .itineraryLegButton { 
	width: 130px;
	background-color: #cccc99;
	text-align: center;
	border: 1px solid #333333;
	color: #ffffff;
	padding: 1px;
	cursor: pointer; cursor: hand;
	margin-left: 6px;
	margin-top: 1px;
	text-decoration: none;
}

/* Defines the style of the print button on the confirmation page. */
#xquote .printbutton {
	width: 80px;
	background-color: #cccc99;
	text-align: center;
	border: 1px solid #333333;
	color: #ffffff;
	padding: 1px;
	cursor: pointer; cursor: hand;
	margin-left: 6px;
	margin-top: 1px;
	font-weight: bold;
	text-decoration: none;
}

/* Used when XQuote needs to display an error.  Login failure, for instance. */
#xquote .errorMessage, #xquote .errorMessage li {
	color: #cc6600;
	font-weight: bold;
}

#xquote .errorRow, #xquote .errorRow td
{
	color: #cc6600;
}

#xquote .errorField
{
	background-color: #ffcc99;
}

/* Used as a solid colored bar on most pages. This should be the darkest of the main colors used on your web site. */
#xquote .darkBG {
	background-color: #333333;
	color: #f1f1f1;
	font-weight: bold;
}

/* Used as narrower light solid bar.  This should be the lightest of the main colors used on your web site. */
#xquote .lightBG {
	background-color: #cccccc;
	font-weight: bold;
	margin-top: 2px;
	margin-bottom: 2px;
}

/* Light grey table row background, used above itinerary display on pages after step 1. */
#xquote .lightGray {
	background-color: #f1f1f1;
}

/* Background color behind itinerary on confirmation screen */
#xquote .darkGray {
	background-color: #e5e5e5;
}

/* Used only if you advertise brokers.  This is the box surrounding the featured broker listing. */
#xquote .featuredBrokerHeader {
	background-color: #333333;
	font-size: 12px;
	font-weight: bold;
	color: #ffffff;
	padding: 8px;
}

/* Used only if you advertise brokers.  Defines style for "Too many choices?  A broker can help" text. */
div.featuredBrokerHeaderText {
	width: 100%; 
	font-size: 12px; 
	color: #ffffff; 
	Filter: Shadow(Color=#666666, Direction=140, strength=2);
}

/* Used for text next to icons, such as "Aircraft Photos" or "Online Quotes" */
#xquote .iconText {
	font-size: 11px;
	font-weight: bold;
	font-family: arial-narrow, arial, helvetica;
	color: #666666;
	letter-spacing: .5px;
}

/* Used to define borders around tables where user input is required.  e.g. registration page, build itinerary page */
#xquote .userInput {
	border-top: 1px solid #993300;
	border-bottom: 1px solid #993300;
	border-left: 2px solid #993300;
	border-right: 2px solid #993300;
	font-weight: bold;
	margin: 2px 0px 2px 0px;
	width: 100%;
}

/* Further modifies above userInput to add a background color to table cells in tables with the userInput class */
#xquote .userInput td { 
	background-color: #f1f1f1; 
}

/* Defines borders and margins for tables not requiring user input.
Used on most screens. */
#xquote .nonInput {
	border-top: 1px solid #993300;
	border-bottom: 1px solid #993300;
	border-left: 2px solid #993300;
	border-right: 2px solid #993300;
	margin: 2px 0px 2px 0px;
	width: 100%;
}

/* Instruction over left column of information tracking.  Usually style for 'Track Your Progress'. Used on most screens. */
#xquote .instructionHeader {
	font-weight: bold;
	color: #333333;
	font-size: 11px;
}

/* Defines margin for general page instruction text.  On top of all pages. */
#xquote .instructions {
	margin: 5px;
}

/* Used for 'Number of passengers' on Itinerary page */
#xquote .largeText {
	font-size: 11px;
}

/* Table style for pricing information on Choose Category page */
#xquote #priceTable {
	border-top: 1px solid #666666;
	border-right: 1px solid #666666;
}

/* Further modifies above priceTable style for table headers. */
#xquote #priceTable th {
	border-bottom: 1px solid #666666;
	border-left: 1px solid #666666;
	text-align: center;
}

/* Further modifies above priceTable style for table cells */ 
#xquote #priceTable td {
	border-bottom: 1px solid #666666;
	border-left: 1px solid #666666;
	text-align: center;
}

/*
Used on step one of XQuote, for table that shows airport choices, when more than one matches a user request.
*/
#xquote #clarifyAirportsTable {
	border-bottom: 1px solid #99cccc;
	border-left: 1px solid #99cccc;
	border-right: 1px solid #99cccc;
	margin: 5px;
	width: 90%;
	align: center;
}

/* Cells in clarifyAirportsTable above get this style */
#xquote .borderedCell {
    	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
	background-color: #f1f1f1;
}

/* Used on aircraft select table, shown when itinerary is displayed for a given aircraft */
#xquote .aircraftItineraryTable th {
	text-align: left;
}

/* Used on aircraft select table, shown when itinerary is displayed for a given aircraft */
#xquote .aircraftItineraryTable td {
	border-bottom: 1px solid #e5e5e5;
}

/* Used on aircraft select table, shown when itinerary is displayed for a given aircraft */
#xquote .aircraftItineraryTable {
	border-left: 1px solid #e5e5e5;
	border-right: 1px solid #e5e5e5;
}

/* Defines small 'search results' table style for each vendor on Choose Operator page */
#xquote .vendorAircraftResults {
	padding: 2px;
	border: 1px solid #333333;
	width: 140px;
}

/* Extends vendorAircraftResults, adding details for table header on small 'search results' table style.  Used for each vendor on Choose Operator page */
#xquote .vendorAircraftResults th {
	background-color: #333333;
	color: #ffffff;
	padding: 1px;
	font-weight: bold;
}

/* Used to highlight the 'choose' instruction on Build Itinerary screen */
#xquote .highlight {
    	color: #cc0000;
}

/* Style for headers in the left column 'trip summary'.  e.g. 'AIRCRAFT CATEGORY'.  Used on each page that shows the trip summary on left, for each page that's been completed. */
#xquote .tripSummaryHeader_top {
	background-color: #666666;
	font-weight: bold;
	color: #cccccc;
	width: 100%;
}

/* background color for bottom of trip summary table, on left of each XQuote screen */
#xquote .tripSummaryHeader_bottom {
	background-color: #cccccc;
}

/* Used on left side 'trip summary' section, for headers that are greyed out because they are for a future step.  All pages that show 'trip summary' use this. */
#xquote .tripSummaryHeader_blank_top {
	background-color: #e5e5e5;
	color: #999999;
	font-weight: bold;
	width: 100%;
}

/* Also used on each 'trip summary' left column display. Used on all pages. */
#xquote .tripSummaryHeader_blank_bottom {

	background-color: #f1f1f1;
}

/* Used on tables on left column 'trip summary section' that have not been completed yet. 'Greyed out tables' on all pages. */
#xquote .tripSummarySegment {
	border-left: 4px solid #cccccc;
	border-right: 4px solid #cccccc;
	border-bottom: 15px solid #cccccc;
	margin-bottom: 5px;
	width: 100%;
}

/* Used on the left column 'trip summary' tables. All pages. */
#xquote .tripSummarySegment_blank {
	border-left: 4px solid #f1f1f1;
	border-right: 4px solid #f1f1f1;
	border-bottom: 15px solid #f1f1f1;
	margin-bottom: 5px;
	width: 100%;
}

/* Used as style for completed user information on left column 'Trip Summary' table cells. Used on all pages. */
#xquote .tripSummary_itineraryLight {
	background-color: #f1f1f1;
}

/* Used as style for type of user information on left column 'Trip Summary' table cells. e.g. 'from' 'to'.  Used on all pages. */
#xquote .tripSummary_itineraryDark {
	background-color: #e5e5e5;
}

/* Used where user selected trip type shows up in left column 'trip summary' e.g. multi-leg, one-way. Used on all pages. */
#xquote .tripSummary_itineraryTripType {
	color: #666666;
	font-weight: bold;
}

/* Used to create horizontal line next to user selected trip type
used on all pages */
#xquote .strikethrough {
	text-decoration: line-through;
}

/* When a broker is displayed with category results, this adds some padding */
#xquote .brokerSearchResult {
	padding-left: 8px;
	padding-right: 8px;
	padding-bottom: 8px;
}

/* Border definition for broker result */
#xquote .brokerResultTable {
	border-left: 3px solid #333333;
	border-right: 3px solid #333333;
	border-bottom: 3px solid #333333;
}

/* Background color for broker result */
#xquote .brokerResultTableImage {
	background-color: #333333;
}

/* Start Over and Quit header navigation, used on all pages */
#xquote .headerNav { margin-bottom: 2px; }

/* Start Over and Quit header navigation, used on all pages */
#xquote .headerNav, #xquote .headerNav a:link, #xquote .headerNav a:visited {
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
	padding-right: 5px;
}

/* Start Over and Quit header navigation, used on all pages */
#xquote .headerNav a:hover {
	background-color: #cc0000;
}

/* Copyright, email, phone footer on each page */
#xquote .footer
{	color: #666666;
	padding: 5px;
}

/* link definition for footer */
#xquote .footer a:hover {
	background-color: #cc0000;
}

/* Aircraft type and name display on Select Aircraft and Confirmation screens. */
#xquote .bigBoldText {
	font-weight: bold;
	font-size: 12px;
}

/* Name of category on Choose Category page (e.g., 'Heavy Jets') */
#xquote .categoryNameHeader {
	color: #cc3300;
	font-weight: bold;
	font-size: 14px;
}

/* Link colors for above category names */
#xquote .categoryNameHeader a:link, #xquote .categoryNameHeader a:visited {
	color: #cc3300;
}

/* Style for 'page loading' interim page.  Shows between pages that take more than a few seconds to load */
#xquote #loading { 
	visibility: hidden; 
	position: absolute;
	font-weight: bold;
	font-size: 1.2em;
	padding: 30px;
	margin-left: 75px;
	margin-top: 100px;
	width: 500px;
}




/*-----------------------------
     OPERATOR LISTING STYLES
-----------------------------*/

/*
These styles are used on the 'more info about this operator' pop-up page.
Called 'OperatorDetail.htm' in the style guide.
This is usually only used by channels, showing multiple companies.
You can ignore this if you are not going to use the optional step: 'Select Operator'
*/

/* name of operator */
.operator_busname {
	font-size: 15px;
	font-weight: bold;
	text-transform: uppercase;
    	color: #333333;
	margin-top: 10px;
}

/* margin */
.operator_long_ple_text {
	margin: 3px;
}

/* currently unused */
.operator_get_quote_button {
	left: 300px;
	width: 125px;
	height: 50px;
	text-align: right;
	float: right;
	vertical-align: text-top;
	vertical-space: 50px;
	margin-top: 3px;
	margin-right: 5px;
}

/* horizontal rule across top */
.operator_standard_hr {	
    	border: 1px solid #cccccc;
   	margin: 3px;
    	width: 100%;
    	position: relative;
    	height: 0px;
}

/* currently unused */
.operator_offices_head_frame {
   	border: 2px solid #cccccc;
	height: 23px;
	margin-left: 2px;
	margin-right: 2px;
	margin-top: 6px;
	margin-bottom: 0px;
	text-align: center;
}
 
/* style definition of the DIV around fleet */
.operator_fleet_head_frame {
	border: 2px solid #cccccc;
	height: 25px;
	padding-bottom: 2px;
	margin: 3px 2px;
	margin-top: 4px;
	text-align: center;
}

/* style of DIV around offices */
.operator_offices_holder_frame {
	border: 2px solid #cccccc;
	padding-bottom: 4px;
	padding-left: 7px;
	margin: 3px 2px;
	line-height: 14px;
	text-align: left;
}
 
/* DIV around 'offices' graphic */
.operator_sections_graphic {
	float: left;
	margin-top: 5px;
	margin-left: 7px;
	vertical-space: 23px;
}

/* style for URL */
.operator_url {
	padding-top: 4px;
	text-align: center;
}
 
/* DIV around the 'online quoting' graphic */
.operator_onlinequoting_graphic {
	float: right;
	margin-right: 30px;
	width: 104px;
	height: 23px;
}

/* style for DIV around 'established', 'fleet', and 'pilots'. */
.operator_standard_row {
	margin: 4px 2px;
	line-height: 16px;
}

/* currently unused */
.operator_text_left {
	text-align: left;
}

/* currently unused */
.operator_text_right {
	text-align: right;
}

/* currently unused */
.operator_text_bold {
    	font-weight: bold;
}

/* DIV around base information */
.operator_base {
	margin-top: 6px;
	margin-bottom: 10px;
}

/* style for base location (city, state) */
.operator_base_location {
	font-weight: bold;
	text-transform: uppercase;
}

/* style for base details (address) */
.operator_base_info {
	text-transform: uppercase;
}


/* style for table containing all aircraft for operator */
.operator_ac_table {
	margin-bottom: 6px;
	position: relative;
	width: 404px;
	vertical-align: top;
	line-height: 12px;
}

/* table row for border in first row of aircraft table */	
.operator_ac_border_row {
	vertical-align: top;
}

/* colored line separating border row from column headers */
.operator_ac_top_border_cell {
	border-bottom: 2px solid #333333;
	width: 404px;
}

/* style for line below header names on aircraft table */
.operator_ac_bottom_border_cell {
	border-top: 2px solid #333333;
	border-bottom: 2px solid #ffffff;
	width: 404px;
}

/* Row containing column headers of aircraft */
.operator_ac_header_row {
	height: 22px;
	vertical-align: top;
	font-weight: bold;
	font-size: 9px;
}

/* first column header, # of aircraft type */
.operator_ac_count_header {
	position: relative;
	width: 5%;
	vertical-align: middle;
	text-align: center;
	font-weight: bold;
	border-top: 3px solid #ffffff;
	border-bottom: 3px solid #ffffff;
}

/* style for 'seats' column */
.operator_ac_ten_header {
	position: relative;
	width: 10%;
	vertical-align: middle;
	text-align: left;
	font-weight: bold;
	border-top: 3px solid #ffffff;
	border-bottom: 3px solid #ffffff;
}

/* style for 'type' column */
.operator_ac_fifteen_header {
	position: relative;
	width: 15%;
	vertical-align: middle;
	text-align: left;
	font-weight: bold;
	border-top: 3px solid #ffffff;
	border-bottom: 3px solid #ffffff;
}

/* style for 'category' column */
.operator_ac_twenty_header {
	position: relative;
	width: 20%;
	vertical-align: middle;
	text-align: left;
	font-weight: bold;
	border-top: 3px solid #ffffff;
	border-bottom: 3px solid #ffffff;
}

/* style for 'category name' column */
.operator_ac_twentyfive_header {
	position: relative;
	width: 25%;
	vertical-align: middle;
	text-align: left;
	font-weight: bold;
	border-top: 3px solid #ffffff;
	border-bottom: 3px solid #ffffff;
}

/* style for last header column 'price range/hr' */
.operator_ac_last_header {
	position: relative;
	width: 15%;
	vertical-align: middle;
	text-align: left;
	font-weight: bold;
	border-top: 3px solid #ffffff;
	border-bottom: 3px solid #ffffff;
	padding-right: 6px;
	padding-left: 3px;
}

/* style for row for instance of aircraft */
.operator_ac_row {
	height: 12px;
	padding-right: 2px;
	vertical-align: top;
	font-weight: bold;
	background-color: #ededed;
	border-top: 2px solid #ffffff;
}

/* style for aircraft type, count of that type */
.operator_ac_count_cell {
	width: 5%;
	vertical-align: middle;
	text-align: center;
	border-top: 2px solid #ffffff;
	font-weight: normal;
}

/* seats in aircraft */
.operator_ac_ten_cell {
	width: 10%;
	vertical-align: middle;
	text-align: left;
	font-weight: normal;
	border-top: 2px solid #ffffff;
}

/* aircraft type */
.operator_ac_fifteen_cell {
	width: 15%;
	vertical-align: middle;
	text-align: left;
	font-weight: normal;
	border-top: 2px solid #ffffff;
}

/* category pop-up links */
.operator_ac_twenty_cell {
	width: 20%;
	vertical-align: middle;
	text-align: left;
	font-weight: normal;
	border-top: 2px solid #ffffff;
}

/* common name */
.operator_ac_twentyfive_cell {
	width: 25%;
	vertical-align: middle;
	text-align: left;
	font-weight: normal;
	border-top: 2px solid #ffffff;
}

/* price in $/hr */
.operator_ac_last_cell {
	vertical-align: middle;
	text-align: left;
	font-weight: normal;
	border-top: 2px solid #ffffff;
	padding-right: 6px;
	padding-left: 3px;
}

/* class for href of category name to pop up */
.operator_ac_categary_name {
	color: #333333;
	cursor: pointer; cursor: hand;
}

/* class on actual href for opuerator url */
.operator_link {
	cursor: pointer; cursor: hand;
	color: #cc3300;
	text-decoration: underline;
}

/*------------------------------------
  BROKER AND DETAIL STYLES 
------------------------------------*/

/*
These styles are used for the 'more info about this broker' link
This section doesn't apply to you if you are not allowing broker's
to be represented on your XQuote
*/

.brokerListing {
	font-size: 10px;
}

/* border around broker's logo */
.brokerDetail_logoTag {
	border: 2px solid #333333;
}

/* used if no logo is available */
.brokerDetail_logoPlaceholder {
	background-color: #333333;
	width: 100px;
	height: 36px;
}

/* table cell holding the broker's name */
.brokerDetail_titleCell {
	background-color: #333333;
}

/* broker's company name */
.brokerDetail_title {
	color: #FFFFFF; 
	font-weight: bold;
}

/* separator line between name and address */
.brokerDetail_separatorLine {
	background: #cccccc;
	 margin-top: 2px;
}

/* detail about broker, address, and contact */
.brokerDetail_main {
	border: 2px solid #cccccc; 
	padding: 8px; 
	margin-top: 2px;
}
