@font-face {
  font-family: 'Chivo-Regular';
  src:  url('/sfsites/c/resource/Chivo/Chivo-Regular.ttf') format('truetype');
}
@font-face {
  font-family: 'Chivo-Light';
  src:  url('/sfsites/c/resource/Chivo/Chivo-Light.ttf') format('truetype');
}
@font-face {
  font-family: 'Chivo-Bold';
  src:  url('/sfsites/c/resource/Chivo/Chivo-Bold.ttf') format('truetype');
}
@font-face {
  font-family: 'Chivo-Italic';
  src:  url('/sfsites/c/resource/Chivo/Chivo-Italic.ttf') format('truetype');
}

/* Document
 ========================================================================== */

/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/

html {

line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
 ========================================================================== */

/**
* Remove the margin in all browsers.
*/

body {
margin: 0;
}

/**
* Render the `main` element consistently in IE.
*/

main {
display: block;
}

/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/

h1 {
font-size: 2em;
margin: 0.67em 0;
}

/* Grouping content
 ========================================================================== */

/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/

hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/

pre {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}

/* Text-level semantics
 ========================================================================== */

/**
* Remove the gray background on active links in IE 10.
*/

a {
background-color: transparent;
}

/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/

abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}

/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/

b,
strong {
font-weight: bolder;
}

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}

/**
* Add the correct font size in all browsers.
*/

small {
font-size: 80%;
}

/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/

sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}

sub {
bottom: -0.25em;
}

sup {
top: -0.5em;
}

/* Embedded content
 ========================================================================== */

/**
* Remove the border on images inside links in IE 10.
*/

img {
border-style: none;
}

/* Forms
 ========================================================================== */

/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/

button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}

/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/

button,
input { /* 1 */
overflow: visible;
}

/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/

button,
select { /* 1 */
text-transform: none;
}

/**
* Correct the inability to style clickable types in iOS and Safari.
*/

button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}

/**
* Remove the inner border and padding in Firefox.
*/

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}

/**
* Restore the focus styles unset by the previous rule.
*/

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}

/**
* Correct the padding in Firefox.
*/

fieldset {
padding: 0.35em 0.75em 0.625em;
}

/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
*    `fieldset` elements in all browsers.
*/

legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}

/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/

progress {
vertical-align: baseline;
}

/**
* Remove the default vertical scrollbar in IE 10+.
*/

textarea {
overflow: auto;
}

/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/

[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}

/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}

/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/

[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}

/**
* Remove the inner padding in Chrome and Safari on macOS.
*/

[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}

/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}

/* Interactive
 ========================================================================== */

/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/

details {
display: block;
}

/*
* Add the correct display in all browsers.
*/

summary {
display: list-item;
}

/* Misc
 ========================================================================== */

/**
* Add the correct display in IE 10+.
*/

template {
display: none;
}

/**
* Add the correct display in IE 10.
*/

[hidden] {
display: none;
}
/* site css */
.siteforceCptBody .siteforceContentArea .contentRegion {
  padding: 0 !important;
}
.siteforceCptBody .cHeader .selfServiceProfileMenuTrigger .trigger-link{
  background: url(rte_img/rte_img/Login.svg) no-repeat !important;
  padding-left: 28px;
  background-position: 0 !important;
}
.selfServiceUserProfileMenu .uiMenuItem.home,
.selfServiceUserProfileMenu .uiMenuItem.profile, 
.selfServiceUserProfileMenu .uiMenuItem.myAccount {
  display: none;
  visibility: hidden;
}
.comm-navigation__list > li a[title="Home"] { /* hide home tab */
  display: none;
  visibility: hidden;
}
.siteforceCptBody .cLogo{
  display: none;
  visibility: hidden;
}
/*=============================Custom style=================================================*/
h1, .heading1{
  color: #333333;
  font-size: 48px;
  font-weight: 600;
  line-height: 60px;
  margin: 0;
}
h2, .heading2{
  font-size: 32px;
  font-weight: 600;
  line-height: 40px;
}
h3, .heading3{
  font-size: 20px;
  line-height: 25px;
}
h5, .heading5{
  color: #333333;
  font-size: 16px;
  font-weight: bold;
  line-height: 18px;
}
.mainContent{
  width: 85%;
  margin: 0 auto;
  
}
.wdn-text-hidden{
  font-size: 0;
  width: 1px;
  height: 1px;
  display: inline-block;
  overflow: hidden;
  position: absolute!important;
  border: 0!important;
  padding: 0!important;
  margin: 0!important;
  clip: rect(1px,1px,1px,1px);
}
.reportNav lightning-icon svg, .info lightning-icon svg{
  fill: #00324D !important;
}
.incompleteText lightning-icon svg{
  fill: red !important;
}
.reportNav .success svg{
  fill: #00AA69 !important;
}
.reportNav .tabActiveselected lightning-icon svg{
  fill: #fff !important;
}
.generalText {
  font-size: 14px;
  line-height: 23px;
}
.vehicleNote, .vehicleUl{
  font-size: 14px;
  letter-spacing: 0;
  line-height: 17.5px;
  padding: 2px 4px 11px;
  clear: both;
}
.vehicleUl{
  list-style: disc;
  padding: 2px 17px 11px;
}
.modelContent{
  padding: 32px;
  position: relative;
  border-radius: 4px;
}
.slds-modal__close {
  top: 1rem;
  right: 1rem;
}
.slds-modal__container h5, .slds-modal__container h3{
  font-family: 'Chivo-Light';
}
.light{
  font-family: 'Chivo-Light';
}
.buttonWrapper{
  margin: 0 auto;
}
.buttonWrapper > button, .buttonWrapper > a{
  display: block;
}

