main p {
  margin: 0 0 20px;
  line-height: 1.4; }

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #595454; }

h2 {
    font-family: var(--font-primary);
    font-weight: var(--font-weight-normal);
  margin-bottom: 30px;
  font-size: 1.9rem;
  text-transform: none; }

h3 {
  margin-top: 10px;
  margin-bottom: 20px; }

.usp ul {
  margin-bottom: 10px; }

.usp ul li {
  margin-left: 20px;
  line-height: 1.4; }

.list-unstyled {
  padding-left: 0;
  list-style: none;
  margin-bottom: 10px; }

/* ====================================
    Intro
======================================= */
.featured {
  margin-bottom: 30px;
  height: 204px;
  overflow: hidden;
  position: relative; }

@media (min-width: 480px) {
  .featured {
    height: 232px; } }
@media (min-width: 767px) {
  .featured {
    height: 360px; } }
.featured img {
  height: 100%;
  width: 100%;
  object-fit: cover; }

.categories .featured div {
  background-color: rgba(61, 60, 58, 0.75);
  position: absolute;
  bottom: 0;
  color: white;
  padding: 20px;
  width: 100%; }

.categories .featured p {
    font-family: var(--font-primary);
    font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  color: #a49f9e; }

.categories .featured h2 {
    font-family: var(--font-primary);
    font-weight: var(--font-weight-normal);
  text-transform: none;
  font-size: 3.2rem;
  line-height: 3.2rem;
  color: #fff;
  margin-bottom: 0; }

.intro {
  background-color: #f9f8f6;
  font-size: 1.2em;
  padding: 1.5em;
  line-height: 1.4;
  color: #3d3c3a;
  font-family: var(--font-primary);
font-weight: var(--font-weight-normal);
  text-transform: none;
  margin: 1.2em 0; }

article .stub {
  font-size: 1rem;
  line-height: 1.6180339888rem; }

/* ====================================
    Sidebar
======================================= */
.sidebar h2, .sidebar h3 {
  margin: 20px 0; }

.sidebar p {
  margin-bottom: 20px; }

.waterworks_cta {
  display: inline-block;
  position: relative;
  text-indent: -9999px;
  width: 245px;
  height: 225px;
  background: url("/sites/content/image/learn-more-about-waterworks-banner") no-repeat top center; }

.waterworks_cta span {
  position: absolute;
  display: inline-block;
  top: 0;
  left: 0;
  width: 245px;
  height: 225px;
  background: url("/sites/content/image/learn-more-about-waterworks-banner") no-repeat;
  background-position: bottom center;
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out; }

.waterworks_cta:hover span {
  opacity: 1; }

.facilities_supply_cta {
  display: inline-block;
  position: relative;
  text-indent: -9999px;
  width: 245px;
  height: 225px;
  background: url("/sites/content/image/learn-more-about-facilities-supply-banner") no-repeat top center; }

.facilities_supply_cta span {
  position: absolute;
  display: inline-block;
  top: 0;
  left: 0;
  width: 245px;
  height: 225px;
  background: url("/sites/content/image/learn-more-about-facilities-supply-banner") no-repeat;
  background-position: bottom center;
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out; }

.facilities_supply_cta:hover span {
  opacity: 1; }

/* ====================================
    Breadcrumbs
======================================= */
.breadcrumb {
  background-color: transparent;
  border: none; }

.breadcrumb > li + li:before {
  padding: 0;
  content: ""; }

/* ====================================
    Header
======================================= */
header .icon-wrapper {
  width: 150px;
  display: inline-block; }

header h1 {
    font-family: var(--font-primary);
    font-weight: var(--font-weight-normal);
  position: relative;
  top: -15px;
  text-transform: capitalize;
  font-size: 2.5rem; }

header p {
  font-size: 1.125rem;
  width: 100%;
  margin: 0 auto;
  text-align: left;
  line-height: 1.875rem;
}

/* ====================================
    Section 2: Button Stuff (USP)
======================================= */
.section2 {
  padding-top: 30px;
  padding-bottom: 30px; }

.usp-apply-for-credit {
  background-image: url("/sites/content/image/usp-apply-for-credit-460x124"); }

.usp-contact-us {
    background-image: url("/sites/content/image/contact-us-usp-image"); }

.water-treatment-plants {
  background-image: url("/sites/content/image/water-treatment-plants-usp-image"); }

.municipal-rural {
  background-image: url("/sites/content/image/municipal-rural-solutions-usp-image"); }

.strategic-infrastructure {
  background-image: url("/sites/content/image/2600017119876"); }

.underground-utility {
  background-image: url("/sites/content/image/underground-utility-contractors-usp-image"); }

.geosynthetic {
  background-image: url("/sites/content/image/geosynthetic-usp-image"); }

.mag {
  background-image: url("/sites/content/image/mag-usp-image"); }

.usp-nsc {
  background-image: url("/sites/content/image/usp-national-sales-center-image"); }

.usp-ferguson-dif {
  background-image: url("/sites/content/image/usp-ferguson-difference-image"); }

.usp-ffs-contact-us{
  background-image: url("/sites/content/image/usp-ffs-contact-us-460x124"); }

.usp-view-catalog {
  background-image: url("/sites/content/image/usp-ffs-catalog-image-460x124"); }

.usp-inventory-mgmt {
  background-image: url("/sites/content/image/usp-inventory-management-image"); }

.usp-pp-cs {
	background-image: url("/sites/content/image/2600013488531"); }

.usp-register-for-account {
  background-image: url("/sites/content/image/usp-register-for-account-460x124"); }

.usp-rennovations {
  background-image: url("/sites/content/image/usp-renovations-460x124"); }

.usp-vrf-solutions {
  background-image: url("/sites/content/image/usp-vrf-solutions-image-460x124"); }

.usp-vrf-training {
  background-image: url("/sites/content/image/usp-vrf-training-image-460x124"); }

.usp-ww-video {
	background-image: url("/sites/content/image/2600013488456"); }

.btn-fancy {
  display: block;
  background-color: transparent;
  background-repeat: no-repeat;
  background-size: cover;
  /* border:10px solid white; */
  width: 100%;
  text-align: center;
  margin-bottom: 1em;
  position: relative;
  height: 128px;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-align-items: center;
  -moz-align-items: center;
  -webkit-align-items: center;
  align-items: center; }

.btn-fancy > span {
  display: inline-block;
  color: #fff;
  position: relative;
  z-index: 10;
  font-size: 1.4em;
  width: 100%; }

.btn-fancy:before {
  content: "";
  display: block;
  background-color: rgba(0, 0, 0, 0.5);
  background-color: rgba(0, 68, 107, 0.66);
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  -webkit-transition: background-color 200ms ease-out 0s;
  -moz-transition: background-color 200ms ease-out 0s;
  -o-transition: background-color 200ms ease-out 0s;
  transition: background-color 200ms ease-out 0s; }

.btn-fancy:hover:before {
  background: rgba(0, 68, 107, 0.5); }

/* ====================================
    Section 3: Who We Serve Stuff
======================================= */
.section3 {
  padding-top: 30px;
  padding-bottom: 30px; }

.section3 h3 {
  font-size: 1.125rem;
  font-family: var(--font-primary);
font-weight: var(--font-weight-normal);
  text-transform: none; }

.section3 p {
  font-size: .975rem; }

.section3 a, .section3 h3 a {
  color: #00446a;
  font-family: var(--font-primary);
font-weight: var(--font-weight-semibold);
  text-transform: none; }

.section3 a:hover, .section3 h3 a:hover {
  color: #36bae2;
  text-decoration: none;
  text-transform: none; }

.card-outer {
  border-top: 4px solid #36bae2;
  margin-bottom: 20px; }

.card-inner {
  padding: 20px;
  border: 1px solid #e4e2e3; }

.card-inner h3 {
  margin-bottom: 10px; }

.card-inner p {
  line-height: 1.5rem;
  margin-bottom: 10px; }

/* ====================================
    Section 4: Services Stuff
======================================= */
.section4 {
  background-color: #f9f8f6;
  padding-top: 30px;
  padding-bottom: 30px; }

.section4 h2 {
  color: #857f7f; }

.section4 h3, .section4 h3 > a {
  font-size: 1.125rem;
  font-family: var(--font-primary);
font-weight: var(--font-weight-semibold);
  text-transform: none;
  margin-bottom: 0; }

.section4 p {
  font-size: .975rem;
  line-height: 1.5rem;
  margin-bottom: 20px; }

/* ====================================
    Section 5: Products Stuff
======================================= */
.section5 {
  padding-top: 30px;
  padding-bottom: 50px; }

.section5 ul {
  margin: 0 auto;
  padding: 0; }

.section5 li {
  list-style-type: none;
  font-size: 1rem;
  background: #e4e3e3;
  min-height: 50px;
  min-width: 110px;
  padding: 10px;
  display: block;
  float: left;
  margin: 10px;
  line-height: 3em;
  text-align: center; }

.section5 .bg-cta {
  background-color: #005c86;
  display: block;
  max-width: 50%;
  max-height: 50%;
  border-radius: 50%;
  text-align: center;
  margin: 0 auto;
  -webkit-transition: background-color 200ms ease-out 0s;
  -moz-transition: background-color 200ms ease-out 0s;
  -o-transition: background-color 200ms ease-out 0s;
  transition: background-color 200ms ease-out 0s; }

.section5 .bg-cta:hover {
  background-color: #36bae2; }

@media (max-width: 767px) {
  .section5 .col-xs-6 {
    min-height: 155px; } }
/* ====================================
    Section 6: What To Do Next Stuff
======================================= */
.section6 {
  padding-top: 30px; }

.section6 .bg-cta, .sidebar .bg-cta {
  color: #5a5454;
  background-color: #f9f8f6;
  display: block;
  padding: 25px 15px 15px 15px;
  cursor: pointer;
  margin-bottom: 20px; }

.section6 .bg-cta p, .sidebar .bg-cta p {
  display: block;
  font-size: 1rem;
  font-family: var(--font-primary);
font-weight: var(--font-weight-normal); }

.section6 .bg-cta svg, .sidebar .bg-cta svg {
  width: 48px;
  max-height: 48px; }

.section6 .bg-cta, .sidebar .bg-cta {
  transition: background-color .25s; }

.section6 .bg-cta:hover, .sidebar .bg-cta:hover {
  background-color: #36bae2; }

.section6 .bg-cta p, .sidebar .bg-cta p {
  transition: color .25s; }

.section6 .bg-cta:hover p, .sidebar .bg-cta:hover p {
  color: white; }

.section6 .bg-cta .st0, .section6 .bg-cta .st2, .sidebar .bg-cta .st0, .sidebar .bg-cta .st2 {
  transition: stroke .25s; }

.section6 .bg-cta .st1, .sidebar .bg-cta .st1 {
  transition: fill .25s; }

.section6 .bg-cta:hover .st0, .section6 .bg-cta:hover .st2, .sidebar .bg-cta:hover .st0, .sidebar .bg-cta:hover .st2 {
  stroke: #ffffff; }

.section6 .bg-cta:hover .st1, .sidebar .bg-cta:hover .st1 {
  fill: #ffffff; }

@media (min-width: 1024px) {
  .section6 .col-offset-top {
    margin-left: 12.75%; }

  .section6 .col-offset-btm {
    margin-left: 25%; } }
/* ====================================
   USP (Geosynthetics , MAG, Watertown)
======================================= */
.usp .subnav ul {
  margin: 0;
  padding: 10px;
  background: #f9f8f6; }

.usp .subnav ul li {
  list-style: none;
  margin: 0 0 10px 10px; }

.usp .vendors ul {
  margin: 0;
  padding: 0; }

.usp .vendors ul li {
  list-style: none;
  margin: 0 0 10px 10px; }

.usp .panel {
  border-radius: 0;
  box-shadow: none; }

.usp dd {
  margin: 0 0 10px 0; }

.usp ul.list-unstyled ul {
  list-style: none; }

.usp .product {
  margin-bottom: 40px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e4e3e3; }

.usp .product:last-child {
  border-bottom: none; }

.usp .button {
  height: 45px;
  line-height: 45px;
  padding: 0 20px;
  vertical-align: middle; }

.more_info_cta a.button {
  position: absolute;
  padding: 3.5em 1.2em 0;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; }

/* ====================================
   Tips & Tricks
======================================= */
.tipstricks .image {
  height: 182px;
  width: 100%;
  background: #f9f8f6;
  overflow: hidden;
  margin-bottom: 20px; }

.tipstricks h3, .tipstricks h3 > a, .tipstricks h3 > a:hover {
  color: #2bb9e4;
  text-transform: none;
  font-size: 1.125rem; }

.tipstricks img {
  object-fit: cover;
  width: 100%;
  height: 100%; }