/*  
---------------------------------------------------
Page Components
---------------------------------------------------  
*/
section.content {
  position: relative;
  display: block;
  height: auto;
}

section.content.p-0 .component-inner > .container-fluid {
  padding: 0;
}

section.content.p-0 .component-inner > .container-fluid > .row {
  margin: 0;
}

.content-col .component .component-inner > .container {
  padding: 0;
}

body:not(.full-page) section.content .content-col > section.content.component {
  padding: 0;
}

body:not(.full-page) section.content .content-col > section.content.component.base-bg {
  background: transparent !important;
}

body:not(.full-page) section.content .content-col > section.content.component:not(.base-bg):not(.p-0) {
  padding: var(--base-half-spacing);
}

body:not(.full-page) section.content .content-col > section.content.component:not(.base-bg):not(.p-0):not(:last-child) {
  margin-bottom: var(--pc-spacing);
}

body:not(.full-page) section.content .content-col > section.content.component:not(:last-child):not(.p-0) {
  padding-bottom: var(--pc-spacing);
}

body:not(.full-page) section.content .content-col > section.content.component.meta {
  padding-top: var(--content-col_pc-spacing);
}

body:not(.full-page) section.content .content-coll > section.content.component:not(.usn_cmp_banner):not(.base-bg):not(.p-0):first-child,
body:not(.full-page) section.content .content-coll > section.content.component:not(.usn_cmp_banner):not(.base-bg):not(.p-0) {
  padding: var(--base-spacing) !important;
}

.content .component-introduction, .content .component-outro {
  padding-bottom: calc(var(--pc-spacing) / 2);
  padding-top: calc(var(--pc-spacing) / 2);
  padding-left: 15px;
}

.residential-recycling-learn-more-header .component-introduction, .community-education-header .component-introduction {
  /*    padding-left: 0 !important;*/
  padding-top: calc(var(--pc-spacing) / 2);
}

.content .c3-bg-solid .component-introduction, .content .c3-bg-solid .outro {
  border: solid 1px red;
  padding-top: calc(var(--pc-spacing) * 2);
}

body:not(.full-page) section.content section.content.component .component-introduction {
  padding-bottom: var(--content-col_pc-spacing);
}

section.content .component-outro {
  padding-top: 0 !important;
  /*    padding-left: 0px;*/
}

section.content .component-outro .residential-get-started-text {
  padding-left: 0;
}

body:not(.full-page) section.content section.content.component .component-outro {
  padding-top: var(--content-col_pc-spacing);
}

div.info.col {
  padding-left: 0px;
  position: relative;
}

@media (min-width: 0) and (max-width: 575px) {
  section.content:not(.usn_cmp_banner):not(.usn_cmp_rumpkesimplebannerimage) {
    padding: calc(var(--pc-spacing) / 2) 0;
  }
  section.content.trash-pickup-get-started {
    padding-top: 15px !important;
  }
  section.content.careers-at-rumpke {
    padding: calc(var(--pc-spacing) / 2) calc(1.5% + 15px) !important;
  }
  section.content.active {
    padding-bottom: 0 !important;
  }
  section.content.usn_cmp_locationsearchform {
    padding: calc(var(--pc-spacing) / 2) 0;
  }
  section.component.our-story-component {
    padding: 0 40px !important;
  }
  section.content.dumpster-size-chart {
    padding-bottom: 20px !important;
  }
}
@media (min-width: 576px) {
  section.content:not(.usn_cmp_banner):not(.usn_cmp_rumpkesimplebannerimage) {
    padding: var(--pc-spacing_sm) 0;
  }
}
@media (min-width: 768px) {
  section.content:not(.usn_cmp_banner):not(.usn_cmp_rumpkesimplebannerimage) {
    padding: var(--pc-spacing_md) 0;
  }
}
@media (min-width: 992px) {
  section.content:not(.usn_cmp_banner):not(.usn_cmp_rumpkesimplebannerimage) {
    padding: var(--pc-spacing_lg) 0;
  }
  body:not(.full-page) section.content .content-col > section.content.component:not(.base-bg):not(.p-0) {
    padding: var(--base-spacing);
  }
}
@media (min-width: 1200px) {
  section.content:not(.usn_cmp_banner):not(.usn_cmp_rumpkesimplebannerimage) {
    padding: var(--pc-spacing_xl) 0;
  }
  section .usn_cmp_locationsearchform {
    padding: 10px 0px !important;
  }
}
section.content.compactors-for-rent {
  padding-top: 0px !important;
}

