:root{

  --pattern-seat-opaque-16: url("/sfsites/c/resource/SkyBonusAssets/images/pattern-seat-opaque16.png");
  --dl-exception-policy-left: url("/sfsites/c/resource/SkyBonusAssets/images/dl-exception-policy-left-border.png");
  --content-area-accent-delta-logo-mark:url("/sfsites/c/resource/SkyBonusAssets/images/content-area-accent-delta-logo-mark.png");

}
/* Default z-index to the main content area affecting throughout the pages reseting it. */
.dl-main-content-area>* {
  z-index: unset;
}

.dl-main-content-area:before {
  z-index: 0;
}

html {
  scroll-behavior: smooth;
}

/* Set Global font rules */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
li,
span,
table,
.table,
.form-group>label {
  color: #0b1f66;
  font-family: 'Whitney',Helvetica,Arial,sans-serif;
}

.dl-card-title,
.dl-card-text {
  color: #0b1f66;
}

body {
  font-size: 1rem;
}

@font-face {
  font-family: "Whitney-Book";
  src: url("fonts/WhitneySSmW05-Book.woff") format("woff"), url("fonts/WhitneySSmW05-Book.woff2") format("woff2");
  font-weight: 1 1000;
  font-style: normal;
}

@font-face {
  font-family: "Whitney-Semibold";
  src: url("fonts/WhitneyW05-Semibold.woff") format("woff"), url("fonts/WhitneyW05-Semibold.woff2") format("woff2");
  font-weight: 1 1000;
  font-style: normal;
}

