/* Scss Document */
/*SERVICES PAGE*/
/* Scss Document */
/*color definitions*/
/*dark red*/
/*light blue-gray: footer*/
/*light gray: nav bar*/
/*bright red: phone number, nav current page*/
/*bright blue*/
/*dark blue: body text*/
/*header background overlay*/
/*tile background overlay*/
#sitework {
  background-image: url("../img/sitework_02_square.jpg"); }

#septic {
  background-image: url("../img/onsite_waste_square.jpg"); }

#excavation {
  background-image: url("../img/excavation_square.jpg"); }

#demolition {
  background-image: url("../img/demolition_square.jpg"); }

#utilities {
  background-image: url("../img/utilities_square.jpg"); }

#drainage {
  background-image: url("../img/drainage_square.jpg"); }

#driveways {
  background-image: url("../img/driveways_square.jpg"); }

#hauling {
  background-image: url("../img/hauling_square.jpg"); }

#grading {
  background-image: url("../img/grading_square.jpg"); }

#erosion {
  background-image: url("../img/erosion_control_square.jpg"); }

#foundations {
  background-image: url("../img/foundations_square.jpg"); }

#snow {
  background-image: url("../img/snow_removal_01_square.jpg"); }

a.show-content h2 {
  color: #fff;
  text-shadow: 0px 0px 10px #000; }

.maincontent {
  position: relative;
  margin: 0 auto; }
  .maincontent .flex-contain.tiles {
    padding: 5px; }
    .maincontent .flex-contain.tiles .flex-col.square-tile {
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      min-width: 275px;
      position: relative;
      height: 150px;
      margin: 5px; }
      .maincontent .flex-contain.tiles .flex-col.square-tile div.color-filter {
        width: 100%;
        height: 100%; }
      .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content {
        width: 100%;
        height: 100%;
        display: table;
        text-decoration: none;
        position: absolute;
        line-height: 1.2em;
        -webkit-transition: all 0.6s;
        -moz-transition: all 0.6s;
        -ms-transition: all 0.6s;
        transition: all 0.6s; }
        .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content:hover {
          background-color: rgba(0, 174, 239, 0.5);
          -webkit-transition: all 0.6s;
          -moz-transition: all 0.6s;
          -ms-transition: all 0.6s;
          transition: all 0.6s; }
        .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content h2 {
          width: 100%;
          bottom: 0;
          text-align: center;
          display: table-cell;
          vertical-align: middle; }
        .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content div.hover-content {
          -webkit-transition: all 0.6s;
          -moz-transition: all 0.6s;
          -ms-transition: all 0.6s;
          transition: all 0.6s;
          position: relative;
          display: none;
          padding: 20px; }
          .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content div.hover-content p, .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content div.hover-content ul, .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content div.hover-content li {
            margin: 0;
            color: #fff;
            font-family: sans-serif; }
        @media (min-width: 1450px) {
          .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content h2 {
            margin-top: 100px; }
          .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content div.hover-content {
            padding: 20px 50px; } }
      .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content.content-showing {
        background-color: rgba(6, 20, 34, 0.7);
        -webkit-transition: all 0.6s;
        -moz-transition: all 0.6s;
        -ms-transition: all 0.6s;
        transition: all 0.6s; }
        .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content.content-showing h2 {
          display: block;
          color: #fff; }
        .maincontent .flex-contain.tiles .flex-col.square-tile a.show-content.content-showing div.hover-content {
          display: block; }
  .maincontent div#equipment {
    background-color: #E4EEF4;
    padding: 50px; }
    .maincontent div#equipment .horizontal.center-content {
      width: 80%;
      max-width: 1080px; }
    .maincontent div#equipment h2 {
      text-align: center; }
    .maincontent div#equipment .flex-col.col-2 {
      width: 45%;
      margin: 5px 5px 0 0;
      min-width: 250px; }
      .maincontent div#equipment .flex-col.col-2 img {
        width: 100%;
        display: block; }

/*# sourceMappingURL=services.css.map */
