@font-face {
	font-family: Roboto;
	src: url(https://fonts.googleapis.com/css?family=Roboto);
  }

#header_row {
	display: flex;
    align-items: flex-end;

    height: 104px;
    padding-right: 64px;
    padding-left: 64px;
    padding-bottom: 0px;
    background: #FFFFFFD9;
}

#header-image {
    border-top-left-radius: 24px;
	border-bottom-left-radius: 24px;
	margin-bottom: 0;
}

#app_name {
	width: 100%;
	height: 80px;
	padding-right: 32px;
	padding-left: 16px;

	font-family: Roboto;
    font-weight: 400;
    font-style: Normal;
    font-size: 18px;
    white-space: nowrap;
    leading-trim: NONE;
    line-height: 25.6px;
    letter-spacing: 0%;
    font-color: var(--Gray-Dark-Gray, #343741);
 	display: flex;
	align-items: center;
	border-top-right-radius: 24px;
	border-bottom-right-radius: 24px;
	margin-bottom: 0;
}


.frosted-glass {
	box-shadow:
	    0 8px 12px -6px rgba(0, 0, 0, 0.04),
        0 6px 4px -1px rgba(0, 0, 0, 0.04),
        0 4px 6px -2px rgba(0, 0, 0, 0.08);
}

.topAndBottomSpacer {
	height: 96px;
	margin: auto 0;
	padding: 0;
}

.headline-text {
	font-family: Roboto;
	font-style: Normal;
	font-weight: 300;
	font-size: 40px;
	leading-trim: NONE;
	line-height: 48px;
	letter-spacing: 0%;
	text-align: center;
    height: 48px;
    margin: auto auto 32px auto;
	color: #343741;
}

#lm-header-logo-mobile {
    display: none;  /** Hide the mobile logo by default **/
}

#data-div {
    margin: auto;
}

.full-width-element {
	width: 568px;
}

@media only screen and (max-width: 768px) {
    .full-width-element {
        width: 422px;
    }
}

#error-messages {
	display: flex;
    flex-direction: column;
	width: 141;
	height: 40;
	gap: 8px;
	angle: 0 deg;
	opacity: 1;

	font-family: Roboto;
    font-weight: 400;
    font-style: Normal;
    font-size: 12px;
    leading-trim: NONE;
    line-height: 14.4px;
    letter-spacing: 0%;
    color: var(--Semantic-Semantic-Red-80, #D32F2F);
    margin-bottom: 8px;
}

.error-alert {
  width: 16px;
  height: 16px;
  angle: 0 deg;
  margin-right: 7px;

}

.centered-text {
	 display: flex;
     align-items: center;
}

#username-required {
  display: none;
}


#password-required {
  display: none;
}

.errored-field {
  border-bottom-color: var(--Semantic-Semantic-Red-80, #D32F2F) !important;
  border-width: 2px !important;

  background: var(--Semantic-Semantic-Red-10, #FFF4F5);
}

#username-div {
  margin-bottom: 16px;
}

#password-div {
  margin-bottom: 32px;
}

input {
	height: 50px;
	box-sizing: border-box;

    display: flex;
    align-items: center;

    padding-right: 12px;
    padding-left: 12px;
    border-radius: 6px;

    border-style: solid !important;
    border-width: 1px, 1px, 0px, 10px !important;
    border-color: var(--Gray-Gray-10, #E6E6E6) !important;
}

.remember {
     height: 20px;
     padding-top: 6px;
     margin: auto;
     margin-right: 8px;
     display: inline-block;
     vertical-align: middle;
     font-size: 12px;
}

#tr_resetcreds1 {
  height: 26px !important;
  padding: 0;
  font-size: 12px;
  line-height: 14.4px;
}
.text-16 {
     font-family: Roboto;
      font-weight: 300;
      font-style: Normal;
      font-size: 16px;
      leading-trim: NONE;
      line-height: 22.4px;
      letter-spacing: 0%;
}

#button {
	height: 50px;
	border-radius: 12px;
	padding-top: 12px;
	padding-right: 32px;
	padding-bottom: 12px;
	padding-left: 32px;
	box-sizing: border-box;
	margin-bottom: 32px;

	background: var(--Teal-Teal-Dark, #06748C);
	border-color: var(--Teal-Teal-Dark, #06748C);

     color: #FFFFFF;
     text-align: center;
     padding-top: 14px;
     padding-right: 12px;
     padding-bottom: 7px;
     padding-left: 12px;
     border-radius: 6px;
}

#forgot-password {
  width: 122px;
  margin: 0;
  height: 100%;
}

#vertical-bar {
  margin-left: 8px;
}

#forgot-username {
  margin-left: 8px;
  width: 122px;
}

.info-div {
  min-height: 26px;
  margin-bottom: 8px;
}

