/** additional styles **/
/* logo changes*/
.spark-header {
  background-color:#1b3e95 !important;
  border-color: #1b3e95 !important;
}
.spark-header__title {
	 background-color:#1b3e95 !important;
	 border-color: #1b3e95 !important;
}
.spark-footer {
	 background-color:#1b3e95 !important;
	 border-color: #1b3e95 !important;
}
.email-boarding-pass-container .email-button-container .ducp-component-button.cancel-email-button {
	background-color: #1b3e95 !important;
}
.spark-header__toggle {
    background-color: #1b3e95 !important;
}
.flight-image img{
	display:none !important;
}
.flight-image {
	background-image: url("../images/QV.png") !important;
	background-size: cover;
    background-position: center;
	width: 35px;
    height: 35px;
}
[dir] .ducp-component-button.secondary-button {
    background-color: #1b3e95;
}
/* end_of logo changes */

.ducp-component-header .spark-header__title.is-image {
  padding: calc(1.1rem - 13px) 1.5rem 2rem !important;
}

.spark-header__menu[role="menu"]{
  flex: 1!important;
}

/**END - To fit the logo with in the size**/

html .progress-background, html body {
  background: url(../images/bg.png) repeat top center!important;
}

/** Need to move below to SCSS variables once these are exposed / SCSS complilations start working */
/**Bread Crumbs**/
  .spark-step-indicator__item--current:after,
  .spark-step-indicator__item--current:before {
    border-right: #1b3e95 !important;
    border-left: #1b3e95 !important;
    background-color: #1b3e95 !important;
  }


  .spark-progress__meter:after {
    background-color: #1b3e95 !important;
}

.spark-progress__text,
 .initial-progress-indicator .page-loading-message,
 .ducp-component-button.text-button:not(.additional-options-btn),
 .ducp-component-button.text-button:not(.additional-options-btn):hover,
 .sabre-dx-component-check-in-confirmation .flight-summary-title,
 .spark-progress progress[value]~.spark-progress__text,
 .sabre-dx-component-check-in-passenger-list .missing-documents-message .content:not(.title),
 .Hazmat .hazmat-title,
 .sabre-dx-component-check-in-passenger-list .non-checkin-passengers-header {
    color: #1b3e95;
}
.ducp-component-toolbar .toolbar-item .tool-bar-item-text {
	color: #1b3e95;
}

[dir] .spark-header.spark-header--visible .spark-menu>.spark-menu__list>.spark-menu__list-item:after {
  display: none;
}

[dir] .spark-header.spark-header--visible .spark-menu>.spark-menu__list>.spark-menu__list-item.active>.spark-menu__list-link {
  background-color: transparent;
  color: #fff;
  border-color: #1b3e95;
}

/**END - Bread Crumbs**/

/** END - Need to move below to SCSS variables once these are exposed / SCSS complilations start working */

/**Logo in mobile BP**/
.ListGroupItemHeader.spark-panel__header.flight-header:before {
  background-image: url(../images/mobileBpLogo.png);
  background-repeat: no-repeat;
  background-position: center;
  height: 64px;
  background-color: #1b3e95;
  content: '';
  display: block;
  margin: -12px -12px 12px -12px;
}
/**END Logo in mobile BP**/

/**Image in the loader**/
.spark-progress__meter:before {
    background: url(../images/QV.png) no-repeat center center;
}
/** END - Image in the loader**/

/** fix for centre content alignment w.r.t. footer (start) **/
.layout .ducp-page {
  padding-bottom: 18rem !important;
}
/** fix for centre content alignment w.r.t. footer (end) **/

[dir] .sabre-dx-component-check-in-lookup .lookup-container .lookup-options .additional-options .additional-options-btn {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  color:#1b3e95 !important;
}
[dir] .seat-map-passengers .passengers .passenger-container .passenger .passenger-name-item {
    padding: 1rem;
	color: #1b3e95 !important;
}

[dir] .spark-btn, [dir] .TravelExtras .travel-extra .content .button-wrapper button, [dir] .TravelExtras .footer > button, [dir] .seat-popover-form .select-seat, [dir] .sabre-dx-component-check-in-page-level-message .continue-button, [dir] .sabre-dx-component-check-in-documents .footer > button, [dir] .MessagePopup .button-container .modal-button.close-button, [dir] .ducp-component-confirmation-header .supplementary-data-container .ducp-component-toolbar .show-more .spark-toolbar__show-more, [dir] .ducp-component-button {
    background-color: #1b3e95;
    border: 0.0625rem solid #1b3e95;
    border-radius: 0.25rem;
    cursor: pointer;
    margin: 0;
    padding: 1.75rem 3.25rem;
    text-align: center;
}

[dir] .spark-btn.active, [dir] .TravelExtras .travel-extra .content .button-wrapper button.active, [dir] .TravelExtras .footer > button.active, [dir] .seat-popover-form .active.select-seat, [dir] .sabre-dx-component-check-in-page-level-message .active.continue-button, [dir] .sabre-dx-component-check-in-documents .footer > button.active, [dir] .MessagePopup .button-container .active.modal-button.close-button, [dir] .ducp-component-confirmation-header .supplementary-data-container .ducp-component-toolbar .show-more .active.spark-toolbar__show-more, [dir] .active.ducp-component-button, [dir] .spark-btn:active, [dir] .TravelExtras .travel-extra .content .button-wrapper button:active, [dir] .TravelExtras .footer > button:active, [dir] .seat-popover-form .select-seat:active, [dir] .sabre-dx-component-check-in-page-level-message .continue-button:active, [dir] .sabre-dx-component-check-in-documents .footer > button:active, [dir] .MessagePopup .button-container .modal-button.close-button:active, [dir] .ducp-component-confirmation-header .supplementary-data-container .ducp-component-toolbar .show-more .spark-toolbar__show-more:active, [dir] .ducp-component-button:active {
    background-color: #0a2463;
    border: 0.0625rem solid black;
    box-shadow: none !important;
}