/*************************Form start************************************/

.boldClass{
  font-weight: bold;
}
.boldFontClass{
  font-family: "Chivo-Bold";
}
.inputBox{
  font-size: 16px;
  line-height: 1.5em;
}
.formWrapper .slds-form-element__label{
  font-size: 16px;
}
.formWrapper .subLabel .slds-form-element__label{
  font-size: 14px;
}
.formWrapper .slds-input{
  height: 2.8em;
}
.formWrapper .slds-textarea{
  min-height: 7em;
}
.bigCheckbox  .slds-form-element__label{
  font-size: 16px !important;
}
.bigCheckbox{
  xzoom:1.6;
}
.proceedBtn{
  border-radius: 4px;
  xbackground-color: #263174;
  font-weight: 600;
  line-height: 2.3rem;
  letter-spacing: 0.06em;
  margin: 2em 0;
} 
.proceedBtn:focus{
  outline: 2px solid rgb(0, 50, 77);
  outline-offset: 2px;
}
.nextBtn{
  color: #333333;
  background-color: #fff;
  width: 100%;
  padding: 5px;
  font-size: 16px;
  border-radius: 4px;
  font-weight: 600;
  line-height: 2.3rem;
  letter-spacing: 0.06em;
  margin: 2em 0;
}
.nextBtn.slds-button_brand:active{
  xbackground-color: #fff;
}
.customCombobox .selectorInput .slds-input,
.customCombobox .selectorInput .slds-input:focus,
.customCombobox .selectorInput .slds-has-error .slds-input{
  border:0 !important;
  border-color: transparent;
  box-shadow: none;
  height: 2.4em;
  margin-top: 1px;
}
.customCombobox .selectorInput.slds-has-error {
  background-color: var(--lwc-colorBackgroundInput,rgb(255, 255, 255));
  border-color: var(--lwc-colorBorderError,rgb(194, 57, 52));
  box-shadow: var(--lwc-colorBorderError,rgb(194, 57, 52)) 0 0 0 var(--lwc-borderWidthThin,1px) inset;
  background-clip: padding-box;
  padding-left: 3px;
}
lightning-combobox{
  font-size: 16px;
}
.addressType .slds-form-element__label, .genderType .slds-form-element__label, .subscribe .slds-form-element__label {
  xfont-size: 10px !important;
}
.addressType fieldset, .genderType fieldset, .subscribe fieldset{
  padding-left: 0 !important;
}
.addressType, .genderType, .subscribe{
  line-height: 1.2;
}
a.underline{
  text-decoration: underline;
}

/*************************Form end************************************/
/*************************radio start************************************/
.radio-toolbar > div{
  margin: 10px 5px 10px 0;
  float: left;
}

.radio-toolbar .registerationState{
  width: 130px;
}

.radio-toolbar label:hover {
  background-color: #CCDBE3;
}

.radio-toolbar input[type="radio"]:focus + label   {
  border: 1px #ccc solid;
}