.info-text {
	font-family: Roboto;
    font-weight: 400;
    font-style: Normal;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 26px;
    letter-spacing: 0%;
    text-decoration-style: solid;
    text-decoration-offset: 0%;
    text-decoration-thickness: 0%;
	color: var(--Teal-Teal-Dark, #06748C);
}

.underline-link {
  text-decoration-line: underline !important;
  color: var(--Teal-Teal-Dark, #06748C);
}

#assistance, #days-open, #dot{
  text-decoration-line: : none !important;
  color: var(--Gray-Dark-Gray, #343741);
}

#hr-line {
  height: 0px;
  border: 0.5px solid var(--Gray-Gray-25, #C0BFC0);
  margin-top: 24px;
  margin-bottom: 24px;
}
#other-portals {
	font-weight: 300;
	font-size: 24px;
	line-height: 28.8px;
	text-decoration-line: : none !important;
    color: var(--Gray-Dark-Gray, #343741);
}
#small-commercial, #middle-market, #surety, #state-auto{
	 text-decoration: none !important;
	 color: var(--Teal-Teal-Dark, #06748C);
  }

#state-auto-div {
	margin-bottom: 0px !important;
}
.caret {
	width: 8px;
	height: 8px;
}

#LM-address-div {
  min-height: 74;
  padding-top: 24px;
  padding-right: 100px;
  padding-bottom: 24px;
  padding-left: 64px;
  gap: 10px;

  background: var(--Primary-Liberty-Blue, #1A1446);
}

#LM-address-text {
    min-height: 26px;

    font-family: Roboto;
    font-weight: 400;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 25.6px;
    letter-spacing: 0%;
    color: #FFFFFF;
}

#policy-div {
   min-height: 148px;
   display: flex;
   padding-left: 64px;
   padding-right: 64px;
   gap: 49px;
   border-top-left-radius: 48px;
   border-top-right-radius: 48px;

   background: var(--Gray-Atmos-White, #F5F5F5);
}

#logo-medallion {
   margin-top: 24px;
   height: 84px;
   width: 65px;
}


#policy-links-div {
  margin-top: 32px;
  min-height: 68px;
}

#do-not-sell-info {
  white-space: nowrap;
}

@media only screen and (max-width: 675px) {
  #do-not-sell-info {
    white-space: normal;
  }
}

@media only screen and (max-width: 430px) {
    #header_row {
      height: 96px;
      padding: 0px 16px;
    }
    #header-image {
      height: 72px;
      width: 109px;
      object-fit: fill;
    }

    #lm-header-logo {
      display: none;
    }
    #lm-header-logo-mobile {
          display: block;
    }

    #app_name {
      height: 72px;
    }
   .topAndBottomSpacer {
       height: 64px;
   }

   .full-width-element {
           width: 343px !important;
       }

   .headline-text {
   	font-size: 36px;
   	line-height: 43.2px;
   	letter-spacing: 0%;
    height: 44px;
   }

  #policy-links-bottom-row {
    margin-bottom: 14px;
  }
  #policy-div {
     display: flex;
     flex-direction: column;
     padding-left: 16px;
     padding-right: 16px ;
     gap: 0px;
  }
  #LM-address-div {
    font-size: 12px;
    padding-right: 16px;
    padding-left: 16px;
    gap: 12px;
  }
  #LM-address-text {
      font-size: 12px;
    }
}

#policy-links-bottom-row {
   margin-top: 16px;
   margin-left: 4px;
}