[dir] .spark-btn.focus, [dir] .TravelExtras .travel-extra .content .button-wrapper button.focus, [dir] .TravelExtras .footer > button.focus, [dir] .seat-popover-form .focus.select-seat, [dir] .sabre-dx-component-check-in-page-level-message .focus.continue-button, [dir] .sabre-dx-component-check-in-documents .footer > button.focus, [dir] .MessagePopup .button-container .focus.modal-button.close-button, [dir] .ducp-component-confirmation-header .supplementary-data-container .ducp-component-toolbar .show-more .focus.spark-toolbar__show-more, [dir] .focus.ducp-component-button, [dir] .spark-btn:focus, [dir] .TravelExtras .travel-extra .content .button-wrapper button:focus, [dir] .TravelExtras .footer > button:focus, [dir] .seat-popover-form .select-seat:focus, [dir] .sabre-dx-component-check-in-page-level-message .continue-button:focus, [dir] .sabre-dx-component-check-in-documents .footer > button:focus, [dir] .MessagePopup .button-container .modal-button.close-button:focus, [dir] .ducp-component-confirmation-header .supplementary-data-container .ducp-component-toolbar .show-more .spark-toolbar__show-more:focus, [dir] .ducp-component-button:focus {
    box-shadow: 0 0 0 0.125rem #fff, 0 0 0 0.375rem #1b3e95;
}

[dir] .spark-btn.hover, [dir] .TravelExtras .travel-extra .content .button-wrapper button.hover, [dir] .TravelExtras .footer > button.hover, [dir] .seat-popover-form .hover.select-seat, [dir] .sabre-dx-component-check-in-page-level-message .hover.continue-button, [dir] .sabre-dx-component-check-in-documents .footer > button.hover, [dir] .MessagePopup .button-container .hover.modal-button.close-button, [dir] .ducp-component-confirmation-header .supplementary-data-container .ducp-component-toolbar .show-more .hover.spark-toolbar__show-more, [dir] .hover.ducp-component-button, [dir] .spark-btn:hover, [dir] .TravelExtras .travel-extra .content .button-wrapper button:hover, [dir] .TravelExtras .footer > button:hover, [dir] .seat-popover-form .select-seat:hover, [dir] .sabre-dx-component-check-in-page-level-message .continue-button:hover, [dir] .sabre-dx-component-check-in-documents .footer > button:hover, [dir] .MessagePopup .button-container .modal-button.close-button:hover, [dir] .ducp-component-confirmation-header .supplementary-data-container .ducp-component-toolbar .show-more .spark-toolbar__show-more:hover, [dir] .ducp-component-button:hover
Specificity: (0,6,1)
 {
    background-color: #0a2463;
}

[dir] .spark-btn.hover, [dir] .TravelExtras .travel-extra .content .button-wrapper button.hover, [dir] .TravelExtras .footer > button.hover, [dir] .seat-popover-form .hover.select-seat, [dir] .sabre-dx-component-check-in-page-level-message .hover.continue-button, [dir] .sabre-dx-component-check-in-documents .footer > button.hover, [dir] .MessagePopup .button-container .hover.modal-button.close-button, [dir] .ducp-component-confirmation-header .supplementary-data-container .ducp-component-toolbar .show-more .hover.spark-toolbar__show-more, [dir] .hover.ducp-component-button, [dir] .spark-btn:hover, [dir] .TravelExtras .travel-extra .content .button-wrapper button:hover, [dir] .TravelExtras .footer > button:hover, [dir] .seat-popover-form .select-seat:hover, [dir] .sabre-dx-component-check-in-page-level-message .continue-button:hover, [dir] .sabre-dx-component-check-in-documents .footer > button:hover, [dir] .MessagePopup .button-container .modal-button.close-button:hover, [dir] .ducp-component-confirmation-header .supplementary-data-container .ducp-component-toolbar .show-more .spark-toolbar__show-more:hover, [dir] .ducp-component-button:hover {
    background-color: #0a2463;
}

[dir] .spark-header__sign-in .spark-menu__list-link {
    background-color: #1b3e95 !important;	
	max-height: 60px;
}
[dir] .spark-header__sign-in .spark-menu__list-link::after {
	background-color: #1b3e95 !important;
	background-image: none !important;
	background-position: center center;
    background-size: cover;
    transform: translate(0, -50%);
}
[dir] a img {
    border: none;
    width: 150px !important;
    height: 60px !important;
}
[dir] .ducp-component-page-button-wrapper > button.ducp-component-button.continue:hover{
background-color: #1b3e95 !important;	
}
.ducp-component-button.secondary-button {
    color: #FAFAFA;
}
.credit-card-image.CU-card{
	background: url(../images/unionpay-logo.png) no-repeat center center;
    background-repeat: no-repeat;
    background-position: left;
    background-size: contain;
    width: 48px;
    height: 35px;
    display: inline-block;
}