/*  
---------------------------------------------------
Max Width on a component

Custom class 'component-max-width' to max width any component. 
Adds spacing around the main component <section>.
Only works on layout 'Full Page'.
---------------------------------------------------  
*/
body.full-page section.content.component-max-width {
  margin: var(--pc-spacing);
  padding: var(--pc-spacing);
  max-width: calc(var(--component-max-width) - 30px);
  border-radius: var(--base-border-radius);
}

body.full-page section.content.component-max-width.usn_cmp_banner {
  padding: 0 !important;
}

@media (min-width: 0) and (max-width: 575px) {
  body.full-page section.content.component-max-width {
    margin: var(--pc-spacing);
    padding: var(--pc-spacing);
  }
}
@media (min-width: 576px) {
  body.full-page section.content.component-max-width {
    margin: var(--pc-spacing_sm);
    padding: var(--pc-spacing_sm);
  }
}
@media (min-width: 768px) {
  body.full-page section.content.component-max-width {
    margin: var(--pc-spacing_md);
    padding: var(--pc-spacing_md);
  }
}
@media (min-width: 992px) {
  body.full-page section.content.component-max-width {
    margin: var(--pc-spacing_lg);
    padding: var(--pc-spacing_lg);
  }
}
@media (min-width: 1200px) {
  body.full-page section.content.component-max-width {
    margin: var(--pc-spacing_xl);
    padding: var(--pc-spacing_xl);
  }
}
@media (min-width: 1350px) {
  body.full-page section.content.component-max-width {
    margin: var(--pc-spacing_xl) auto;
    padding: var(--pc-spacing_xl);
  }
}
/*  
---------------------------------------------------
Intro / Outro column widths
---------------------------------------------------  
*/
@media (min-width: 0) and (max-width: 575px) {
  section.content .component-introduction .info.col {
    flex: 0 0 var(--intro-col);
    -ms-flex: 0 0 var(--intro-col);
    max-width: var(--intro-col);
    margin-left: 0px;
  }
  section.content .component-outro .info.col {
    flex: 0 0 var(--outro-col);
    -ms-flex: 0 0 var(--outro-col);
    max-width: var(--outro-col);
  }
  section.content.component .content-col.center-col.col .component-introduction .info.col,
  section.content.component .content-col.center-col.col .component-outro .info.col,
  body:not(.full-page) section.content .content-col .component-introduction .info.col,
  body:not(.full-page) section.content .content-col .component-outro .info.col {
    flex: 0 0 100% !important;
    -ms-flex: 0 0 100%;
    max-width: 100% !important;
  }
}
@media (min-width: 576px) {
  section.content .component-introduction .info.col {
    flex: 0 0 var(--intro-col_sm);
    -ms-flex: 0 0 var(--intro-col_sm);
    max-width: var(--intro-col_sm);
  }
  section.content .component-outro .info.col {
    flex: 0 0 var(--outro-col_sm);
    -ms-flex: 0 0 var(--outro-col_sm);
    max-width: var(--outro-col_sm);
  }
}
@media (min-width: 768px) {
  section.content .component-introduction .info.col {
    flex: 0 0 var(--outro-col_md);
    -ms-flex: 0 0 var(--outro-col_md);
    max-width: var(--intro-col_md);
  }
  section.content .component-outro .info.col {
    flex: 0 0 var(--intro-col_md);
    -ms-flex: 0 0 var(--intro-col_md);
    max-width: var(--outro-col_md);
  }
}
@media (min-width: 992px) {
  section.content .component-introduction .info.col {
    flex: 0 0 var(--intro-col_lg);
    -ms-flex: 0 0 var(--intro-col_lg);
    max-width: var(--intro-col_lg);
  }
  section.content .component-outro .info.col {
    flex: 0 0 var(--outro-col_lg);
    -ms-flex: 0 0 var(--outro-col_lg);
    max-width: var(--outro-col_lg);
  }
}
@media (min-width: 1200px) {
  section.content .component-introduction .info.col {
    flex: 0 0 var(--intro-col_xl);
    -ms-flex: 0 0 var(--intro-col_xl);
    max-width: var(--intro-col_xl);
  }
  section.content .component-outro .info.col {
    flex: 0 0 var(--outro-col_xl);
    -ms-flex: 0 0 var(--outro-col_xl);
    max-width: var(--outro-col_xl);
    padding-left: 0px;
  }
}
section.content .component-outro .info.col {
  padding-left: 0px;
}