.radio-toolbar .slds-radio__label > .slds-radio_faux{
  opacity: 0;
  position: fixed;
  width: 0;
}
.radio-toolbar .slds-radio__label{
  padding: 10px 4px;
  height: 7.5em;
  width: 135px; /*155px;*/
  background-color: #FFFFFF;
  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2);
  color: #333333;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 22px !important;
  text-align: center;
  display: table-cell;
  vertical-align: middle;

  word-break: keep-all;
  -webkit-hyphens: none;
  -moz-hyphens:    none;
  -ms-hyphens:     none;
  hyphens:         none;
  
}
.radio-toolbar label:hover, .radio-toolbar  .slds-radio__label:hover {
  background-color: #CCDBE3;
}
.radio-toolbar input[type="radio"]:focus + .slds-radio__label    {
  border: 1px #ccc solid;
}
.radio-toolbar input[type="radio"]:checked + labels,
.radio-toolbar .slds-radio [type="radio"]:checked + .slds-radio__label,
.radio-toolbar .slds-radio input[type="radio"]:checked + .slds-radio__label{
background-color: #00324d;
border: 1px #006200 solid;
}
.radio-toolbar .slds-radio [type="radio"]:checked + .slds-radio__label .slds-form-element__label{
  color:#fff;
  font-family: "Chivo-Bold";
}
.modelContent lightning-input *{
  font-size: 16px;
}
.error{
  color: rgb(194, 57, 52);
}
.customRadio.slds-has-error lightning-input{
  border: 1px rgb(194, 57, 52) solid;
}
/*************************radio end************************************/
.statusBox{
  background-color:  #FBEEE5;
  padding: 7px;
  font-family: 'Chivo-Bold';
  font-size: 14px;
  display: inline-block;
  margin-bottom: 5px;
}
.Pending .statusBox{
  background-color: #E5F6E6;
}
.Submitted .statusBox{
  background-color: #f4f4f7;
}

.dot {
  height: 13px;
  width: 13px;
  background-color: #DC5800;
  border-radius: 50%;
  display: inline-block;
  margin-right: 5px;
}
.Pending .dot{
  background-color: #00A908;
}
.Submitted .dot{
  background-color: #002664;
}
.rightMainContent .slds-has-error .slds-form-element__help,
.rightMainContent .error,
.signupbgcolor .slds-has-error .slds-form-element__help,
.signupbgcolor .error {
  color: #000;
  font-family: "Chivo-Bold";
  line-height: 2;
  background: url(close) no-repeat #f2d6d1;
  max-width: 33em;
  margin-top: 1px;
  background-size: 14px;
  background-position: 4px;
  padding-left: 26px;
}
.customCombobox .selectorInput.slds-has-error .slds-form-element__help{
  margin-top: 6px;
}
/* support start */
.support{
  width: 82% !important;
  margin: 0 auto !important;
  color: #000  !important;
}
/* support end */
.radio-toolbar .slds-radio [type=radio]:checked+.slds-radio__label .slds-radio_faux,
.radio-toolbar .slds-radio [type=radio]:focus+.slds-radio__label .slds-radio_faux{
  background-color: transparent;
  box-shadow: none;
}
.radio-toolbar .slds-radio [type=radio]:checked+.slds-radio__label .slds-radio_faux:after{
  opacity: 0;
}
.typeWrapper .slds-radio .slds-radio_faux, .observeWrapper .slds-radio .slds-radio_faux{
  width: 80px;
  height: 60px;
  border-radius: 0;
  position: relative;
  display: block;
  opacity: 1;
  background-size: 100%;
  background-position: center bottom !important;
  margin: 0 auto !important;
  border: 0;
}
.typeWrapper .slds-radio .slds-form-element__label{
  padding: 0;
}
.observeWrapper .slds-radio__label {
  padding: 0 4px;
  height: 9.5em;
}
.observeWrapper .slds-radio .slds-radio_faux{
  background-size: 80% !important;
}
.Car .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/CAR.svg) no-repeat center bottom !important;
}
.Car .slds-radio input[type="radio"]:checked + .slds-radio__label  .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/CAR_WHITE.svg) no-repeat center bottom !important;
}
.Bus .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/BUS.svg) no-repeat center bottom !important;
}
.Bus .slds-radio input[type="radio"]:checked + .slds-radio__label  .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/BUS_WHITE.svg) no-repeat center bottom !important;
}
.Motorcycle .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/MOTORCYCLE.svg) no-repeat center bottom !important;
}
.Motorcycle .slds-radio input[type="radio"]:checked + .slds-radio__label  .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/MOTORCYCLE_WHITE.svg) no-repeat center bottom !important;
}
.Plant .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/PLANT.svg) no-repeat center bottom !important;
}
.Plant .slds-radio input[type="radio"]:checked + .slds-radio__label  .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/PLANT_WHITE.svg) no-repeat center bottom !important;
}
.Trailer .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/TRAILER.svg) no-repeat center bottom !important;
}
.Trailer .slds-radio input[type="radio"]:checked + .slds-radio__label  .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/TRAILER_WHITE.svg) no-repeat center bottom !important;
}
.Truck .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/TRUCK.svg) no-repeat center bottom !important;
}
.Truck .slds-radio input[type="radio"]:checked + .slds-radio__label  .slds-radio_faux{
  background: url(rte_vehicle/rte_vehicle/TRUCK_WHITE.svg) no-repeat center bottom !important;
}