@font-face {
  font-family: "Whitney-Bold";
  src: url("fonts/WhitneySSmW05-Bold.woff") format("woff"), url("fonts/WhitneySSmW05-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Whitney-Condensed";
  src: url("fonts/WhitneyCondensedW05-Book.woff") format("woff"), url("fonts/WhitneyCondensedW05-Book.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "WhitneyCondensed-Semibold";
  src: url("fonts/WhitneyCondensedW05-SmBd.woff") format("woff"), url("fonts/WhitneyCondensedW05-SmBd.woff2") format("woff2");
  font-weight: 1 1000;
  font-style: normal;
}

@font-face {
  font-family: "Whitney-Light";
  src: url("fonts/WhitneySSmW05-Light.woff") format("woff"), url("fonts/WhitneySSmW05-Light.woff2") format("woff2");
  font-weight: 1 1000;
  font-style: normal;
}

.font-primary-base {
  font-family: 'Whitney',Helvetica,Arial,sans-serif;
}

.font-primary-book {
  font-family: 'Whitney-Book';
}

.font-primary-semibold {
  font-family: 'Whitney-Semibold';
}

.font-primary-bold {
  font-family: 'Whitney-Bold';
}

.font-primary-condensed {
  font-family: 'Whitney-Condensed';
}

.font-primary-condensed-semibold {
  font-family: 'WhitneyCondensed-Semibold';
}

.font-primary-light {
  font-family: 'Whitney-Light';
}

h1 {
  /* These override default !importants from Freshair */
  font-size: 3.25rem !important;
  font-weight: 400 !important;
  line-height: 3.875rem;
  margin-bottom: 1rem;
}

h2 {
  font-size: 2.625rem;
  /* This important overrides a default one */
  font-weight: 400 !important;
}

.dl-hero-title {
  font-family: 'WhitneyCondensed-Semibold';
  font-size: 3.25rem;
  line-height: 3.25rem;
}

h3 {
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 2rem;
}

h6 {
  font-family: 'Whitney-Semibold', Arial, Helvetica, sans-serif;
  font-size: 1.125rem;
  line-height: 1.25rem;
  text-transform: uppercase;
}

p.lead,
p.large {
  font-size: 1.25rem;
  font-weight: 325;
  line-height: 1.75rem;
}

a, .link-btn {
  font-family: 'Whitney-Semibold', Arial, Helvetica, sans-serif;
  color: #4470c3;
  text-decoration: none;
}

a:hover {
  color: #2d4f8d;
  text-decoration: underline;
}

.font-weight-bold {
  font-family: 'Whitney-Bold', Arial, Helvetica, sans-serif;
}

label,
.form-group>label {
  font-family: 'Whitney-Semibold', Arial, Helvetica, sans-serif;
}

hr.dl-header-underline {
  margin-bottom: 2rem;
  height: 0.188rem !important;
}

hr.hr-red {
  border-top: 3px solid #E51937;
  margin: 1rem 0 2rem 0;
  opacity: 1;
  width: 4rem;
}

.dl-global-header,
.dl-footer,
.dl-brand {
  background-color: #003366 !important;
}

/** design system scaffolding hard codes this **/
.dl-global-header {
  font-size: 1.125rem;
  line-height: 1.25;
}

.dl-global-header span.dl-select-field-title,
.dl-global-header span.dl-select-field-subtitle,
.dl-global-header .sb-select-field-title {
  color: #fff;
}

.dl-global-nav-primary>ul>li>a {
  /* Use of Whitney itself is explicit and not meant to be any variation of Whitney */
  font-family: 'Whitney', Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 0.875rem;
}

/* Override Fresh Air subnav background to the desired SkyBonus background */
.dl-subnav {
  background: #fff !important;
}

.dl-subnav-item a {
  /* These importants overrides a default setting in Fresh Air */
  font-family: 'Whitney-Semibold', Arial, Helvetica, sans-serif;
  font-weight: 400 !important;
  color: #2F3236 !important;
  padding: 0.97rem 0 !important;
}

.dl-subnav-item a.active {
  color: #2F3236 !important;
}

a.dl-hero-button {
  font-family: 'Whitney-Semibold';
  font-size: 1rem;
  /* These override !importants in the base theme */
  font-weight: 400 !important;
  letter-spacing: 1.8px !important;
}

.dl-alert {
  color: black;
}

/** Set alert background colors to SkyBonus colors and opacities **/
.dl-alert-info {
  background: rgba(21, 118, 212, .2);
  box-shadow: 0px 0px 8px 4px rgba(21, 118, 212, .1);
}

.dl-alert-success {
  background: rgba(7, 147, 68, .2);
  box-shadow: 0px 0px 8px 4px rgba(7, 147, 68, .1);
}

.dl-alert-warning {
  background: rgba(185, 93, 1, .2);
  box-shadow: 0px 0px 8px 4px rgba(185, 93, 1, .1);
}

.dl-alert-error {
  background: rgba(221, 57, 18, .2);
  box-shadow: 0px 0px 8px 4px rgba(221, 57, 18, .2);
}

.dl-alert .icon {
  font-size: 1.5rem;
  width: auto;
}

.dl-alert strong, .dl-alert li {
  color: #05080F;
  font-size: 1rem;
}

.dl-alert .icon-info {
  padding-right: 0px !important;
  margin-right: 1rem !important;
}

.dl-alert li {
  margin-bottom: 0px;
}

.dl-alert strong {
  vertical-align: middle;
  font-family: 'Whitney-Semibold', Arial, Helvetica, sans-serif;
}

.dl-alert ul,
.alert-title-and-description ul {
  padding-left: 1.25rem;
}

.dl-alert-message{
  padding-left: 0.25rem;
  display: block;
}

strong {
  font-family: 'Whitney-Semibold';
}

.dl-alert .icon-close {
  cursor: pointer;
  font-size: 1.25rem;
  margin-right: 0;
}

.btn-spinner[disabled]>.spinner-border {
  display: inline-block !important;
  margin-right: 1rem;
}

.dl-main-content-area.dl-gradient-bg {
  /* Set gradient and background image */
  background-image: radial-gradient(rgba(250, 250, 251, 1),
      rgba(250, 250, 251, .7)),var(--pattern-seat-opaque-16); 
  /* first background size is gradient, second is pattern */
  background-size: 100%, 4rem;
}

/* hide the other overlay gradient */
.dl-main-content-area.dl-gradient-bg:after {
  display: none !important;
}

.sb-arrow-button {
  background: transparent;
  border: 0;
  font-size: 1.25rem;
  margin: 0;
  padding: 0;
}

/** Forms
**********/

select.form-control {
  /* overriding another important */
  padding-left: 0 !important;
}

.form-control {
  color: #0B1F66;
}

th {
  font-family: 'Whitney-Semibold';
}

/** Filler Icons
**********/
i.icon-caret-down {
  background-image: url('../css/icons/caret-down.svg');
  background-repeat: no-repeat;
  background-size: contain;
  height: .375rem;
  width: .5rem;
}

/* Use the Search icon specifically in Figma instead of in the icon font family */
.sb-icon-search {
  background-image: url('../css/icons/search-icon-white.svg');
  background-repeat: no-repeat;
  background-size: contain;
  height: 1.125rem;
  width: 1.125rem;
}

.modal-backdrop-dark {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  content: ' ';
  background: rgba(0, 0, 0, 0.4);
  cursor: default;
  z-index: 4;
}

.modal-backdrop-transparent {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  content: ' ';
  background: transparent;
  cursor: default;
  z-index: 4;
}

.show {
  display: block !important;
}

.hide {
  display: none !important;
}

.overlay {
  background-color: rgba(0, 0, 0, 0.4);
}

.btn-outline-info:hover {
  background-color: #0B1F66;
  border-color: #0B1F66;
}

.dl-subnav-list .active::after {
  bottom: 0px;
}

.px-6 {
  padding-left: 4rem !important;
  padding-right: 4rem !important;
}

.pl-6 {
  padding-left: 4rem !important;
}

.pr-6 {
  padding-right: 4rem !important;
}

.py-6 {
  padding-top: 4rem !important;
  padding-bottom: 4rem !important;
}

.pb-6 {
  padding-bottom: 4rem !important;
}

.pt-6 {
  padding-top: 4rem !important;
}

.p-6 {
  padding-left: 4rem !important;
  padding-right: 4rem !important;
  padding-top: 4rem !important;
  padding-bottom: 4rem !important;
}

.mx-6 {
  margin-left: 4rem !important;
  margin-right: 4rem !important;
}

.ml-6 {
  margin-left: 4rem !important;
}

.mr-6 {
  margin-right: 4rem !important;
}

.my-6 {
  margin-top: 4rem !important;
  margin-bottom: 4rem !important;
}

.mb-6 {
  margin-bottom: 4rem !important;
}

.mt-6 {
  margin-top: 4rem !important;
}

.m-6 {
  margin-left: 4rem !important;
  margin-right: 4rem !important;
  margin-top: 4rem !important;
  margin-bottom: 4rem !important;
}


.px-7 {
  padding-left: 5rem !important;
  padding-right: 5rem !important;
}

.pl-7 {
  padding-left: 5rem !important;
}

.pr-7 {
  padding-right: 5rem !important;
}

.py-7 {
  padding-top: 5rem !important;
  padding-bottom: 5rem !important;
}

.pb-7 {
  padding-bottom: 5rem !important;
}

.pt-7 {
  padding-top: 5rem !important;
}

.p-7 {
  padding-left: 5rem !important;
  padding-right: 5rem !important;
  padding-top: 5rem !important;
  padding-bottom: 5rem !important;
}

.mx-7 {
  margin-left: 5rem !important;
  margin-right: 5rem !important;
}

.ml-7 {
  margin-left: 5rem !important;
}

.mr-7 {
  margin-right: 5rem !important;
}

.my-7 {
  margin-top: 5rem !important;
  margin-bottom: 5rem !important;
}

.mb-7 {
  margin-bottom: 5rem !important;
}

.mt-7 {
  margin-top: 5rem !important;
}

.m-7 {
  margin-left: 5rem !important;
  margin-right: 5rem !important;
  margin-top: 5rem !important;
  margin-bottom: 5rem !important;
}

/* Sets common styles for info tooltip */
.dl-info-tooltip,
.dl-tax-tooltip {
  display: none;
}

.icon-info:hover+.dl-info-tooltip,
.lock-icon:hover+.dl-tax-tooltip,
.dl-miles-info:hover+.dl-info-tooltip, 
.dl-multiplier-info:hover+.dl-info-tooltip {
  display: block;
  position: absolute;
  z-index: 5;
  padding: 0.5rem;
  padding-right: 1rem;
  margin-top: .1rem;
  font-size: .813rem;
  line-height: 1rem;
  color: #05080F;
  background-color: #fff;
  filter: drop-shadow(0 0 .25rem rgba(5, 8, 15, .3));
}

.dl-info-tooltip::after,
.dl-tax-tooltip::after {
  position: absolute;
  top: 100%;
  display: block;
  width: 0;
  height: 0;
  content: "";
  border-top: 10px solid #fff;
  border-right: 7px solid transparent;
  border-left: 7px solid transparent;
}

.infoAnc{
  font-family: 'Whitney-Semibold', Arial, Helvetica, sans-serif;
  color: #05080F;
  cursor: pointer;
  text-decoration: underline;
}

.dl-alert-message span, .dl-tax-tooltip span, .dl-lock-tooltip span {
  color: #05080F;
}

.infoAnc:hover {
  text-decoration: none;
}

@media screen and (min-width: 576px) {
  .container, .dl-hero-container, .dl-subnav-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

@media screen and (min-width: 1600px) {
  .container, .dl-hero-container, .dl-subnav-container {
    max-width: 1180px;
  }
}

@media screen and (min-width: 1440px) {
  .container, .dl-hero-container, .dl-subnav-container {
    max-width: 1156px;
  }
}

@media screen and (max-width: 1200px) {

  .dl-hero .skybonus-hero-container {
    padding: 0 1.875rem;
  }

}

@media screen and (max-width: 1080px) {

  .dl-main-content-area:before {
    width: 7.875rem !important;
    height: 7.875rem !important;
  }

}

@media (min-width: 768px) and (max-width: 1080px) {
  .dl-global-header .dl-brand {
    left: 3rem !important;
  }
}

@media (min-width: 375px) and (max-width: 768px) {
  .dl-brand {
    margin-top: 0.5rem;
  }
}

@media screen and (max-width: 575px) {

  .dl-main-content-area:before {
    visibility: hidden;
  }

  h1 {
    font-size: 2rem !important;
    line-height: 2.25rem;
    max-width: 19.688rem;
  }

  h2 {
    font-size: 1.5rem !important;
  }

  .form-control,
  .form-select {
    max-width: 100%;
  }

  strong {
    font-size: 0.75rem;
  }

  .dl-confirm-txt strong {
    font-size: 1rem;
  }

  .dl-alert .icon {
    font-size: 15px;
  }

  .alert-left {
    display: flex;
    align-items: center;
  }
}

/* Override Static resource url */



.dl-main-content-area, .dl-skymiles-members-box {
 background-image : var(--pattern-seat-opaque-16);

}

.dl-main-content-area:before, .dl-skymiles-members-box:before {
  background-image: var(--content-area-accent-delta-logo-mark);
}

.dl-point-selection-box {
 background-image : var(--pattern-seat-opaque-16);
}

.dl-point-bank {
  background-image:var(--pattern-seat-opaque-16);
}

.dl-exception-policy-card {
  background-image: var(--dl-exception-policy-left);
}