section.content.component .content-col.center-col.col .component-introduction .info.col,
section.content.component .content-col.center-col.col .component-outro .info.col,
body:not(.full-page) section.content .content-col .component-introduction .info.col,
body:not(.full-page) section.content .content-col .component-outro .info.col {
  flex: 0 0 var(--center-col_lg);
  -ms-flex: 0 0 100%;
  max-width: var(--center-col_lg);
}

section.content.component.usn_cmp_splitcomponent .item_block .component-introduction .info.col,
section.content.component.usn_cmp_splitcomponent .item_block .component-outro .info.col {
  flex: 0 0 100%;
  -ms-flex: 0 0 100%;
  max-width: 100%;
}

/*  
---------------------------------------------------
Center column widths
When a user chooses the center col width on a component setting
---------------------------------------------------  
*/
@media (min-width: 0) and (max-width: 575px) {
  section.content.component .content-col.center-col.col {
    flex: 3 0 var(--center-col);
    -ms-flex: 0 0 var(--center-col);
    max-width: calc(var(--center-col) * 2);
  }
}
@media (min-width: 576px) {
  section.content.component .content-col.center-col.col {
    flex: 3 0 var(--center-col_sm);
    -ms-flex: 0 0 var(--center-col_sm);
    max-width: calc(var(--center-col_sm) * 2);
  }
}
@media (min-width: 768px) {
  section.content.component .content-col.center-col.col {
    flex: 3 0 var(--center-col_md);
    -ms-flex: 0 0 var(--center-col_md);
    max-width: calc(var(--center-col_md) * 2);
  }
}
@media (min-width: 992px) {
  section.content.component .content-col.center-col.col {
    flex: 3 0 var(--center-col_lg);
    -ms-flex: 0 0 var(--center-col_lg);
    max-width: calc(var(--center-col_lg) * 2);
  }
}
@media (min-width: 1200px) {
  section.content.component .content-col.center-col.col {
    flex: 3 0 var(--center-col_xl);
    -ms-flex: 0 0 var(--center-col_xl);
    max-width: calc(var(--center-col_xl) * 2);
  }
}
/*  
---------------------------------------------------
Page Components - Items per row & Carousels
---------------------------------------------------  
*/
.row.slides {
  display: block;
  flex-wrap: nowrap;
}

.row.slides .item {
  flex: none !important;
  -ms-flex: none !important;
  max-width: auto !important;
  padding: 0 15px;
  margin-bottom: 0;
}

.row:not(.slides):not(.listing_window-mosaic) .item.items-1 {
  flex: 0 0 var(--items-1);
  -ms-flex: 0 0 var(--items-1);
  max-width: var(--items-1);
}

/* Justify child items to end */
.justify-items-end .component-main.row {
  justify-content: flex-end !important;
}

/* Justify child items to center */
.justify-items-center .component-main.row {
  justify-content: center !important;
}