.thrown .slds-radio_faux{
  background: url(rte_img/rte_img/thrown.svg) no-repeat center bottom !important;
}
.thrown .slds-radio input[type="radio"]:checked + .slds-radio__label  .slds-radio_faux{
  background: url(rte_img/rte_img/thrown-white.svg) no-repeat center bottom !important;
}
.dropped  .slds-radio_faux{
  background: url(rte_img/rte_img/dropped.svg) no-repeat center bottom !important;
}
.dropped .slds-radio input[type="radio"]:checked + .slds-radio__label  .slds-radio_faux{
  background: url(rte_img/rte_img/dropped-white.svg) no-repeat center bottom !important;
}
.falling .slds-radio_faux{
  background: url(rte_img/rte_img/falling.svg) no-repeat center bottom !important;
}
.falling .slds-radio input[type="radio"]:checked + .slds-radio__label  .slds-radio_faux{
  background: url(rte_img/rte_img/falling-white.svg) no-repeat center bottom !important;
}
.blown .slds-radio_faux{
  background: url(rte_img/rte_img/blown.svg) no-repeat center bottom !important;
}
.blown .slds-radio input[type="radio"]:checked + .slds-radio__label  .slds-radio_faux{
  background: url(rte_img/rte_img/blown-white.svg) no-repeat center bottom !important;
}

.formWrapper .slds-input{
  color: #000;
  opacity: 1;
}
.formWrapper .slds-input:hover {
    background-image: linear-gradient(rgba(0,133,179,0.2),rgba(0,133,179,0.2));
}

/* Responsive Mobile css */
@media all and (min-width: 480px) {/* desktop and tablet only*/
  .desktopOnly {display:block;}
  .mobileOnly {display:none;}
  .siteforceCptBody .cHeaderTopInternalWrapper{
    width: 89%;
  }
  
}
@media only screen and (min-width : 768px){/* desktop only*/
  .siteforceCptBody .cHeader .selfServiceProfileMenuTrigger .trigger-link {
    background-size: 20px !important;
  }
}
@media only screen and (min-width : 768px) and (max-width : 1024px){ /*tablet only*/
    .navWrapper, .formWrapper{
        width: 100%;
    }
    
}
@media only screen and (max-width: 1024px) {/* tablet and mobile only*/
    .mainContent{
        width: 100%;
    }
    .siteforceCptBody .cHeaderTopInternalWrapper{
      width: 100%;
    }
}
@media all and (max-width: 765px) { /*mobile only*/
  .desktopOnly {display:none;}
  .mobileOnly {display:block;}
  .siteforceCptBody .siteforceContentArea.siteforceSldsOneColLayout>div.slds-col--padded.contentRegion {
    padding-right: 0;
    padding-left: 0;
  }
  .radio-toolbar lightning-input {
    margin: 10px 5px 10px 0;
    float: left;
  }
  .radio-toolbar .slds-radio .slds-form-element__label{
    -webkit-hyphens: none;
    -moz-hyphens: none;
    hyphens: none;
  }

  .dateClass .slds-form-element__control input,
  .timeClass .slds-form-element__control input{
    min-width: 240px;
  }
  /*
  .dateClass input[type="date"]::before, .timeClass input[type="date"]::before{
    content: attr(placeholder) ": ";
    width:100% !important;
    display:block;
  }
  .dateClass input[type="date"]:focus::before, .timeClass input[type="date"]:focus::before {
    content: "" !important;
  }
 */
  .support{
    width: 100% !important;
  }
  .formWrapper .dateClass .slds-input, .formWrapper .timeClass .slds-input {
    line-height: 40px;
  }
}