.policy-links {
   height: 26;
   padding-right: 4px;
   padding-left: 4px;
   gap: 8px;

   font-family: Roboto;
   font-weight: 400;
   font-size: 16px;
   leading-trim: NONE;
   line-height: 25.6px;
   letter-spacing: 0%;
   text-decoration: underline;
   text-decoration-style: solid;
   text-decoration-offset: 0%;
   text-decoration-thickness: 0%;
    color: var(--Primary-Liberty-Blue, #1A1446);
}

/* ----------------------------------------------------------------

body {
   background-color: white;
   color: black;
   margin: 0px;
   background-repeat: repeat-x;
   background-image: url(../images/header_background.png);
}

body, input, select {
   font: normal 11pt 'Segoe UI', Arial, sans-serif;
}

input {
	font-size: 10pt;
}

input[type="text"], input[type="password"] {
   border: solid 1px #707070;
   padding: 4px;
}

input[type="button"], input[type="submit"] {
   border: solid 1px #707070;
   padding: 4px 6px;
   margin: 0;
	text-align: center;
	height: auto;
	font-weight: bold;
}

select {
   min-width: 200px;
   max-width: 500px;
   margin: 5px 0;
   height: 1.7em;
   font-size: 100%;
}

a, a:active, a:visited, a:hover {
	color: #0060bf;
}

.hide {
	display: none;
}

.show {
	display: inline;
}

.table_master {
	margin: 0 auto;
	padding: 20px;
	padding-top: 30px;
}

#table_content {
	margin: 0 auto;
	width: 600px;
}

#table_main {
	border: 1px solid #cccccc;
	width: 100%;
	margin: 10px auto;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

#table_main tr td {
	margin: 0;
	padding: 6px;
}

#table_main tr td.td_banner {
	text-align: center;
	font-weight: bold;
	padding: 8px 4px;
}

.div_customtext {
	width: 100%;
	padding: 0px 4px;
	padding-bottom: 0;
	font-size: 12pt;
}

#td_table_login {
	padding: 0 6px !important;
}

#table_login {
   background-color: #f3f3f3;
	margin: 0px auto;
	width: 100%;
	padding: 8px;
}

#table_login tr td {
	text-align: left;
	color: #666666;
	font-weight: bold;
	font-size: 12pt;
	white-space: nowrap;
	margin: 0;
	padding: 6px;
}

#table_login tr:nth-child(1) td:nth-child(2) input {
	width: 220px;
}

#table_login tr:nth-child(2) td:nth-child(2) input {
	width: 140px;
}

#table_login tr:nth-child(2) td:last-child input {
	width: 70px;
}

#table_login tr td.td_error {
	padding-top: 6px;
	text-align: center;
	font-size: 10pt;
	color: #cc0000;
	font-weight: bold;
}

#table_login  tr #td_submit {
	padding-left: 0;
}

#table_login a {
	text-decoration: none;
}

.tr_troubleshoot  td {
	text-align: left;
	font-weight: normal;
	font-size: 10pt;
	padding: 0 0 0 0;
}

.tr_resetcreds  td {
	text-align: center;
	font-weight: normal;
	font-size: 10pt;
	padding: 0 0 6px 0;
}

#tr_boilerplate table {
	width: 100%;
	border-top: solid 1px #cccccc;
}

#tr_boilerplate table tr td {
	font-size: 8pt;
	color: #666666;
	padding: 4px 0 4px 24px;
	width: 70%;
}

#tr_boilerplate table tr td:last-child {
	width: 30%;
	text-align: left;
}

.table_help tr td {
	margin: 0;
	padding: 6px !important;
}

.table_help tr td.td_divider {
	padding: 0 !important;
	width: 1px;
	max-width: 1px;
	font-size: 1px;
	background: url(../images/hline.png);
}

.table_help tr td.table_helptext_td {
	min-width: 200px;
	max-width: 200px;
	padding: 0 10px !important;
}

.table_help table {
	margin: auto;
	width: 200px;
	font-size: 10pt;
}

.TextSizeXLarge     { font-size: 146%; }
.TextSizeLarge      { font-size: 125%; }
.TextSizeSmall      { font-size: 92%;  }

.TextWeightBold     { font-weight: bold; }

.GroupXXLargeMargin { margin: 8px 0px 20px; }
.GroupXLargeMargin  { margin: 8px 0px 12px; }
.GroupLargeMargin   { margin: 5px 0px 8px;  }
.GroupNormalMargin  { margin: 0px 0px 5px;  }

.RightAlign {
   text-align: right;
}

.NotRendered {
   display: none;
}

.NotShown {
   visibility: hidden;
   width: 1px;
   height: 1px;
}

.Spinner {
   display: block;
   margin: 40px auto 40px auto;
   text-align: center;
}


.RadioButtonGroup .Radio {
   vertical-align: bottom;
   margin: 4px 0 4px -3px;
}

.Radio .CtrlTextRight {
    padding-left: 4px;
}

.Indent1 {
   padding-left: 5px;
}

.Indent2 {
   padding-left: 27px;
}

CSS specific to tablets
@media only screen and (max-width: 960px) {
   #table_content {
      width: 480px;
   }
}

 CSS specific to smartphones
@media only screen and (max-width: 640px) {
   #table_content {
      width: 480px;
   }
}
@media only screen and (max-width: 480px) {
   #table_content {
      width: 100%;
   }

   #table_login tr:nth-child(1) td:nth-child(2) input {
   	width: 100%;
   }

   #table_login tr:nth-child(2) td:nth-child(2) input {
    	width: 100%;
   }

   #table_login tr:nth-child(2) td:last-child input {
      margin-left: 8px;
    	width: 100%;
   }
}
 CSS for SafecoNow styling
#padlock {
	vertical-align: -3px;
}

#userid_label {
	padding-bottom: 0px;
	font-size: 14pt;
	font-weight: bold;
   font-family: Arial;
}

#ldappwd_label {
	font-size: 14pt;
	font-weight: bold;
   font-family: Arial;
}

#submit1 {
   float: right;
   border: solid 1px #985000;
   border-radius: 3px;
	font-weight: bold;
}

#td_support {
   text-align: left !important;
   font-family: Arial;
	font-size: 12pt;
}

#ul_support {
	padding-left: 12px;
}

#username {
   width: 99%;
}

#password {
   width: 99%;
}

#td_submit {
	padding: 15px 0px 20px 0px;
}

#td_banner {
   text-align: left !important;
	padding-left: 25px;
}

#td_main_left {
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 15px;
}

#td_boilerplate_text {
	text-align: center;
}

.link_site:after {
   content: url('../images/btn_internal_link_sm_u.png');
   color: #0058B2;
   text-decoration: underline;
   margin-left: 3px;
   vertical-align: middle;
   position: relative;
   top: 2px;
}

.link_site:hover {
   text-decoration: underline;
}

.link_site:visited {
   text-decoration: underline;
   color: #551A8B;
}
 */