@media (min-width: 576px) {
  .row:not(.slides):not(.listing_window-mosaic) .item.items-2,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-3,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-4,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-5,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-6,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-7,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-8 {
    flex: 0 0 var(--items-2);
    -ms-flex: 0 0 var(--items-2);
    max-width: var(--items-2);
  }
}
@media (min-width: 768px) {
  .row:not(.slides):not(.listing_window-mosaic) .item.items-3,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-4,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-5,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-6,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-7,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-8 {
    flex: 0 0 var(--items-2);
    -ms-flex: 0 0 var(--items-2);
    max-width: var(--items-2);
  }
}
@media (min-width: 992px) {
  .row:not(.slides):not(.listing_window-mosaic) .item.items-3 {
    flex: 0 0 var(--items-3);
    -ms-flex: 0 0 var(--items-3);
    max-width: var(--items-3);
  }
  .row:not(.slides):not(.listing_window-mosaic) .item.items-4,
  .row:not(.slides):not(.listing_window-mosaic) .item.items-5 {
    flex: 0 0 var(--items-4);
    -ms-flex: 0 0 var(--items-4);
    max-width: var(--items-4);
  }
  .row:not(.slides):not(.listing_window-mosaic) .item.items-6 {
    flex: 0 0 var(--items-5);
    -ms-flex: 0 0 var(--items-5);
    max-width: var(--items-5);
  }
  .row:not(.slides):not(.listing_window-mosaic) .item.items-7 {
    flex: 0 0 var(--items-6);
    -ms-flex: 0 0 var(--items-6);
    max-width: var(--items-6);
  }
  .row:not(.slides):not(.listing_window-mosaic) .item.items-8 {
    flex: 0 0 var(--items-7);
    -ms-flex: 0 0 var(--items-7);
    max-width: var(--items-7);
  }
}
@media (min-width: 1200px) {
  .row:not(.slides):not(.listing_window-mosaic) .item.items-5 {
    flex: 0 0 var(--items-5);
    -ms-flex: 0 0 var(--items-5);
    max-width: var(--items-5);
  }
  .row:not(.slides):not(.listing_window-mosaic) .item.items-6 {
    flex: 0 0 var(--items-6);
    -ms-flex: 0 0 var(--items-6);
    max-width: var(--items-6);
  }
  .row:not(.slides):not(.listing_window-mosaic) .item.items-7 {
    flex: 0 0 var(--items-7);
    -ms-flex: 0 0 var(--items-7);
    max-width: var(--items-7);
  }
  .row:not(.slides):not(.listing_window-mosaic) .item.items-8 {
    flex: 0 0 var(--items-8);
    -ms-flex: 0 0 var(--items-8);
    max-width: var(--items-8);
  }
}
/*  
---------------------------------------------------
Item Margins only

Margins relate to the number of items per row at 
each breakpoint.
---------------------------------------------------  
*/
@media (min-width: 576px) and (max-width: 767px) {
  .listing:not(.listing_window-mosaic) .item:not(.items-1):nth-last-child(2),
  .listing:not(.listing_window-mosaic) .item:not(.items-1):nth-last-child(1) {
    margin-bottom: 0 !important;
  }
}
@media (min-width: 1200px) {
  .listing:not(.listing_window-mosaic) .item.items-8:nth-last-child(8),
  .listing:not(.listing_window-mosaic) .item.items-8:nth-last-child(7),
  .listing:not(.listing_window-mosaic) .item.items-8:nth-last-child(6),
  .listing:not(.listing_window-mosaic) .item.items-8:nth-last-child(5),
  .listing:not(.listing_window-mosaic) .item.items-8:nth-last-child(4),
  .listing:not(.listing_window-mosaic) .item.items-8:nth-last-child(3),
  .listing:not(.listing_window-mosaic) .item.items-8:nth-last-child(2),
  .listing:not(.listing_window-mosaic) .item.items-8:nth-last-child(1),
  .listing:not(.listing_window-mosaic) .item.items-7:nth-last-child(7),
  .listing:not(.listing_window-mosaic) .item.items-7:nth-last-child(6),
  .listing:not(.listing_window-mosaic) .item.items-7:nth-last-child(5),
  .listing:not(.listing_window-mosaic) .item.items-7:nth-last-child(4),
  .listing:not(.listing_window-mosaic) .item.items-7:nth-last-child(3),
  .listing:not(.listing_window-mosaic) .item.items-7:nth-last-child(2),
  .listing:not(.listing_window-mosaic) .item.items-7:nth-last-child(1),
  .listing:not(.listing_window-mosaic) .item.items-6:nth-last-child(6),
  .listing:not(.listing_window-mosaic) .item.items-6:nth-last-child(5),
  .listing:not(.listing_window-mosaic) .item.items-6:nth-last-child(4),
  .listing:not(.listing_window-mosaic) .item.items-6:nth-last-child(3),
  .listing:not(.listing_window-mosaic) .item.items-6:nth-last-child(2),
  .listing:not(.listing_window-mosaic) .item.items-6:nth-last-child(1),
  .listing:not(.listing_window-mosaic) .item.items-5:nth-last-child(5),
  .listing:not(.listing_window-mosaic) .item.items-5:nth-last-child(4),
  .listing:not(.listing_window-mosaic) .item.items-5:nth-last-child(3),
  .listing:not(.listing_window-mosaic) .item.items-5:nth-last-child(2),
  .listing:not(.listing_window-mosaic) .item.items-5:nth-last-child(1),
  .listing:not(.listing_window-mosaic) .item.items-2:nth-last-child(2),
  .listing:not(.listing_window-mosaic) .item.items-2:nth-last-child(1) {
    margin-bottom: 0 !important;
  }
}
/*  
---------------------------------------------------
Sticky

Choose preset class 'Sticky' to sticky anything
---------------------------------------------------  
*/
.sticky {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: var(--base-spacing);
  z-index: 11;
  /* Safari OSX, iOS performance improvements */
  will-change: transform, top;
  -webkit-transition: top 0.3s ease-in-out 0s;
  transition: top 0.3s ease-in-out 0s;
}

