@charset "UTF-8";
/* DEFAULT */
@media only screen {
  .content2 {
    padding: 1px;
  }
  .content3 {
    padding: 1px 30px;
  }
  .detail {
    padding: 2vw;
  }
  .emphasis {
    font-family: "philospher", 'TrebuchetMS', Helvetica, sans-serif;
    font-size: 2em;
    font-style: italic;
    text-align: center;
  }
  .index {
    font-size: 3.6em;
  }
  .xlg {
    font-size: 3em;
  }
  #decorative-concrete {
    background: url("../images/concrete-polishing.webp") no-repeat 50% 50%;
    background-size: cover;
    height: 67.5vw;
  }
  #epoxy-flooring, #polished-concrete {
    background-color: #EBE996;
  }
  #grid1 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  #service {
    background-color: #2F6A66;
    height: 100px;
    margin: -50px 15vw 0 0;
  }
  #service h2 {
    font-size: 2rem;
  }
}
/* MEGAPIXEL */
@media only screen and (min-width: 2001px) {}
/* DESKTOP */
@media only screen and (max-width: 2000px) {}
/* iPAD */
@media only screen and (max-width: 900px) {
  .index {
    font-size: 2em;
  }
  #grid1 {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-row-gap: 0;
  }
  #service h2 {
    font-size: 1.4rem;
  }
}
/* MOBILE */
@media only screen and (max-width: 500px) {
  .detail {
    padding: 1vw;
  }
  .index {
    font-size: 1.2em;
  }
  .xlg {
    font-size: 2em;
  }
  #cta1 {
    margin: 0;
  }
  #grid1 {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, 1fr);
  }
}
/* SWIPER */
/* Wrapper to place arrows outside of images */
.slider-wrap {
  position: relative;
  padding: 1px 30px;
}
.swiper {
  width: 100%;
  padding-bottom: 48px;
}
.swiper-slide {
  border-radius: 10px;
  overflow: hidden;
  background: #000000;
  height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.swiper-slide img {
  width: 600px;
  height: auto;
  object-fit: cover;
  display: block;
}
/* Navigation arrows */
.swiper-button-prev, .swiper-button-next {
  border-radius: 50%;
  color: #FFFFFF;
  top: 50%;
  transform: translateY(-50%);
}
.swiper-button-prev::after, .swiper-button-next::after {
  font-size: 14px;
  font-weight: bold;
}
.swiper-button-prev {
  left: 6px;
}
.swiper-button-next {
  right: 6px;
}
/* Pagination dots */
.swiper-pagination-bullet {
  width: 16px;
  height: 16px;
  background: transparent;
  border: 2px solid #000000;
  opacity: 1;
}
.swiper-pagination-bullet-active {
  background: #000000;
  border-color: #000000;
}
/* Mobile adjustments */
@media (max-width: 500px) {
  .swiper-slide {
    height: 210px;
  }
  /* .swiper-pagination { display: none; } -- Uncomment to prevent image overall below 480px width */
}