:root {
  --procore-black: #000000;
  --procore-orange: #FF5200;
  --asphalt: #181818;
  --slate: #282828;
  --concrete: #555555;
  --rebar: #63656A;
  --steel: #898B8E;
  --stone: #9FA2A3;
  --iron: #A3A4A6;
  --granite: #C2C6C9;
  --aluminum: #E3E4E6;
  --glass: #F4F5F6;
  --white: #FFFFFF;
  --brick: #A12B2F;
  --mud: #802629;
  --clay: #BD3C4B;
  --cone: #FF6C00;
  --flare: #E14504;
  --traffic: #FF6D37;
  --crane: #FF9F19;
  --flashlight: #ED7800;
  --roadway: #FFB648;
  --viridian: #005C5E;
  --forest: #004C46;
  --tractor: #007574;
  --tarp: #0033A1;
  --cobalt: #002F6D;
  --painters-tape: #435CC8;
  --org-font-family: Inter, var(--rf-system-font-family);
  --org-font-family-heading: Inter, var(--rf-system-font-family);
  --org-font-size: 16px;
  --org-primary-color: var(--procore-black);
  --org-on-primary-color: var(--white) ;
  --org-heading-text-color: var(--procore-black);
  --org-body-text-color: var(--concrete);
  --org-base-unit: 4px;
  --org-base-spacing: calc(var(--org-base-unit) * 4);
  --org-frame-background-color: var(--rf-brand-color-surface);
  --org-content-width: 1440px;
  --rf-brand-color-primary: var(--org-primary-color);
  --rf-brand-color-primary-hover: var(--org-button-primary-hover-color);
  --rf-brand-color-on-primary: var(--org-on-primary-color);
  --rf-brand-color-border: var(--org-border-color);
  --rf-brand-font-family: var(--org-font-family);
  --rf-brand-font-size: var(--org-font-size);
  --rf-brand-color-text-heading: var(--org-heading-text-color);
  --rf-brand-color-text-body: var(--org-body-text-color);
  --rf-brand-shape-radius: var(--org-button-radius);
  --rf-brand-shape-radius-lg: calc(var(--rf-brand-shape-radius) * 2);
  --rf-comp-button-font-size: 1.125rem;
  --rf-comp-button-shape-radius: 4px;
  --rf-comp-button-space-padding: 12px 24px;
  --rf-comp-button-primary-color-background: var(--procore-orange);
  --rf-comp-button-primary-color-border: var(--procore-orange);
  --rf-comp-button-primary-color-on-background: var(--white);
  --rf-comp-button-primary-hover-color-background: var(--flare);
  --rf-comp-button-primary-hover-color-border: var(--flare);
  --rf-comp-button-primary-hover-color-on-background: var(--white);
  --rf-comp-button-secondary-color-background: transparent;
  --rf-comp-button-secondary-color-border: transparent;
  --rf-comp-button-secondary-color-on-background: var(--procore-orange);
  --rf-comp-button-secondary-hover-color-background: transparent;
  --rf-comp-button-secondary-hover-color-border: transparent;
  --rf-comp-button-secondary-hover-color-on-background: var(--procore-black);
  --rf-comp-checkbox-color: var(--iron);
  --rf-comp-radio-color: var(--iron);
  --rf-comp-input-color-border: var(--aluminum);
  --rf-comp-input-shape-radius: 4px;
}

* {
  box-sizing: border-box;
}

.display-one {
  font-weight: 700;
  font-size: 2.75rem;
  line-height: 3rem;
  letter-spacing: -0.025em;
}
@media all and (max-width: 549px) {
  .display-one {
    font-weight: 700;
    font-size: 2.125rem;
    line-height: 2.5rem;
    letter-spacing: -0.025em;
  }
}

.display-two {
  font-weight: 700;
  font-size: 2.125rem;
  line-height: 2.5rem;
  letter-spacing: -0.025em;
}

.display-three {
  font-weight: 700;
  font-size: 1.75rem;
  line-height: 2.25rem;
  letter-spacing: 0;
}

.heading-four {
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 2rem;
  letter-spacing: 0;
}

.heading-five {
  font-weight: 700;
  font-size: 1.25rem;
  line-height: 1.75rem;
  letter-spacing: 0;
}

.eyebrow {
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.25rem;
  letter-spacing: 0.05em;
}

.instruction-eyebrow {
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1rem;
  letter-spacing: 0.05em;
}

