/*-------------------------------------------*   TAP Site.css
 
   Index
   - Header
   - Error Handling
   - Image and Plate Tables
   - Footer
   - Site Containers
   - HTML
\*-------------------------------------------*/

/*-------------------------------------------*   [START] Header

    - This section contains styling for the DMV2U header.
\*-------------------------------------------*/

/* Force site banner image to span the entire screen */
.FastPageHeaderContent {
  padding: 0;
  max-width: 100%;
}

/* Web cart theme */
.ManagerHeader .ManagerHeaderLinkShoppingCart {
  background-color: inherit !important;
  color: inherit !important;
}

/* Hide application title from home */
.ManagerHeader .ManagerHeaderLinkHome .ApplicationTitle {
  display: none;
}

/* Override styling for home icon to adjust for hiding application title */
.ManagerHeader .ManagerHeaderLinkHome {
  width: 3rem;
  border-radius: 3rem;
  height: 3rem;
}

/* Hide logon image section from XDHOM */
.WebHomeLogonWrapper {
  display: none;
}

/* Position environment name label to show below the site header */
.EnvironmentNameLabel {
  top: 4rem;
}

/* Formatting for Top Level Site Header */
.OS_SiteHeader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 4rem;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  z-index: 10000;
  list-style: none;
  background: #293352;
  box-shadow: 0 0 1rem #000;
}

/* Styling for site header Oregon.gov icon */
.OS_SiteHeader_Icon {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  padding-left: 0.5rem;
  text-align: left;
}

/* Styling for site header parter sign-in text*/
.OS_SiteHeader_SignIn {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  text-align: right;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-right: 1.5rem;
}

/* Styling for parter sign-in link icon */
.OS_SiteHeader_SignIn i {
  float: left;
  padding-top: 0.2rem;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  color: #FFFFFF;
}

.OS_SiteHeader_SignIn span {
  color: #FFFFFF;
}

/* Hide Partner Sign In Text on smaller screens */
@media (max-width: 600px) {
  .OS_SiteHeader_SignIn span {
    display: none;
  }
}

/* Formatting for banner on DMV2U */
.OS_Banner {
  height: 8rem;
  padding-top: 4rem;
  padding-bottom: 5rem;
  margin-bottom: -5rem;
  z-index: 100;
  font-size: 3rem;
  color: #fff;
  text-shadow: 3px 3px 8px #000;
  background: #1f263d;
  background: url("../Image/ENG/Crater-min-2-2257x952.jpg") 50% 40% / cover
    no-repeat;
}

