/*
 * Legal Disclaimer
 *
  * These web fonts are licensed exclusively for use on the following:
 * Web domains belonging to this customer.
 * U.S. Bank
 * It is strictly forbidden to download or use these fonts on any other website domain or media.
    
 *
 * While the @font-face statements below may be modified by the client, this
 * disclaimer may not be removed.
 *
 * Lineto.com, 2023
 */

/*********************************************************************************/
/* Merchant.html page styles - hero and merchant paragraph and form components   */
/*********************************************************************************/
#PageOrderableContainerMerchantPage
  .pageOrderableContainer_container
  > *:first-child {
  flex: 1 1 100%;
  max-width: 100%;
}

#PageOrderableContainerMerchantPage
  .pageOrderableContainer_container
  > *:nth-child(2),
#PageOrderableContainerMerchantPage
  .pageOrderableContainer_container
  > *:nth-child(3) {
  display: inline-block;
  vertical-align: top;
  width: 48%;
}

#PageOrderableContainerMerchantPage
  .pageOrderableContainer_container
  > *:nth-child(2) {
  padding-right: 4%;
  padding-top: 0;
  padding-bottom: 10%;
}

@media (max-width: 990px) {
  #PageOrderableContainerMerchantPage .pageOrderableContainer_container {
    display: flex;
    flex-direction: column;
  }

  #PageOrderableContainerMerchantPage
    .pageOrderableContainer_container
    > *:nth-child(2) {
    display: block;
    width: 100%;
    order: 2;
    padding-top: 2%;
    padding-bottom: 10%;
    padding-right: 0;
  }

  #PageOrderableContainerMerchantPage
    .pageOrderableContainer_container
    > *:nth-child(3) {
    display: block;
    width: 100%;
    order: 1;
    padding-bottom: 0;
  }
}

/*********************************************************************************/
/* Partner.html page styles - hero and partner paragraph and form components    */
/********************************************************************************/
#PageOrderableContainerPartnerPage
  .pageOrderableContainer_container
  > *:first-child {
  flex: 1 1 100%;
  max-width: 100%;
}

#PageOrderableContainerPartnerPage
  .pageOrderableContainer_container
  > *:nth-child(2),
#PageOrderableContainerPartnerPage
  .pageOrderableContainer_container
  > *:nth-child(3) {
  display: inline-block;
  vertical-align: top;
  width: 48%;
}

#PageOrderableContainerPartnerPage
  .pageOrderableContainer_container
  > *:nth-child(2) {
  padding-right: 4%;
  padding-top: 0;
  padding-bottom: 10%;
}

@media (max-width: 990px) {
  #PageOrderableContainerPartnerPage .pageOrderableContainer_container {
    display: flex;
    flex-direction: column;
  }

  #PageOrderableContainerPartnerPage
    .pageOrderableContainer_container
    > *:nth-child(2) {
    display: block;
    width: 100%;
    order: 2;
    padding-top: 2%;
    padding-bottom: 10%;
    padding-right: 0;
  }

  #PageOrderableContainerPartnerPage
    .pageOrderableContainer_container
    > *:nth-child(3) {
    display: block;
    width: 100%;
    order: 1;
    padding-bottom: 0;
  }
}

/*********************************************************************************/
/* The legal disclaimer renders inside the FooterMenu atom below the social icons.
/* These overrides live here because the atom is imported from the shared footer
/* styles, while this marketplace needs custom disclaimer width behavior: a
/* constrained width in the desktop footer column and full width when the social
/* block stacks into its own row.
/********************************************************************************/
.legal-disclaimer {
  font-size: 14px;
  line-height: 1.2;
  white-space: pre-line;
  width: 21vw;
  padding-top: 16px;
}

@media (max-width: 1330px) {
  .legal-disclaimer {
    width: 20vw;
  }
}

.footerMenu_socialRow .legal-disclaimer {
  width: 100%;
}

/* The base footer background is painted with pseudo-elements, which can cause
/* contrast tools to miss the dark background behind white footer text. These
/* text-level backgrounds keep the visual design and make contrast testable.
/********************************************************************************/
.footerMenu_title,
.footerMenu_link,
.footerMenu_item,
.legal-disclaimer {
  background-color: var(--footer-bg-color, #555555);
}

/*********************************************************************************/
/* The clickable text and icon for the privacy modal is located in the
   footersitemap atom, since there is not a styles folder for the footersitemap
   atom the styles are added below. */
/********************************************************************************/
#privacy-policy-optout {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
}

#privacy-policy-optout:hover {
  text-decoration: underline;
}

/*********************************************************************************/
/* The logo image in the headerHomeBar molecule is blurry on some screens, this is a
   fix to make it sharper, the image is 60px by 60px but it is being displayed at 28px
   by 28px, so the image-rendering property is set to auto to make it
   sharper, and the height is set to 28px to match the display size, and the max-height
   is set to 30px to prevent it from getting too large on larger screens. */
/********************************************************************************/
  .headerHomeBar_logoWrapper .logo_image {
      image-rendering: auto;
      height: 28px;
      max-height: 30px;
  }