.hero-subheading {
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.75rem;
  letter-spacing: 0;
}

.body-copy {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.5rem;
  letter-spacing: 0;
}

.body-copy-small {
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.25rem;
  letter-spacing: 0;
}

.body-copy-extra-small {
  font-weight: 400;
  font-size: 0.75rem;
  line-height: 1rem;
  letter-spacing: 0;
}

.bullet-list {
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.5rem;
  letter-spacing: 0;
}

.body-xxs {
  font-weight: 400;
  font-size: 0.625rem;
  line-height: 0.875rem;
}

.procore-dark-section h1, .procore-dark-section .title-1, .procore-dark-section h2, .procore-dark-section .title-2, .procore-dark-section h3, .procore-dark-section .title-3, .procore-dark-section h4, .procore-dark-section .title-4, .procore-dark-section h5, .procore-dark-section .title-5, .procore-dark-section h6, .procore-dark-section .title-6,
.procore-dark-section .body-0, .procore-dark-section .body-1, .procore-dark-section .body-2, .procore-dark-section .body-3, .procore-dark-section p,
.procore-dark-section a, .procore-dark-section a:link, .procore-dark-section a:visited,
.procore-dark-section a:hover, .procore-dark-section a:focus, .procore-dark-section a:link:hover, .procore-dark-section a:link:focus, .procore-dark-section a:visited:hover, .procore-dark-section a:visited:focus,
.procore-dark-section ul, .procore-dark-section li, .procore-dark-section ol, .procore-dark-section ul li, .procore-dark-section ol li,
.procore-dark-section .mdBtnR-link .mdBtnR-text,
.procore-dark-section a.mdBtnR-link .mdBtnR-text {
  color: var(--white);
}

.wf-form-element-div label.rf-label span.label-text {
  font-weight: 700;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

#contact-info form:before {
  display: block;
  margin-bottom: 24px;
  content: "Registration";
  font-weight: 700;
  font-size: 1.75rem;
  line-height: 2.25rem;
  letter-spacing: 0;
}

.rfwf-body-content.rf-workflow-body-content:has(#workflow-login-page) {
  background-color: transparent;
}

.rfwf-body-content.rf-workflow-body-content:has(#bulkPackagesDashboard) {
  max-width: 1260px;
}

.orders-page .rf-single-select .rf-select-selected li {
  text-overflow: clip;
}
.orders-page .md-frame {
  box-shadow: none;
  border: none;
}
.orders-page .rfwf-full-panel .rfwf-panel-interior, .orders-page .rfwf-alert-panel .rfwf-panel-interior {
  padding: 0;
}
.orders-page .accordion-content.rfwf-package-items .rfG-fluid-container {
  padding-inline: 0;
}
.orders-page .accordion-content.rfwf-package-items .rfG-fluid-container .rfG-row {
  display: flex;
}
.orders-page .accordion-content.rfwf-package-items .rfG-fluid-container .rfG-row .package-quantity {
  width: 15%;
  min-width: 88px;
  margin-left: 0;
}
.orders-page .accordion-content.rfwf-package-items .rfG-fluid-container .rfG-row .package-quantity label {
  display: none;
}
@media all and (max-width: 768px) {
  .orders-page .accordion-content.rfwf-package-items .rfG-fluid-container .rfG-row {
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
.orders-page .accordion-content.rfwf-package-items .rfG-fluid-container .rfG-row:before, .orders-page .accordion-content.rfwf-package-items .rfG-fluid-container .rfG-row:after {
  display: none;
}
.orders-page .rfG-fluid-container.package-sub-item .rfG-row div:has(> .rf-checkbox-wrapper) {
  margin-left: 0;
}
.orders-page .rfG-fluid-container .rfG-row div:has(> .rf-checkbox-wrapper.has-tooltip.no-label) {
  min-width: 48px;
}

.rfwf-body-content.rf-workflow-body-content:has(.orders-page) .rf-workflow-header {
  padding: 0;
}
.rfwf-body-content.rf-workflow-body-content:has(.orders-page) .rf-workflow-header .rfwf-full-panel {
  padding: 0;
}

.reg-confirmation-summary .grid-table .table {
  min-width: auto;
}

.special-div .rfwf-body-content:has(#workflow-login-page) {
  padding: 0;
  max-width: 1260px;
}

.special-div:has(#workflow-login-page) {
  padding-inline: 24px;
}

#workflow-login-page .rfwf-panel-interior {
  max-width: 100%;
  padding: 0;
  column-gap: 24px;
  display: flex;
}
@media all and (max-width: 768px) {
  #workflow-login-page .rfwf-panel-interior {
    flex-direction: column;
  }
}
#workflow-login-page .rfwf-panel-interior .md-frame.create-account-frame, #workflow-login-page .rfwf-panel-interior .md-frame.login-frame {
  padding: 48px;
  height: 100%;
}
@media all and (max-width: 549px) {
  #workflow-login-page .rfwf-panel-interior .md-frame.create-account-frame, #workflow-login-page .rfwf-panel-interior .md-frame.login-frame {
    padding: 24px;
  }
}
#workflow-login-page .rfwf-panel-interior .rfG-md-50 {
  padding: 0;
}
#workflow-login-page .rfwf-panel-interior:after, #workflow-login-page .rfwf-panel-interior:before {
  display: none;
}