/* Styling for ODOT transportation icon overlayed on banner*/
.OS_Banner img {
  padding-left: 1rem;
  padding-top: 1rem;
  height: 6rem;
  float: left;
  filter: drop-shadow(3px 3px 8px #000);
}

/* Styling for DMV2U text overlayed on banner */
.OS_Banner h2 {
  margin: 0;
  font-style: italic;
  font-weight: bold;
  line-height: 6rem;
  float: left;
  padding-left: 1rem;
  padding-top: 1rem;
}

/*-------------------------------------------*    [END] Header
\*-------------------------------------------*/

/*-------------------------------------------*   [START] Error Handling

    - This sections contains styling for error wrappers and Containers
      used to format error messages on DMV2U
\*-------------------------------------------*/

/* Generic error wrapper */
.OS_ErrorWrapper {
  width: 100%;
  margin: 0 auto;
  margin-bottom: 70px;
  padding: 10px;
  box-sizing: border-box;
}

.OS_ErrorWrapper .OS_ErrorMessage {
  padding: 10px 30px;
  margin: 20px 20px 30px;
  border-radius: 5px;
  text-align: center;
  box-sizing: border-box;
  border-width: 2px;
  border-style: solid;
  text-align: left;
  background-image: repeating-linear-gradient(
    50deg,
    transparent 0px,
    transparent 3px,
    rgba(0, 0, 0, 0.025) 5px,
    transparent 7px,
    transparent 10px
  );
}

.OS_ErrorWrapper .OS_ErrorMessage h2 {
  margin-top: 0.25rem;
  font-weight: bold;
  font-size: 150%;
  color: #333333;
}

.OS_ErrorWrapper p {
  margin-top: 1rem;
  color: #333333;
}

.OS_ErrorWrapper h5 {
  margin-top: 1rem;
  color: #333333;
  font-size: 110%;
  font-weight: bold;
}

.OS_ErrorWrapper .OS_ActionBar {
  display: inline-flex;
}

.OS_ErrorWrapper .OS_ActionBar button a {
  color: #fff;
}

.OS_ErrorWrapper .OS_StackTrace {
  white-space: pre-wrap;
}

/* Control Message wrappers */
.OS_ControlMessage {
  position: relative;
  box-sizing: border-box;
  margin-right: 20px;
  margin-left: 20px;

}

.OS_ControlMessage:before {
  position: absolute;
  left: -32px;
  content: "";
  width: 32px;
  height: 32px;
}

.OS_ControlMessage h3 {
  height: 1.2em;
  margin: -2px 0 0;
  padding: 6px 7px;
  font-size: 1.2em;
  font-weight: bold;
}

.OS_ControlMessage p {
  margin: 0;
  padding: 8px 7px 10px;
}

/* Warning control messages */
.OS_WarningControlMessage,
.OS_WarningErrorMessage {
  background-color: #f2eed9;
  border-color: #f0e1c2;
  color: #806331;
}

.OS_SecureControlMessage:before {
  font-family: "Material Icons";
  font-size: 24px;
  content: "\e897";
}

.OS_WarningControlMessage:before {
  font-family: "Material Icons";
  font-size: 24px;
  content: "\e002";
}

.OS_ErrorControlMessage a {
  color: #ffeb3b !important;
}

.OS_ErrorMsgContainer {
  background-color: #ffffff;
}

.OS_ErrorControlMessage:before {
  font-family: "Material Icons";
  font-size: 24px;
  content: "\e000";
}

.OS_ErrorControlMessage h3 {
  border-bottom: 2px solid #9b3c39;
}

.OS_InformationControlMessage:before {
  font-family: "Material Icons";
  font-size: 24px;
  content: "\e88e";
}

.OS_SuccessControlMessage:before {
  font-family: "Material Icons";
  font-size: 24px;
  content: "\e002";
}

/*-------------------------------------------*    [END] Error Handling
\*-------------------------------------------*/

/*-------------------------------------------*   [START] Footer

    - This sections contains for the footer on DMV2U
\*-------------------------------------------*/

/* Formatting main div in site footer */
.main-foot__inner {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  padding-top: 15px;
  padding-bottom: 15px;
}

/* General footer icon formatting */
.main-foot__inner .fa {
  padding-top: 5px;
  padding-bottom: 5px;
  color: #ffffff;
}

/* Formatting for payment icon portion of footer */
.main-foot__payment {
  width: 33%;
}

/* Formatting for payment icons */
.main-foot__payment .fa {
  padding-left: 10px;
  padding-right: 10px;
}

/* Formatting for social media icon portion of footer*/
.main-foot__social {
  width: 33%;
  text-align: center;
}

/* Formatting for social media icons */
.main-foot__social .fa {
  padding-left: 20px;
  padding-right: 20px;
  border-radius: 3rem;
  color: #ffffff;
}

/* Additional formatting for social media icons */
.main-foot__social ul > a {
  display: inline-block;
}

/* Formatting for Oregon DMV link portino of footer */
.main-foot__oregonlink {
  width: 34%;
  text-align: right;
}

/* Link padding */
.main-foot__oregonlink a {
  padding-right: 5px;
  padding-left: 5px;
  text-color: #ffffff;
}

/* Hide text and show ODOT icon on smaller screens */
@media (max-width: 600px) {
  .OregonDMV_Link {
    display: none;
  }

  .OregonDMV_Icon {
    display: inline-block;
  }

  .OregonDMV_Icon img {
    height: 2rem;
    border-radius: 3rem;
  }
}

@media (min-width: 601px) {
  .OregonDMV_Link {
    display: inline-block;
    color: #ffffff;
  }

  .OregonDMV_Icon {
    display: none;
  }
}

/* Formatting for copyright portion of site footer */
.main-foot__copy {
  margin-top: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
  border-top: 1px solid #ffffff;
  text-align: center;
  font-size: 0.7em;
  color: #ffffff;
}

/* Add padding to footer */
.FastPageFooterContent {
  padding-top: 20px;
  padding-bottom: 20px;
}

/*-------------------------------------------*    [END] Footer
\*-------------------------------------------*/

/*-------------------------------------------*   [START] Site Container

    - This sections contains a generic container class built
      to handle non-architechture components
\*-------------------------------------------*/

/* generic container class to handle non-architecture components */
.OS_Container {
  position: relative;
  height: 100%;
  max-width: 90rem;
  margin-left: auto;
  margin-right: auto;
}

/*-------------------------------------------*    [END] Site Container
\*-------------------------------------------*/

/*-------------------------------------------*   [START] Doc Field Classes

    - This section contains any generic doc field styling classes
\*-------------------------------------------*/

/* Secondary titlebar styling */
.OS_titlebar-secondary {
  box-shadow: 0px 4px 6px -6px #293352;
  padding-bottom: 5px;
  padding-top: 10px;
}

/*-------------------------------------------*    [END] Doc Field Classes
\*-------------------------------------------*/

/*-------------------------------------------*   [START] HTML

    - This section contains any additional HTML
\*-------------------------------------------*/

html
{
    font-family: "Open Sans","Poppins",-apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}

/*-------------------------------------------*    [END] HTML
\*-------------------------------------------*/