/* IE10+ specific styles go here */
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
  body .sticky {
    position: relative !important;
    top: 0 !important;
  }
}
/*  
---------------------------------------------------
Reusable components
---------------------------------------------------  
*/
/* Component padding */
/* Users can add these styles using the Settings on the component */
/*
.usn_cmp_reusablecomponents { 
    padding-bottom: 0!important;
}
.usn_cmp_reusablecomponents:not(:first-of-type) { 
    padding: 0!important;
}
*/
section.usn_cmp_reusablecomponents {
  padding-top: 0 !important;
}
@media (max-width: 992px) {
  section.usn_cmp_reusablecomponents {
    padding-top: 15px !important;
  }
}

/* Component container */
.usn_cmp_reusablecomponents > .component-inner > .container-fluid {
  padding-right: 0;
  padding-left: 0;
}

/* Tabs */
.usn_cmp_reusablecomponents > .component-inner > .container-fluid > div > .tabbed:not(.tab-basic) > .tabs > .nav,
.usn_cmp_reusablecomponents > .component-inner > .container > div > .tabbed:not(.tab-basic) > .tabs > .nav {
  padding: calc(var(--base-spacing) / 2) 0;
}

.usn_cmp_reusablecomponents > .component-inner > .container-fluid > div > .tabbed > .tabs > .nav.justify-content-start.text-left {
  padding-left: var(--base-spacing);
}

.usn_cmp_reusablecomponents > .component-inner > .container-fluid > div > .tabbed > .tabs > .nav.justify-content-end.text-right {
  padding-right: var(--base-spacing);
}

:not(.component-outro).justify-content-start .info.col h2.heading {
  padding-left: 0px;
}
@media (max-width: 578px) {
  :not(.component-outro).justify-content-start .info.col h2.heading {
    padding-top: 15px !important;
  }
}

:not(.component-outro).justify-content-start .info.col .text {
  padding-left: 0rem;
}

/* Internal components */
/* Users can add these styles using the Settings on the component */
/*
.usn_cmp_reusablecomponents > .component-inner > .container .component { 
    padding: 0;
}
*/
.usn_cmp_reusablecomponents > .component-inner > .container .component .container {
  padding-right: 0;
  padding-left: 0;
}

/* Home page components */
.home-page-sustainability {
  padding-top: 20px !important;
  padding-bottom: 80px !important;
}

.home-page-sustainability .info .base-text {
  /*    background: #ffffff;
      box-shadow: 0px 0px 20px 20px rgb(255 255 255 / 85%);
  */
}

.home-page-sustainability .component-outro {
  padding-bottom: 0px !important;
  padding-top: 5px !important;
  /*    background: #ffffff;
      box-shadow: 0px 0px 20px 20px rgb(255 255 255 / 85%);*/
}

.home-page-sustainability .component-outro .info .link {
  padding-top: 5px !important;
}

.home-page-sustainability {
  background: radial-gradient(ellipse at center, #f4f4f4 22%, transparent 75%, transparent), url(/images/Rumpke/blocks/icon-background-texture-thumbail-callout.jpg) !important;
}