.login-submit-frame .mdBtnR {
  width: auto;
}

.md-frame.create-account-frame .md-frame-footer {
  display: flex;
  justify-content: center;
}

.rfwf-full-panel.rfwf-orders-payment .payment .rfG-row {
  display: flex;
  flex-wrap: wrap;
}
.rfwf-full-panel.rfwf-orders-payment .payment .rfG-row .rfG-md-25 {
  flex-basis: 50%;
}
@media all and (max-width: 768px) {
  .rfwf-full-panel.rfwf-orders-payment .payment .rfG-row .rfG-md-25 {
    flex-basis: 100%;
  }
}

[data-test=rf-checkbox-wrapper-store-card] {
  display: none;
}

#bulkPackagesDashboard .table-results-container .md-frame-search .rf-single-select .rf-single-select {
  padding: 0;
}

.confirmation-page .rfwf-confirmation-contact-info .rfG-row h1, .confirmation-page .rfwf-confirmation-contact-info .rfG-row h2, .confirmation-page .rfwf-confirmation-contact-info .rfG-row h3, .confirmation-page .rfwf-confirmation-contact-info .rfG-row h4, .confirmation-page .rfwf-confirmation-contact-info .rfG-row h5, .confirmation-page .rfwf-confirmation-contact-info .rfG-row h6, .confirmation-page .rfwf-confirmation-contact-info .rfG-row p, .confirmation-page .rfwf-confirmation-contact-info .rfG-row div {
  word-wrap: break-word;
}
.confirmation-page .rfwf-confirmation-buttons .mdBtnR-outline-primary {
  text-transform: none;
}

.mdBtnR,
a.mdBtnR {
  text-transform: capitalize;
}
.mdBtnR.mdBtnR-outline-primary {
  text-decoration: underline;
}
.mdBtnR.mdBtnR-outline-primary:hover {
  text-decoration: underline;
}
.mdBtnR.mdBtnR-outline-primary .mdBtnR-text {
  text-decoration: underline;
}
.mdBtnR.mdBtnR-outline-primary .mdBtnR-text:hover {
  color: var(--rf-comp-button-secondary-hover-color-on-background);
}

.mdBtnR.mdBtnR-outline-primary.pull-left {
  color: var(--procore-black);
  background-color: var(--glass);
  border-color: var(--glass);
  text-decoration: none;
}
.mdBtnR.mdBtnR-outline-primary.pull-left .mdBtnR-text {
  color: var(--procore-black);
  text-decoration: none;
}
.mdBtnR.mdBtnR-outline-primary.pull-left svg {
  fill: var(--procore-black);
}
.mdBtnR.mdBtnR-outline-primary.pull-left svg:hover, .mdBtnR.mdBtnR-outline-primary.pull-left svg:focus, .mdBtnR.mdBtnR-outline-primary.pull-left svg.active {
  fill: var(--procore-black);
}
.mdBtnR.mdBtnR-outline-primary.pull-left:hover, .mdBtnR.mdBtnR-outline-primary.pull-left:focus, .mdBtnR.mdBtnR-outline-primary.pull-left.active {
  color: var(--procore-black);
  background-color: var(--aluminum);
  background-image: none;
  border-color: var(--aluminum);
  text-decoration: none;
}
.mdBtnR.mdBtnR-outline-primary.pull-left:hover .mdBtnR-text, .mdBtnR.mdBtnR-outline-primary.pull-left:focus .mdBtnR-text, .mdBtnR.mdBtnR-outline-primary.pull-left.active .mdBtnR-text {
  color: var(--procore-black);
  text-decoration: none;
}
.mdBtnR.mdBtnR-outline-primary.pull-left:hover svg, .mdBtnR.mdBtnR-outline-primary.pull-left:focus svg, .mdBtnR.mdBtnR-outline-primary.pull-left.active svg {
  fill: var(--procore-black);
}
.mdBtnR.mdBtnR-outline-primary.pull-left:hover svg:hover, .mdBtnR.mdBtnR-outline-primary.pull-left:hover svg:focus, .mdBtnR.mdBtnR-outline-primary.pull-left:hover svg.active, .mdBtnR.mdBtnR-outline-primary.pull-left:focus svg:hover, .mdBtnR.mdBtnR-outline-primary.pull-left:focus svg:focus, .mdBtnR.mdBtnR-outline-primary.pull-left:focus svg.active, .mdBtnR.mdBtnR-outline-primary.pull-left.active svg:hover, .mdBtnR.mdBtnR-outline-primary.pull-left.active svg:focus, .mdBtnR.mdBtnR-outline-primary.pull-left.active svg.active {
  fill: var(--procore-black);
}
.mdBtnR.mdBtnR-outline-primary.pull-left .mdBtnR-text {
  text-decoration: none;
}

.rf-org-header-container .nav a.primary-nav-action {
  color: var(--rf-comp-button-primary-color-on-background);
}
.rf-org-header-container .nav a.primary-nav-action:hover, .rf-org-header-container .nav a.primary-nav-action:focus, .rf-org-header-container .nav a.primary-nav-action:active {
  color: var(--rf-comp-button-primary-hover-color-on-background);
}

.confirmation-page .pull-right .mdBtnR {
  color: var(--rf-comp-button-primary-color-on-background);
  background-color: var(--rf-comp-button-primary-color-background);
  border-color: var(--rf-comp-button-primary-color-border);
  box-shadow: var(--rf-comp-button-primary-elevation-shadow);
  text-decoration: none;
}
.confirmation-page .pull-right .mdBtnR .mdBtnR-text {
  color: var(--rf-comp-button-primary-color-on-background);
  text-decoration: none;
}
.confirmation-page .pull-right .mdBtnR svg {
  fill: var(--rf-comp-button-primary-color-on-background);
}
.confirmation-page .pull-right .mdBtnR svg:hover, .confirmation-page .pull-right .mdBtnR svg:focus, .confirmation-page .pull-right .mdBtnR svg.active {
  fill: var(--rf-comp-button-primary-color-on-background);
}
.confirmation-page .pull-right .mdBtnR:hover, .confirmation-page .pull-right .mdBtnR:focus, .confirmation-page .pull-right .mdBtnR.active {
  color: var(--rf-comp-button-primary-hover-color-on-background);
  background-color: var(--rf-comp-button-primary-hover-color-background);
  background-image: none;
  border-color: var(--rf-comp-button-primary-hover-color-border);
  text-decoration: none;
  box-shadow: var(--rf-comp-button-primary-hover-elevation-shadow);
  transform: var(--rf-comp-button-hover-motion-transform);
}
.confirmation-page .pull-right .mdBtnR:hover .mdBtnR-text, .confirmation-page .pull-right .mdBtnR:focus .mdBtnR-text, .confirmation-page .pull-right .mdBtnR.active .mdBtnR-text {
  color: var(--rf-comp-button-primary-hover-color-on-background);
  text-decoration: none;
}
.confirmation-page .pull-right .mdBtnR:hover svg, .confirmation-page .pull-right .mdBtnR:focus svg, .confirmation-page .pull-right .mdBtnR.active svg {
  fill: var(--rf-comp-button-primary-hover-color-on-background);
}
.confirmation-page .pull-right .mdBtnR:hover svg:hover, .confirmation-page .pull-right .mdBtnR:hover svg:focus, .confirmation-page .pull-right .mdBtnR:hover svg.active, .confirmation-page .pull-right .mdBtnR:focus svg:hover, .confirmation-page .pull-right .mdBtnR:focus svg:focus, .confirmation-page .pull-right .mdBtnR:focus svg.active, .confirmation-page .pull-right .mdBtnR.active svg:hover, .confirmation-page .pull-right .mdBtnR.active svg:focus, .confirmation-page .pull-right .mdBtnR.active svg.active {
  fill: var(--rf-comp-button-primary-hover-color-on-background);
}