/* Backyard Escape colors */
/* Optimum Colors */
/* Backyard Escape colors */
/* Optimum Colors */
body {
  color: rgba(0, 0, 0, 0.8); }

.framed {
  display: flex;
  align-items: center;
  justify-content: center; }
  @media screen and (max-width: 991px) {
    .framed {
      margin: 5vh 0; } }
  .framed .home-section {
    background-image: linear-gradient(to bottom, #F6F9F9, #D9E1EB);
    width: 90vw;
    height: 90vh;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }
    @media screen and (max-width: 991px) {
      .framed .home-section {
        height: auto; } }

.home-section {
  height: 100vh;
  overflow: hidden; }
  .home-section.half {
    height: 50vh; }
  .home-section.one-third {
    height: 33vh; }
    @media screen and (max-width: 991px) {
      .home-section.one-third {
        height: auto; } }
  .home-section.two-thirds {
    height: 67vh; }
  @media screen and (max-width: 991px) {
    .home-section {
      height: auto;
      overflow: initial; }
      .home-section.half, .home-section.one-third, .home-section.two-thirds {
        height: auto; } }
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .home-section.third {
      margin-top: 5vh;
      margin-bottom: 5vh; } }

#home-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background-color: rgba(0, 0, 0, 0.8);
  flex-wrap: wrap; }
  @media screen and (max-width: 991px) {
    #home-brand {
      height: 50vh;
      overflow: hidden;
      padding-top: 60px; } }
  @media screen and (max-width: 767px) {
    #home-brand {
      height: 300px;
      padding-top: 0;
      background-image: url("/images/home/mobile-background.jpg");
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover; } }
  @media screen and (max-width: 576px) {
    #home-brand {
      height: 33vh; } }
  #home-brand #home-brand-content {
    z-index: 100;
    text-align: center;
    width: 80%; }
    #home-brand #home-brand-content #bm {
      width: 80%;
      margin: 0 auto;
      max-width: 800px;
      position: relative; }
      @media screen and (max-width: 991px) {
        #home-brand #home-brand-content #bm {
          width: 70%;
          margin: 30px auto 0 auto; } }
      @media screen and (max-width: 767px) {
        #home-brand #home-brand-content #bm {
          width: 70%; } }
      #home-brand #home-brand-content #bm #home-video-button {
        background-color: transparent;
        border: none;
        position: absolute;
        z-index: 1000;
        width: 100%;
        height: 100%; }
        #home-brand #home-brand-content #bm #home-video-button:focus {
          outline: none; }
    #home-brand #home-brand-content h1 {
      color: #fff;
      text-transform: uppercase;
      letter-spacing: 2px;
      font-weight: 200;
      font-size: 2.5rem;
      text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5); }
      @media screen and (max-width: 991px) {
        #home-brand #home-brand-content h1 {
          font-size: 2rem;
          text-transform: capitalize; } }
      @media screen and (max-width: 767px) {
        #home-brand #home-brand-content h1 {
          font-size: 1.5rem; } }
  #home-brand .tint {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.3);
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 10; }
  #home-brand video {
    z-index: 0;
    position: absolute;
    top: 0;
    left: 0;
    right: -5%;
    min-width: 100vw;
    min-height: 100vh; }
    @media screen and (max-width: 1500px) {
      #home-brand video {
        left: -15%; } }
    @media screen and (max-width: 1200px) {
      #home-brand video {
        left: -25%; } }
    @media screen and (max-width: 991px) {
      #home-brand video {
        left: 0;
        min-height: calc(50vh + 60px);
        width: 100%;
        top: initial; } }
    @media screen and (max-width: 767px) {
      #home-brand video {
        display: none; } }

#customer-journey {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 15px; }
  @media screen and (max-width: 991px) {
    #customer-journey {
      align-items: flex-start; } }
  @media screen and (max-width: 767px) {
    #customer-journey {
      flex-direction: column;
      align-items: center; } }
  #customer-journey .block {
    text-align: center;
    width: 30%;
    max-width: 350px;
    padding: 15px; }
    #customer-journey .block a.step-link span {
      color: #333; }
    #customer-journey .block a.step-link:hover {
      text-decoration: none; }
    @media screen and (max-width: 991px) {
      #customer-journey .block a.step-link h3 {
        margin-top: 0.8rem; } }
    #customer-journey .block .step {
      font-size: 1.75rem; }
    #customer-journey .block div#getInspired, #customer-journey .block div#findABuilder, #customer-journey .block div#vacayEveryday {
      width: 80px;
      height: auto;
      margin: 0 auto; }
      @media screen and (max-width: 767px) {
        #customer-journey .block div#getInspired, #customer-journey .block div#findABuilder, #customer-journey .block div#vacayEveryday {
          display: none; } }
      @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
        #customer-journey .block div#getInspired, #customer-journey .block div#findABuilder, #customer-journey .block div#vacayEveryday {
          height: 100px; } }
    #customer-journey .block img {
      width: 65px;
      display: block;
      margin: 0 auto; }
    #customer-journey .block h3 {
      text-transform: uppercase;
      letter-spacing: 2px;
      font-size: 1rem;
      font-weight: 600;
      color: #333; }
      @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
        #customer-journey .block h3 {
          margin-top: .5rem; } }
    #customer-journey .block p {
      font-size: 0.95rem; }
    @media screen and (max-width: 767px) {
      #customer-journey .block {
        width: 100%;
        max-width: 45 0px;
        padding: 0; }
        #customer-journey .block:first-child {
          padding-top: 10px; }
        #customer-journey .block:last-child {
          padding-top: 10px; } }

#home-media-gallery {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center; }
  @media screen and (max-width: 991px) {
    #home-media-gallery {
      flex-wrap: wrap; } }
  #home-media-gallery .right {
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    box-sizing: border-box; }
    @media screen and (max-width: 991px) {
      #home-media-gallery .right {
        width: 100%;
        height: auto;
        flex-direction: row; } }
  #home-media-gallery .block {
    background-color: #eee;
    margin: 5px;
    position: relative;
    overflow: hidden; }
    #home-media-gallery .block.backyard-tour {
      height: 100%;
      width: 50%;
      margin: 5px 10px 5px 0; }
      @media screen and (max-width: 991px) {
        #home-media-gallery .block.backyard-tour {
          width: 100%;
          height: 300px;
          margin: 0 0 5px 0; } }
    #home-media-gallery .block.style-boards {
      height: calc(50% - 5px);
      width: 100%;
      box-sizing: border-box;
      margin: 0 0 5px 0; }
      @media screen and (max-width: 991px) {
        #home-media-gallery .block.style-boards {
          height: 300px;
          margin: 5px 5px 0 0;
          width: 50%; } }
    #home-media-gallery .block.design-quiz {
      height: calc(50% - 5px);
      width: 100%;
      margin: 5px 0 0 0; }
      @media screen and (max-width: 991px) {
        #home-media-gallery .block.design-quiz {
          height: 300px;
          margin: 5px 0 0 5px;
          width: 50%; } }

#home-media-gallery .block a, #home-collage .block a {
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1000;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0;
  font-size: 0; }
#home-media-gallery .block > div, #home-collage .block > div {
  bottom: 0;
  left: 0;
  position: absolute;
  z-index: 100;
  width: 100%;
  padding: 20px;
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0)); }
  #home-media-gallery .block > div h2, #home-collage .block > div h2 {
    font-size: 1.5rem;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #fff;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
    transition: transform 0.35s;
    transform: translate3d(0, 40px, 0); }
    @media screen and (max-width: 767px) {
      #home-media-gallery .block > div h2, #home-collage .block > div h2 {
        transform: none;
        text-align: center; } }
  #home-media-gallery .block > div p, #home-collage .block > div p {
    transition: opacity 0.2s, transform 0.35s;
    opacity: 0;
    color: #333;
    padding: 5px 10px;
    background-color: #fff;
    display: inline-block;
    letter-spacing: 1px;
    transform: translateY(20px);
    margin-bottom: 0;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
    transform: translate3d(0, 40px, 0); }
    @media screen and (max-width: 767px) {
      #home-media-gallery .block > div p, #home-collage .block > div p {
        display: none; } }
#home-media-gallery .block img, #home-collage .block img {
  z-index: 90; }
#home-media-gallery .block:hover > div h2, #home-collage .block:hover > div h2 {
  transform: translate3d(0, 0, 0); }
#home-media-gallery .block:hover > div p, #home-collage .block:hover > div p {
  opacity: 1;
  transform: translate3d(0, 0, 0); }

#home-npt-app {
  display: flex;
  align-items: center;
  justify-content: center; }
  @media screen and (max-width: 991px) {
    #home-npt-app {
      width: 90vw;
      margin: 0 auto;
      flex-direction: column-reverse; } }
  #home-npt-app .block {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    height: 100%; }
    @media screen and (max-width: 1200px) {
      #home-npt-app .block {
        width: 50%;
        padding: 30px; } }
    #home-npt-app .block.npt-app-content {
      margin-left: 5%;
      width: calc(50% - 20px);
      padding-right: 20px;
      max-width: 600px; }
      #home-npt-app .block.npt-app-content h2#npt-heading {
        margin-top: 0;
        font-family: 'Merriweather', serif;
        font-size: 2.25rem; }
        @media screen and (max-width: 991px) {
          #home-npt-app .block.npt-app-content h2#npt-heading {
            font-size: 2rem; } }
        @media screen and (max-width: 767px) {
          #home-npt-app .block.npt-app-content h2#npt-heading {
            font-size: 1.75rem; } }
      #home-npt-app .block.npt-app-content .npt-icons-flex {
        display: flex;
        align-items: center;
        justify-content: space-around;
        margin-bottom: 10px; }
        #home-npt-app .block.npt-app-content .npt-icons-flex > div {
          max-width: 90px;
          width: 100%;
          padding: 5px;
          display: flex;
          align-items: center;
          justify-content: center;
          flex-direction: column; }
          #home-npt-app .block.npt-app-content .npt-icons-flex > div > div {
            max-width: 70px; }
          #home-npt-app .block.npt-app-content .npt-icons-flex > div span {
            text-align: center;
            color: #00a160;
            font-size: 0.9rem;
            font-weight: bold; }
          @media screen and (max-width: 1200px) {
            #home-npt-app .block.npt-app-content .npt-icons-flex > div {
              display: none; } }
      @media screen and (max-width: 1200px) {
        #home-npt-app .block.npt-app-content {
          width: 50%; }
          #home-npt-app .block.npt-app-content p {
            margin-bottom: 25px; } }
      @media screen and (max-width: 991px) {
        #home-npt-app .block.npt-app-content {
          padding: 0 30px 30px 30px;
          width: 100%;
          text-align: center;
          margin: 0 auto; } }
      #home-npt-app .block.npt-app-content div img {
        margin: 10px 5px 0 5px;
        width: 150px;
        transition: transform 0.35s ease-in-out; }
        #home-npt-app .block.npt-app-content div img:hover {
          transform: scale(1.05);
          transition: transform 0.07s ease-in-out; }
        #home-npt-app .block.npt-app-content div img:active {
          transform: scale(0.9); }
        @media screen and (max-width: 991px) {
          #home-npt-app .block.npt-app-content div img {
            width: 49%;
            margin: 0;
            max-width: 200px; } }
        @media screen and (max-width: 767px) {
          #home-npt-app .block.npt-app-content div img {
            width: 49%; } }
    #home-npt-app .block.npt-animation {
      width: calc(50% - 20px);
      margin-right: 5%;
      padding-left: 20px;
      display: flex;
      align-items: center;
      justify-content: center; }
      #home-npt-app .block.npt-animation img.npt-backyard-image {
        display: none; }
      @media screen and (max-width: 991px) {
        #home-npt-app .block.npt-animation {
          width: 70%;
          margin: 0 auto; }
          #home-npt-app .block.npt-animation img.npt-backyard-image {
            display: block;
            width: 100%;
            max-width: 100%;
            margin: 0 auto; } }
      #home-npt-app .block.npt-animation .npt-backyard-app {
        max-width: 100%;
        height: auto;
        max-height: 60vh;
        border-radius: 5px;
        display: block; }
        @media screen and (max-width: 991px) {
          #home-npt-app .block.npt-animation .npt-backyard-app {
            display: none; } }

#home-collage {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap; }
  #home-collage .right {
    width: 60vw;
    margin-right: 5px; }
    @media screen and (max-width: 991px) {
      #home-collage .right {
        width: 100vw;
        margin: 0; } }
    #home-collage .right .right-top {
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 10px; }
      #home-collage .right .right-top .block {
        height: calc(56vh + 10px);
        width: 50%;
        margin-top: 0;
        margin-bottom: 0; }
        @media screen and (max-width: 991px) {
          #home-collage .right .right-top .block {
            width: 100%;
            height: 300px; } }
        #home-collage .right .right-top .block:first-child {
          margin-left: 0;
          margin-right: 10px; }
    #home-collage .right .right-bottom .block {
      height: 28vh;
      width: 100%;
      margin: 0 5px 0 0; }
  #home-collage .left {
    width: 30vw;
    flex-direction: column;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 5px; }
    @media screen and (max-width: 991px) {
      #home-collage .left {
        display: none; } }
    #home-collage .left .block {
      width: 100%;
      height: 28vh;
      margin-top: 0;
      margin-bottom: 10px;
      margin-right: 0; }
      #home-collage .left .block:last-child {
        margin-bottom: 0; }
  #home-collage .block {
    background-color: #eee;
    position: relative;
    overflow: hidden; }
    #home-collage .block .bg-follow {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1;
      background-position: center;
      background-size: cover;
      background-repeat: no-repeat;
      transform: scale(1.1); }
      #home-collage .block .bg-follow.build-a-pool {
        background-image: url("/images/home/build-a-pool-1125719638.jpg"); }
      #home-collage .block .bg-follow.pool-care-basics {
        background-image: url("/images/home/pool-care-basics-160910512.jpg"); }
      #home-collage .block .bg-follow.pool-games {
        background-image: url("/images/home/pool-games-1222775289.jpg"); }
      #home-collage .block .bg-follow.pool-volume-calc {
        background-image: url("/images/home/pool-volume-calculator-1200084511.jpg"); }
      #home-collage .block .bg-follow.rediscover-pool-life {
        background-image: url("/images/home/pool-life-520646128.jpg"); }
      #home-collage .block .bg-follow.sanitize-wise {
        background-image: url("/images/home/sanitize-wise.jpg"); }

#home-dealer-locator {
  background-color: #fff;
  box-shadow: none; }
  #home-dealer-locator .dl-intro {
    width: 70vw;
    margin: 0 auto;
    padding-bottom: 20px;
    text-align: center; }
  #home-dealer-locator form {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #D9E1EB;
    width: 100%;
    padding: 10px 20px; }
    #home-dealer-locator form .form-group {
      margin: 0 10px 0 0;
      width: 30%;
      min-width: 250px; }
    @media screen and (max-width: 991px) {
      #home-dealer-locator form {
        flex-wrap: wrap;
        padding: 20px; }
        #home-dealer-locator form .form-group {
          width: 100%;
          display: block;
          margin: 0 0 10px 0;
          min-width: initial; } }
    @media screen and (max-width: 991px) and (max-width: 991px) {
      #home-dealer-locator form .form-group:last-child {
        margin-top: 10px; } }
    @media screen and (max-width: 991px) {
        #home-dealer-locator form .button-plain {
          margin-top: 10px;
          width: 100%;
          display: block;
          max-width: inherit; } }
  #home-dealer-locator .dl-flex {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
    height: 59vh;
    position: relative;
    min-height: 400px;
    overflow: hidden; }
    @media screen and (max-width: 991px) {
      #home-dealer-locator .dl-flex {
        height: auto;
        flex-direction: column-reverse; } }
    #home-dealer-locator .dl-flex #default-map {
      position: absolute;
      width: 101%;
      height: 100%;
      z-index: 100;
      background-image: url("/images/home/default-map.jpg");
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      top: 0;
      left: 0; }
      #home-dealer-locator .dl-flex #default-map.no-results::after {
        content: "Sorry, we couldn't find any dealers in your area";
        color: #fff;
        width: 100%;
        height: 100%;
        position: absolute;
        background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.8));
        display: flex;
        align-items: center;
        justify-content: center; }
  #home-dealer-locator .dealer-ad {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 200px;
    z-index: 1000; }
  #home-dealer-locator .block .button {
    margin-top: 0;
    padding: 7px 12px;
    border-radius: 2px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 400;
    margin-bottom: 5px;
    font-size: 0.95rem;
    display: inline-block; }
  #home-dealer-locator .block.dealer-list {
    width: 40%;
    height: 100%;
    overflow: scroll;
    background-color: #F6F9F9; }
    @media screen and (max-width: 991px) {
      #home-dealer-locator .block.dealer-list {
        width: 100%; } }
    #home-dealer-locator .block.dealer-list .dealer-listing {
      padding: 20px;
      margin: 10px 10px 0 10px;
      box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
      background-color: #fff;
      border-left: 2px solid #D9E1EB; }
      #home-dealer-locator .block.dealer-list .dealer-listing:last-child {
        margin: 10px; }
      #home-dealer-locator .block.dealer-list .dealer-listing h4 {
        font-size: 1.1rem;
        letter-spacing: 1px;
        font-size: bold;
        text-transform: uppercase;
        margin-bottom: 5px; }
      #home-dealer-locator .block.dealer-list .dealer-listing h5 {
        font-size: 1rem;
        margin-bottom: 5px; }
      #home-dealer-locator .block.dealer-list .dealer-listing .angle-link a {
        padding: 0; }
      #home-dealer-locator .block.dealer-list .dealer-listing p {
        font-size: 0.95rem; }
        #home-dealer-locator .block.dealer-list .dealer-listing p.dl-address {
          margin-bottom: 5px; }
        #home-dealer-locator .block.dealer-list .dealer-listing p.dl-phone-number {
          color: #1B43F5;
          font-weight: bold;
          margin-bottom: 10px; }
        #home-dealer-locator .block.dealer-list .dealer-listing p.distance-out {
          color: #888;
          font-style: italic;
          margin-bottom: 0; }
      #home-dealer-locator .block.dealer-list .dealer-listing ul {
        margin-bottom: 5px; }
        #home-dealer-locator .block.dealer-list .dealer-listing ul li {
          display: inline-block;
          padding-bottom: 5px; }
          #home-dealer-locator .block.dealer-list .dealer-listing ul li:after {
            content: '|';
            padding-left: 7px;
            color: #D9E1EB; }
          #home-dealer-locator .block.dealer-list .dealer-listing ul li:last-child:after {
            content: ''; }
  #home-dealer-locator .block.map {
    width: 60%;
    height: 100%;
    background-color: #1B43F5; }
    @media screen and (max-width: 991px) {
      #home-dealer-locator .block.map {
        width: 100%;
        height: 300px; } }

@media screen and (min-width: 576px) {
  #homeModalVideo .modal-dialog-centered {
    max-width: 1080px; } }
#homeModalVideo .modal-dialog-centered .modal-content .close {
  position: absolute;
  font-size: 2rem;
  position: absolute;
  right: -45px;
  top: -45px;
  background-color: #1B43F5;
  color: #fff;
  z-index: 1;
  opacity: 1;
  padding: 4px 12px 7px 12px;
  border-radius: 100px; }
  @media screen and (max-width: 1200px) {
    #homeModalVideo .modal-dialog-centered .modal-content .close {
      right: 0px;
      top: -50px; } }
#homeModalVideo .modal-dialog-centered .modal-content .modal-body {
  padding: 0; }
  #homeModalVideo .modal-dialog-centered .modal-content .modal-body .embed-responsive {
    margin: 0; }

#dealer-locator {
  position: relative;
  width: 100%; }
  #dealer-locator #dealer-form {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #D9E1EB;
    padding: 10px 20px;
    width: 100%; }
    @media screen and (max-width: 991px) {
      #dealer-locator #dealer-form {
        flex-wrap: wrap; } }
    #dealer-locator #dealer-form .form-group {
      width: 30%;
      margin: 0 10px 0 0; }
      @media screen and (max-width: 991px) {
        #dealer-locator #dealer-form .form-group {
          width: 100%;
          margin-bottom: 15px; } }
    @media screen and (max-width: 991px) {
      #dealer-locator #dealer-form .button-plain {
        margin-bottom: 15px;
        display: block;
        width: 100%; } }
  #dealer-locator #default-map {
    height: 400px;
    width: 100%;
    background-image: url("/images/home/default-map.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center; }
    #dealer-locator #default-map.no-results::after {
      content: "Sorry, we couldn't find any dealers in your area";
      color: #fff;
      width: 100%;
      height: 100%;
      position: absolute;
      background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.8));
      display: flex;
      align-items: center;
      justify-content: center; }
  @media screen and (max-width: 767px) {
    #dealer-locator .dealer-info {
      display: flex;
      flex-direction: column-reverse;
      align-items: center; } }
  #dealer-locator .dealer-ad-wrapper {
    width: 100%; }
    @media screen and (max-width: 767px) {
      #dealer-locator .dealer-ad-wrapper {
        background-color: #F6F9F9; } }
    #dealer-locator .dealer-ad-wrapper .dealer-ad {
      width: 100%;
      position: sticky;
      top: 80px;
      height: auto;
      display: none;
      margin: 0 auto; }
      #dealer-locator .dealer-ad-wrapper .dealer-ad img {
        width: 250px;
        box-shadow: none; }
      #dealer-locator .dealer-ad-wrapper .dealer-ad.active {
        display: block; }
      @media screen and (max-width: 767px) {
        #dealer-locator .dealer-ad-wrapper .dealer-ad {
          width: 200px; } }
  #dealer-locator .dealer-list {
    width: 100%;
    background-color: #F6F9F9;
    padding: 10px;
    display: none; }
    #dealer-locator .dealer-list.active {
      display: block; }
    #dealer-locator .dealer-list .dealer-listing {
      padding: 20px;
      margin: 10px 10px 0 10px;
      box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
      background-color: #fff;
      border-left: 2px solid #D9E1EB; }
      #dealer-locator .dealer-list .dealer-listing:last-child {
        margin: 10px; }
      #dealer-locator .dealer-list .dealer-listing h4 {
        font-size: 1.1rem;
        letter-spacing: 1px;
        font-size: bold;
        text-transform: uppercase;
        margin-bottom: 5px; }
      #dealer-locator .dealer-list .dealer-listing h5 {
        font-size: 1rem;
        margin-bottom: 5px; }
      #dealer-locator .dealer-list .dealer-listing .angle-link a {
        padding: 0; }
      #dealer-locator .dealer-list .dealer-listing p {
        font-size: 0.95rem; }
        #dealer-locator .dealer-list .dealer-listing p.dl-address {
          margin-bottom: 5px; }
        #dealer-locator .dealer-list .dealer-listing p.dl-phone-number {
          color: #1B43F5;
          font-weight: bold;
          margin-bottom: 10px; }
        #dealer-locator .dealer-list .dealer-listing p.distance-out {
          color: #888;
          font-style: italic;
          margin-bottom: 0; }
  #dealer-locator .map {
    height: 350px;
    width: 100%;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
    display: none; }
    #dealer-locator .map.active {
      display: block; }
    #dealer-locator .map .leaflet-pane img {
      box-shadow: none; }
    @media screen and (max-width: 767px) {
      #dealer-locator .map {
        border-radius: 0; } }

#pop-out {
  position: absolute;
  bottom: calc(-330px + 57px);
  right: 10%;
  z-index: 900;
  width: 450px;
  height: 323px;
  transition: 0.3s ease-in-out; }
  #pop-out.active {
    bottom: 0;
    transition: 0.3s ease-in-out; }
    #pop-out.active button.po-close {
      transform: rotate(0deg); }
  #pop-out .po-heading {
    background-color: #1B43F5;
    color: #fff;
    border-radius: 25px 25px 0 0;
    padding: 15px;
    text-align: center; }
    #pop-out .po-heading i {
      padding-right: 5px; }
  #pop-out button.po-close {
    transform: rotate(180deg);
    transition: 0.3s ease-in-out;
    position: absolute;
    top: 0;
    right: 0;
    color: #fff;
    padding: 15px;
    opacity: 1;
    background-color: transparent;
    border: none;
    transition: 0.3s ease-in-out; }
    #pop-out button.po-close:hover {
      cursor: pointer; }
  #pop-out .po-content {
    padding: 15px;
    background-color: #fff; }
  @media screen and (max-width: 991px) {
    #pop-out {
      display: none; } }

#mobile-video {
  display: none; }
  @media screen and (max-width: 991px) {
    #mobile-video {
      display: block; } }

* {
  box-sizing: border-box; }

@-webkit-keyframes ticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible; }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); } }
@keyframes ticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible; }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); } }
.ticker-link {
  position: relative;
  transition: 0.3s ease-in-out;
  display: none; }
  .ticker-link.search-active {
    transform: translateY(38px);
    transition: 0.3s ease-in-out; }

.ticker-wrap {
  position: relative;
  width: 100vw;
  overflow: hidden;
  height: 2rem;
  background-color: rgba(0, 0, 0, 0.7);
  padding-left: 100%;
  box-sizing: content-box; }
  .ticker-wrap::after {
    content: "Learn More";
    position: absolute;
    background-color: #1B43F5;
    width: 100vw;
    height: 2rem;
    color: #fff;
    top: -100%;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s ease-in-out; }
  .ticker-wrap:hover::after {
    top: 0;
    transition: 0.3s ease-in-out; }
  .ticker-wrap .ticker {
    display: inline-block;
    white-space: nowrap;
    padding-right: 100%;
    box-sizing: content-box;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-name: ticker;
    animation-name: ticker;
    -webkit-animation-duration: 30s;
    animation-duration: 30s; }
    .ticker-wrap .ticker.item {
      display: inline-block;
      padding: 0 2rem;
      color: white; }

/* Backyard Escape colors */
/* Optimum Colors */
html {
  scroll-behavior: smooth; }

body {
  font-family: 'Lato', sans-serif;
  font-size: 1.125rem;
  color: #333; }
  @media screen and (max-width: 575.98px) {
    body {
      font-size: 1rem; } }
  body.background-dark {
    background-color: #002130; }

h1, .h1 {
  font-weight: 700; }
  @media screen and (max-width: 575.98px) {
    h1, .h1 {
      font-size: 1.875rem; } }

h2 {
  margin-bottom: 10px;
  font-size: 1.75rem;
  font-weight: 700;
  color: #333;
  position: relative;
  margin-top: 3vh; }
  @media screen and (max-width: 575.98px) {
    h2 {
      font-size: 1.5rem; } }

h3, .h3 {
  font-size: 1.45rem;
  font-weight: 700;
  margin-top: 3vh;
  color: #000182; }
  @media screen and (max-width: 575.98px) {
    h3, .h3 {
      font-size: 1.25rem; } }

h4 {
  font-size: 1.35rem;
  padding-top: .6rem;
  font-weight: 500; }
  @media screen and (max-width: 575.98px) {
    h4 {
      font-size: 1.15rem; } }

h5 {
  font-size: 0.95rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: bold;
  color: #333; }

p {
  font-size: 1.125rem;
  line-height: 1.6;
  color: #333; }
  @media screen and (max-width: 575.98px) {
    p {
      font-size: 1rem;
      line-height: 1.5; } }

.ff-fontawesome {
  font-family: 'Font Awesome 6 Pro' !important; }

dd {
  margin-bottom: 1.5rem; }

span.angle-link {
  display: block; }
  span.angle-link a {
    text-transform: uppercase;
    font-size: .95rem;
    font-weight: 600;
    text-align: left;
    margin-top: 0;
    padding: 1rem 0;
    letter-spacing: 1px;
    display: inline-block; }
    span.angle-link a:after {
      font-family: "Font Awesome 6 Pro";
      content: '\f105';
      font-weight: 600;
      font-size: 1.15rem;
      position: relative;
      top: 1px;
      padding-left: .4rem; }

.content a {
  color: #1B43F5; }
  .content a:hover {
    color: #1B43F5; }
.content ul, .content ol {
  margin-bottom: 1rem !important; }
.content ol.spaced-list, .content ul.spaced-list {
  padding-top: .5rem;
  padding-bottom: .5rem; }
  .content ol.spaced-list li:not(:first-child), .content ul.spaced-list li:not(:first-child) {
    padding-top: 1rem; }
.content img {
  width: 100%;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
  height: auto;
  margin-top: 1rem;
  margin-bottom: 1.5rem; }
  .content img.shadow-none {
    box-shadow: none; }
.content .jumbotron.jumbotron-fluid {
  background-image: url("/images/hero.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat; }
  .content .jumbotron.jumbotron-fluid.swag {
    background-image: url("/images/swimaboveground/banner.jpg");
    position: relative; }
    .content .jumbotron.jumbotron-fluid.swag h1 {
      color: #fff;
      position: relative;
      z-index: 1; }
    .content .jumbotron.jumbotron-fluid.swag:before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background: rgba(0, 124, 255, 0.5); }

.slick-arrow.slick-prev::before, .slick-arrow.slick-next::before {
  color: #1B43F5; }

a.basic-button {
  color: #fff;
  background-color: #FF585D; }
  a.basic-button.blue {
    background-color: #1B43F5; }
  a.basic-button.dark-blue {
    background-color: #000182; }

.break-links a {
  word-break: break-all; }

button.button {
  border: none; }

.button {
  position: relative;
  display: inline-block;
  cursor: pointer;
  background: transparent;
  padding: 10px;
  height: auto; }
  .button .circle {
    transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    margin: 0;
    width: 3rem;
    height: 3rem;
    background: #333;
    border-radius: 1.625rem; }
    .button .circle .icon {
      transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto;
      background: #fff; }
      .button .circle .icon.arrow {
        transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
        left: 0.625rem;
        width: 1.125rem;
        height: 0.125rem;
        background: none; }
        .button .circle .icon.arrow::before {
          position: absolute;
          content: '';
          top: -0.25rem;
          right: 0.0625rem;
          width: 0.625rem;
          height: 0.625rem;
          border-top: 0.125rem solid #fff;
          border-right: 0.125rem solid #fff;
          transform: rotate(45deg); }
  .button .button-text {
    transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
    position: relative;
    padding: 0.75rem 0;
    margin: 0 0 0 3.5rem;
    color: #333;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    text-transform: uppercase;
    font-size: 1rem;
    letter-spacing: 1px; }
  .button:hover {
    text-decoration: none; }
    .button:hover .circle {
      width: 110%;
      background-color: #FF585D; }
      .button:hover .circle .icon.arrow {
        background: #fff;
        transform: translate(1rem, 0); }
    .button:hover .button-text {
      color: #fff;
      text-decoration: none; }

.pointer:hover {
  cursor: pointer; }

.button-plain, a.button-plain {
  background-color: #FF585D;
  color: #fff;
  border: none;
  transition: 0.3s ease-out;
  margin: 0 auto;
  padding: 7px 20px;
  border-radius: 25px;
  transition: 0.3s ease-in-out;
  display: inline-block; }
  .button-plain.blue, a.button-plain.blue {
    background-color: #1B43F5; }
  .button-plain.full-width, a.button-plain.full-width {
    width: 100%;
    text-align: center; }
  .button-plain.half-width, a.button-plain.half-width {
    width: 50%;
    text-align: center; }
  .button-plain:focus, a.button-plain:focus {
    outline: none; }
  .button-plain i, a.button-plain i {
    margin-right: 7px;
    font-size: 1rem; }
  .button-plain.search, a.button-plain.search {
    margin: 0;
    width: 175px; }
  .button-plain:hover, a.button-plain:hover {
    transform: translateY(-5px);
    transition: 0.3s ease-out;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    color: #fff; }
  .button-plain:focus, a.button-plain:focus {
    outline: none; }
  .button-plain::after, a.button-plain::after {
    display: none; }
  @media screen and (max-width: 767.98px) {
    .button-plain, a.button-plain {
      max-width: 100%; } }
  .button-plain.reset, a.button-plain.reset {
    max-width: 100%; }
  .button-plain img, a.button-plain img {
    display: inline;
    box-shadow: none;
    width: 70px;
    margin: 0; }

.button-scroll-down {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 90px;
  left: 0;
  right: 0; }
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .button-scroll-down {
      display: none; } }
  @media screen and (max-width: 991.98px) {
    .button-scroll-down {
      display: none; } }
  .button-scroll-down .bg-pulse,
  .button-scroll-down .pulsing-button {
    width: 50px;
    height: 50px;
    border-radius: 25px;
    z-index: 100; }
  .button-scroll-down .bg-pulse {
    animation: pulsing 1.2s ease infinite;
    background: #1B43F5; }
  .button-scroll-down .pulsing-button {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    border: none;
    background: #1B43F5;
    background-size: 18px;
    cursor: pointer;
    outline: none;
    transition: 0.3s ease-in-out; }
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      .button-scroll-down .pulsing-button {
        right: calc(50% - 25px);
        bottom: 0; } }
    .button-scroll-down .pulsing-button:hover {
      transform: scale(1.1);
      box-shadow: 0 0 0 3px #fff;
      transition: 0.3s ease-in-out; }
    .button-scroll-down .pulsing-button a {
      position: absolute;
      color: #fff;
      font-size: 17px;
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center; }
      @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
        .button-scroll-down .pulsing-button a {
          right: calc(50% - 25px);
          bottom: -2px; } }
      .button-scroll-down .pulsing-button a:hover {
        text-decoration: none; }

a.adobe img {
  width: auto; }

.side-ad {
  margin-top: 20px; }
  .side-ad img {
    width: 100%; }

/*-------------------RELATED ARTICLES--------------------*/
.brands-products {
  border-top: 1px solid #333; }

.hot-topics {
  border-top: 1px solid #333; }

.blogs-articles {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5vh; }
  .blogs-articles > .row {
    padding-left: 3%;
    padding-right: 3%; }
    .blogs-articles > .row h5 {
      font-weight: bold;
      letter-spacing: 1px;
      text-transform: uppercase; }
    @media screen and (max-width: 767.98px) {
      .blogs-articles > .row {
        padding-left: 0;
        padding-right: 0; } }
  .blogs-articles .left {
    width: 70%;
    border-top: 1px solid #333; }
    .blogs-articles .left h5 {
      margin-bottom: 0;
      padding-top: 1rem;
      padding-bottom: 1rem;
      font-size: 1.1rem; }
    @media screen and (max-width: 767.98px) {
      .blogs-articles .left {
        width: 100%; } }
    .blogs-articles .left .top-flex {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      padding-bottom: 2rem; }
      @media screen and (max-width: 767.98px) {
        .blogs-articles .left .top-flex {
          padding-left: 20px;
          padding-right: 20px; } }
      .blogs-articles .left .top-flex div.related-product {
        max-width: 23%;
        flex-basis: 23%; }
        .blogs-articles .left .top-flex div.related-product a {
          display: flex;
          align-items: center;
          justify-content: center;
          position: relative; }
          .blogs-articles .left .top-flex div.related-product a p {
            padding-top: .7rem;
            margin-bottom: 0;
            position: absolute;
            color: #fff;
            bottom: 0;
            background-image: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
            padding: 7px;
            width: 100%; }
          .blogs-articles .left .top-flex div.related-product a img {
            width: 100%; }
    .blogs-articles .left .related-articles h5 {
      padding-top: .7rem;
      margin-bottom: 0;
      padding-top: 1rem;
      padding-bottom: 1rem;
      font-size: 1.1rem; }
      @media screen and (max-width: 767.98px) {
        .blogs-articles .left .related-articles h5 {
          padding-left: 20px;
          padding-right: 20px; } }
    .blogs-articles .left .related-articles .bottom-flex {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between; }
      @media screen and (max-width: 767.98px) {
        .blogs-articles .left .related-articles .bottom-flex {
          padding-left: 15px;
          padding-right: 15px; } }
      .blogs-articles .left .related-articles .bottom-flex > div {
        max-width: 31%;
        flex-basis: 31%;
        position: relative;
        margin-top: .7rem; }
        @media screen and (max-width: 575.98px) {
          .blogs-articles .left .related-articles .bottom-flex > div {
            padding-bottom: .5rem; } }
        .blogs-articles .left .related-articles .bottom-flex > div a {
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0; }
        .blogs-articles .left .related-articles .bottom-flex > div:hover .title-date h4 {
          text-decoration: underline; }
        @media screen and (max-width: 575.98px) {
          .blogs-articles .left .related-articles .bottom-flex > div:first-of-type h4 {
            padding-top: .7rem; } }
        @media screen and (max-width: 575.98px) {
          .blogs-articles .left .related-articles .bottom-flex > div {
            max-width: 48%;
            flex-basis: 48%; } }
        .blogs-articles .left .related-articles .bottom-flex > div h4 {
          padding-top: .7rem;
          padding-right: 15px;
          font-size: 1.1rem;
          color: #333; }
          @media screen and (max-width: 991.98px) {
            .blogs-articles .left .related-articles .bottom-flex > div h4 {
              font-size: 1rem; } }
        .blogs-articles .left .related-articles .bottom-flex > div h6 {
          color: #757575;
          font-weight: 400; }
        .blogs-articles .left .related-articles .bottom-flex > div img {
          width: 100%;
          box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }
  .blogs-articles .right {
    width: 25%;
    margin-left: auto;
    border-top: 1px solid #333; }
    @media screen and (max-width: 767.98px) {
      .blogs-articles .right {
        display: none; } }
    .blogs-articles .right h4 {
      margin-bottom: 0;
      padding-top: 1rem;
      padding-bottom: 1rem;
      font-size: 1.1rem;
      font-weight: bold;
      letter-spacing: 1px;
      text-transform: uppercase; }
    .blogs-articles .right p {
      font-size: 1rem;
      padding-top: 10px;
      padding-bottom: 10px;
      margin-bottom: 0;
      border-top: 1px solid #D9E1EB; }
      .blogs-articles .right p a {
        color: black; }
        .blogs-articles .right p a:hover {
          color: #888; }

.content {
  margin-top: 86px;
  display: block; }
  @media screen and (max-width: 991.98px) {
    .content {
      margin-top: 60px; } }
  .content#page-content.content-scroll-up {
    margin-top: 86px;
    transition: 0.4s ease-in-out; }
    @media screen and (max-width: 991.98px) {
      .content#page-content.content-scroll-up {
        margin-top: 60px; } }
  .content#page-content.content-scroll-down {
    margin-top: 56px;
    transition: 0.4s ease-in-out; }
    @media screen and (max-width: 991.98px) {
      .content#page-content.content-scroll-down {
        margin-top: 0; } }
  .content ol.breadcrumb {
    background-color: #fff;
    border-bottom: 1px solid #333;
    border-radius: 0;
    padding-left: 0;
    padding-right: 0; }
    @media screen and (max-width: 575.98px) {
      .content ol.breadcrumb {
        padding: .5rem 0; } }
    .content ol.breadcrumb li.breadcrumb-item.active a {
      color: #1B43F5; }
    .content ol.breadcrumb li.breadcrumb-item a {
      font-size: 1rem;
      color: #333; }
      @media screen and (max-width: 575.98px) {
        .content ol.breadcrumb li.breadcrumb-item a {
          font-size: .875rem; } }

/*-------------RELATED ARTICLES END------------*/
/*-------------------BLOGS--------------------*/
.blog-page .top-blogs {
  position: relative; }
  .blog-page .top-blogs::before {
    content: '';
    border-top: 5px solid #FFAC04;
    border-right: 5px solid #FFAC04;
    border-left: 5px solid #FFAC04;
    position: absolute;
    width: 100%;
    left: 0;
    top: 35px;
    height: 40px;
    z-index: -10; }
  .blog-page .top-blogs h2 {
    text-align: center;
    display: inline-block;
    padding: 20px;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 auto;
    background-color: #fff;
    z-index: 100;
    font-weight: 900; }
.blog-page .blogs .blog-link {
  border-bottom: 1px solid #D9E1EB; }
  .blog-page .blogs .blog-link:last-child {
    border: 0; }
  .blog-page .blogs .blog-link:hover {
    border-bottom: 1px solid #FFAC04; }
  .blog-page .blogs .blog-link.featured .blog-link-content .post-categories span {
    margin-bottom: 0; }
  .blog-page .blogs .blog-link:not(.featured) h2, .blog-page .blogs .blog-link:not(.sub-featured) h2 {
    margin-top: 0; }
  .blog-page .blogs .blog-link > a {
    width: 100%;
    height: 100%;
    display: block;
    padding: 10px; }
    .blog-page .blogs .blog-link > a:hover {
      background-color: #F6F9F9;
      text-decoration: none; }
      .blog-page .blogs .blog-link > a:hover h2 {
        color: black; }
  .blog-page .blogs .blog-link .blog-link-thumbnail {
    margin-bottom: 1rem; }
    .blog-page .blogs .blog-link .blog-link-thumbnail img {
      width: 100%;
      margin-bottom: 0;
      margin-top: 0; }
  .blog-page .blogs .blog-link .blog-link-content {
    padding-right: 1rem; }
    .blog-page .blogs .blog-link .blog-link-content h2 {
      color: #333;
      font-weight: 900; }
    .blog-page .blogs .blog-link .blog-link-content p {
      font-size: 0.95rem;
      margin-bottom: 0; }
    @media screen and (max-width: 991px) {
      .blog-page .blogs .blog-link .blog-link-content {
        padding-right: 0; } }
  .blog-page .blogs .blog-link.blog-list .blog-link-content h2 {
    font-size: 1.1rem;
    margin-bottom: 5px; }
.blog-page .bottom-blogs {
  position: relative; }
  .blog-page .bottom-blogs .blog-section-title h2 {
    padding: 20px 10px;
    border-bottom: 4px solid #FFAC04; }
  .blog-page .bottom-blogs .blogs .blog-list a {
    display: flex;
    align-items: center;
    justify-content: space-between; }
    .blog-page .bottom-blogs .blogs .blog-list a .blog-link-content {
      width: 60%; }
      .blog-page .bottom-blogs .blogs .blog-list a .blog-link-content h2 {
        font-size: 1.3rem; }
      @media screen and (max-width: 991.98px) {
        .blog-page .bottom-blogs .blogs .blog-list a .blog-link-content {
          width: 100%; } }
    .blog-page .bottom-blogs .blogs .blog-list a .blog-link-thumbnail {
      width: 40%; }
      @media screen and (max-width: 991.98px) {
        .blog-page .bottom-blogs .blogs .blog-list a .blog-link-thumbnail {
          display: none; } }
  .blog-page .bottom-blogs .blog-ad .side-ad {
    max-width: 100%;
    position: sticky;
    top: 97px;
    margin: 10px; }

@media screen and (max-width: 992px) {
  .inline-nav-wrapper {
    display: none; } }
.inline-nav-wrapper .inline-nav {
  position: sticky;
  margin: 0 1%;
  top: 110px; }
  .inline-nav-wrapper .inline-nav.inline-scroll-down {
    top: 80px;
    transition: 0.4s ease-in-out; }
  .inline-nav-wrapper .inline-nav.inline-scroll-up {
    top: 110px;
    transition: 0.4s ease-in-out; }
  .inline-nav-wrapper .inline-nav a.list-group-item {
    font-size: 0.95rem;
    transition: all 0.05s ease-in-out;
    text-align: center;
    color: #333; }
    .inline-nav-wrapper .inline-nav a.list-group-item.highlighted {
      background-color: #1B43F5;
      color: #fff;
      transition: all 0.05s ease-in-out;
      border: 0; }
  @media screen and (max-width: 991.98px) {
    .inline-nav-wrapper .inline-nav {
      flex-direction: row;
      align-items: center;
      flex-wrap: wrap; }
      .inline-nav-wrapper .inline-nav a.list-group-item {
        width: 50%;
        border-radius: 0; }
        .inline-nav-wrapper .inline-nav a.list-group-item:nth-child(odd) {
          border-right: 0; }
        .inline-nav-wrapper .inline-nav a.list-group-item:last-child {
          border: 1px solid rgba(0, 0, 0, 0.125); }
        .inline-nav-wrapper .inline-nav a.list-group-item:last-child:nth-child(odd) {
          width: 100%; } }

p.post-categories span {
  font-size: 0.95rem;
  text-transform: uppercase;
  color: #000182;
  letter-spacing: 1px;
  display: block;
  margin-bottom: .35rem; }

p.post-tags span {
  display: block;
  font-size: 0.85rem;
  color: #3465c7;
  letter-spacing: 1px;
  text-transform: capitalize;
  margin-top: .35rem;
  margin-bottom: .35rem; }

.blog-heading {
  padding-top: 3rem; }

.blog-image {
  height: auto;
  max-height: 75vh;
  width: 100%;
  overflow: hidden;
  justify-content: center;
  align-items: center;
  display: flex;
  margin-top: 3rem;
  margin-bottom: 3rem; }
  .blog-image .blog-header-image {
    width: 100%;
    margin: 0; }

.blog-medium-image {
  margin-top: 3rem;
  margin-bottom: 3rem; }

.blog-content img {
  max-width: 100%;
  display: block;
  margin-left: auto;
  margin-right: auto; }

.embed-responsive {
  margin-top: 3vh;
  margin-bottom: 3vh; }

.checklist > li {
  list-style: none;
  position: relative; }
  .checklist > li:before {
    font-family: "Font Awesome 6 Pro";
    content: "\f0c8";
    font-weight: 400;
    position: absolute;
    left: -30px;
    font-style: normal; }

.signature-box {
  border: 3px solid #1B43F5;
  width: auto;
  position: relative;
  display: inline-block;
  margin-top: 15px; }
  .signature-box h3 {
    position: absolute;
    left: 20px;
    top: -51px;
    background-color: #fff;
    padding: 10px; }
    @media screen and (max-width: 575.98px) {
      .signature-box h3 {
        left: 12px;
        padding: 8px; } }
  .signature-box .signature {
    font-family: 'Yellowtail', cursive;
    font-size: 3rem;
    padding: 20px 30px;
    margin-bottom: 0; }
    @media screen and (max-width: 575.98px) {
      .signature-box .signature {
        font-size: 1.7rem;
        padding: 13px 20px; } }

.faq-section div:not(.tip) {
  padding: 1rem; }
  .faq-section div:not(.tip):nth-child(odd) {
    background-color: #F6F9F9; }
  .faq-section div:not(.tip) h3 {
    font-size: 1.25rem;
    margin-top: 0;
    margin-bottom: 1rem;
    color: #333; }
    @media screen and (max-width: 575.98px) {
      .faq-section div:not(.tip) h3 {
        font-size: 1.1rem;
        line-height: 1.6rem; } }
    .faq-section div:not(.tip) h3:before {
      content: 'Q: '; }
  .faq-section div:not(.tip) p:first-of-type:before {
    content: 'A: ';
    font-weight: bold; }
  .faq-section div:not(.tip) p.exempt::before {
    content: ''; }

.button-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-around; }
  .button-list .button-plain {
    width: calc(48% - 10px);
    margin: 5px;
    text-align: center;
    padding: 5px; }

img.suntrust-blog {
  padding: 0 !important;
  display: inline-block !important;
  position: relative;
  bottom: -2px;
  width: auto; }

.img-flex {
  display: flex;
  align-items: center;
  justify-content: center; }
  .img-flex.one img {
    width: auto;
    box-shadow: none; }
  .img-flex.box-flex {
    align-items: flex-start; }
    .img-flex.box-flex .img-box {
      box-sizing: border-box;
      padding: 10px;
      max-width: 33%; }
      .img-flex.box-flex .img-box img {
        width: 100%; }
  .img-flex.three img {
    width: 32%; }

.adobe.inline img {
  display: inline;
  margin-left: 10px; }

.tip {
  display: block;
  margin: 25px 0;
  border-left: 2px solid #1B43F5;
  background-color: #F6F9F9;
  padding: 20px 30px;
  font-style: italic;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }
  @media screen and (max-width: 575.98px) {
    .tip {
      padding: 15px 25px; } }
  .tip h4 {
    font-weight: 600; }
  .tip p {
    font-weight: 400;
    margin-bottom: .6rem; }

.anchor {
  display: block;
  position: relative;
  top: -70px;
  visibility: hidden; }

.anchor-link {
  display: block;
  position: relative;
  top: -70px; }
  .anchor-link dt, .anchor-link dd {
    position: relative;
    top: 70px; }
  .anchor-link:target dt, .anchor-link:target dd {
    background-color: yellow; }

/*-----------------------BLOG END-------------------*/
/*------------MAINTENANCE START------------------*/
#calculator {
  background-color: #fff;
  padding: 0; }
  #calculator .volume-calc-buttons {
    display: flex;
    align-items: center;
    justify-content: center; }
    @media screen and (max-width: 767px) {
      #calculator .volume-calc-buttons {
        flex-wrap: wrap; } }

.pvc-button {
  background-color: #D9E1EB;
  color: #333;
  padding: 10px 20px;
  border-radius: 25px;
  border: none;
  width: calc(33% - 10px);
  margin: 5px;
  position: relative;
  overflow: hidden; }
  .pvc-button span {
    z-index: 100;
    position: relative;
    transition: 0.3s ease-in-out; }
  .pvc-button::after {
    position: absolute;
    content: '';
    background-color: #FF585D;
    border-radius: 100px;
    top: 0;
    right: -150%;
    z-index: 90;
    width: 150%;
    height: 100%;
    transition: 0.5s ease-in-out; }
  .pvc-button:hover span {
    color: #fff;
    transition: 0.3s ease-in-out; }
  .pvc-button:hover::after {
    right: 0;
    transition: 0.5s ease-in-out; }
  .pvc-button.active {
    background-color: #FF585D;
    color: #fff; }
  @media screen and (max-width: 767px) {
    .pvc-button {
      width: 100%; } }

.result h2 {
  margin-top: 0; }
.result output {
  font-size: 3rem;
  font-weight: bold; }

#media-gallery, #resources-hub {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-wrap: wrap;
  max-width: 1080px;
  margin: 0 auto; }
  #media-gallery .featured-media, #resources-hub .featured-media {
    height: 55vh;
    position: relative;
    width: 90vw;
    margin: 20px auto 15vh auto; }
    @media screen and (max-width: 991.98px) {
      #media-gallery .featured-media, #resources-hub .featured-media {
        height: auto;
        margin: 20px auto; } }
    #media-gallery .featured-media.responsive, #resources-hub .featured-media.responsive {
      width: calc(50% - 10px);
      margin: 20px 20px 15vh 0; }
      @media screen and (max-width: 1300px) {
        #media-gallery .featured-media.responsive, #resources-hub .featured-media.responsive {
          width: calc(49.5% - 10px); } }
      @media screen and (max-width: 991.98px) {
        #media-gallery .featured-media.responsive, #resources-hub .featured-media.responsive {
          margin: 20px auto; } }
      @media screen and (max-width: 767.98px) {
        #media-gallery .featured-media.responsive, #resources-hub .featured-media.responsive {
          width: 90vw; } }
    @media screen and (max-width: 1300px) {
      #media-gallery .featured-media:nth-child(3n).responsive, #resources-hub .featured-media:nth-child(3n).responsive {
        margin: 20px 0 15vh 10px; } }
    @media screen and (max-width: 991.98px) {
      #media-gallery .featured-media:nth-child(3n).responsive, #resources-hub .featured-media:nth-child(3n).responsive {
        margin: 20px auto; } }
    #media-gallery .featured-media:last-child.responsive, #resources-hub .featured-media:last-child.responsive {
      margin: 20px 0 15vh 0; }
      @media screen and (max-width: 1300px) {
        #media-gallery .featured-media:last-child.responsive, #resources-hub .featured-media:last-child.responsive {
          width: 90vw;
          margin: 20px auto 15vh auto; } }
      @media screen and (max-width: 991.98px) {
        #media-gallery .featured-media:last-child.responsive, #resources-hub .featured-media:last-child.responsive {
          margin: 20px auto; } }
    #media-gallery .featured-media .media-image, #media-gallery .featured-media .resource-image, #resources-hub .featured-media .media-image, #resources-hub .featured-media .resource-image {
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      width: 100%;
      height: 100%; }
      #media-gallery .featured-media .media-image.virtual-tours, #media-gallery .featured-media .resource-image.virtual-tours, #resources-hub .featured-media .media-image.virtual-tours, #resources-hub .featured-media .resource-image.virtual-tours {
        background-image: url("/images/media-gallery/virtual-tours-167449482.jpg");
        background-position: center; }
        @media screen and (max-width: 1200px) {
          #media-gallery .featured-media .media-image.virtual-tours, #media-gallery .featured-media .resource-image.virtual-tours, #resources-hub .featured-media .media-image.virtual-tours, #resources-hub .featured-media .resource-image.virtual-tours {
            background-position: bottom; } }
      #media-gallery .featured-media .media-image.design-quiz, #media-gallery .featured-media .resource-image.design-quiz, #resources-hub .featured-media .media-image.design-quiz, #resources-hub .featured-media .resource-image.design-quiz {
        background-image: url("/images/media-gallery/design-quiz-1201616295.jpg");
        background-position: bottom; }
      #media-gallery .featured-media .media-image.style-board, #media-gallery .featured-media .resource-image.style-board, #resources-hub .featured-media .media-image.style-board, #resources-hub .featured-media .resource-image.style-board {
        background-image: url("/images/media-gallery/style-baords-1174824551.jpg"); }
      #media-gallery .featured-media .media-image.gallery, #media-gallery .featured-media .resource-image.gallery, #resources-hub .featured-media .media-image.gallery, #resources-hub .featured-media .resource-image.gallery {
        background-image: url("/images/media-gallery/gallery-1149222351.jpg");
        background-position: center; }
        @media screen and (max-width: 1300px) {
          #media-gallery .featured-media .media-image.gallery, #media-gallery .featured-media .resource-image.gallery, #resources-hub .featured-media .media-image.gallery, #resources-hub .featured-media .resource-image.gallery {
            background-image: url("/images/media-gallery/gallery-1059071118.jpg"); } }
      #media-gallery .featured-media .media-image.pool-volume-calculator, #media-gallery .featured-media .resource-image.pool-volume-calculator, #resources-hub .featured-media .media-image.pool-volume-calculator, #resources-hub .featured-media .resource-image.pool-volume-calculator {
        background-image: url("/images/home/pool-volume-calculator-1200084511.jpg"); }
      #media-gallery .featured-media .media-image.financing, #media-gallery .featured-media .resource-image.financing, #resources-hub .featured-media .media-image.financing, #resources-hub .featured-media .resource-image.financing {
        background-image: url("/images/resources/financing-1147491300.jpg"); }
      #media-gallery .featured-media .media-image.glossary, #media-gallery .featured-media .resource-image.glossary, #resources-hub .featured-media .media-image.glossary, #resources-hub .featured-media .resource-image.glossary {
        background-image: url("/images/resources/glossary-175397396.jpg"); }
      #media-gallery .featured-media .media-image.npt-mobile-app, #media-gallery .featured-media .resource-image.npt-mobile-app, #resources-hub .featured-media .media-image.npt-mobile-app, #resources-hub .featured-media .resource-image.npt-mobile-app {
        background-image: url("/images/resources/npt-mobile-app.jpg"); }
      #media-gallery .featured-media .media-image.more-coming-soon, #media-gallery .featured-media .resource-image.more-coming-soon, #resources-hub .featured-media .media-image.more-coming-soon, #resources-hub .featured-media .resource-image.more-coming-soon {
        background-image: url("/images/resources/more-coming-soon-1157187394.jpg"); }
      @media screen and (max-width: 991.98px) {
        #media-gallery .featured-media .media-image, #media-gallery .featured-media .resource-image, #resources-hub .featured-media .media-image, #resources-hub .featured-media .resource-image {
          height: 30vh; } }
    #media-gallery .featured-media .media-content, #media-gallery .featured-media .resource-content, #resources-hub .featured-media .media-content, #resources-hub .featured-media .resource-content {
      position: absolute;
      bottom: -25%;
      left: 20px;
      right: 20px;
      padding: 30px;
      background-color: #fff;
      box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
      max-width: 800px; }
      @media screen and (max-width: 991.98px) {
        #media-gallery .featured-media .media-content, #media-gallery .featured-media .resource-content, #resources-hub .featured-media .media-content, #resources-hub .featured-media .resource-content {
          position: relative;
          bottom: initial;
          right: initial;
          left: initial;
          top: initial;
          max-width: 100%; } }
      @media screen and (max-width: 575.98px) {
        #media-gallery .featured-media .media-content, #media-gallery .featured-media .resource-content, #resources-hub .featured-media .media-content, #resources-hub .featured-media .resource-content {
          padding: 20px; } }
      #media-gallery .featured-media .media-content h2, #media-gallery .featured-media .resource-content h2, #resources-hub .featured-media .media-content h2, #resources-hub .featured-media .resource-content h2 {
        text-transform: uppercase;
        letter-spacing: 2px;
        font-weight: 900;
        margin-top: 0; }
        #media-gallery .featured-media .media-content h2 span, #media-gallery .featured-media .resource-content h2 span, #resources-hub .featured-media .media-content h2 span, #resources-hub .featured-media .resource-content h2 span {
          color: #FF585D; }

.style-block {
  height: auto;
  width: 100%;
  color: #fff;
  font-size: 1.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center; }
  .style-block .type {
    box-shadow: 0;
    margin-top: 0;
    margin-bottom: 0; }
  .style-block.cabaret {
    background-image: url("/images/media-gallery/style-board/cabaret/thumbnail/cabaret.jpg"); }
  .style-block.classic {
    background-image: url("/images/media-gallery/style-board/classic/thumbnail/classic.jpg"); }
  .style-block.deep-blue-sea {
    background-image: url("/images/media-gallery/style-board/deep-blue-sea/thumbnail/deep-blue-sea.jpg"); }
  .style-block.glam {
    background-image: url("/images/media-gallery/style-board/glam/thumbnail/glam.jpg"); }
  .style-block.mermaid {
    background-image: url("/images/media-gallery/style-board/mermaid/thumbnail/mermaid.jpg"); }
  .style-block.sand-castle {
    background-image: url("/images/media-gallery/style-board/sand-castle/thumbnail/sand-castle.jpg"); }
  .style-block.modern {
    background-image: url("/images/media-gallery/style-board/modern/thumbnail/modern.jpg"); }
  .style-block.natural {
    background-image: url("/images/media-gallery/style-board/natural/thumbnail/natural.jpg"); }
  .style-block.rustic {
    background-image: url("/images/media-gallery/style-board/rustic/thumbnail/rustic.jpg"); }
  .style-block.world-travel {
    background-image: url("/images/media-gallery/style-board/world-travel/thumbnail/world-travel.jpg"); }

.ie-message {
  display: none; }
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .ie-message {
      display: block; } }

.accordion.gallery-filters {
  max-width: 350px;
  margin-left: auto; }
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .accordion.gallery-filters {
      display: none;
      width: 0px !important; } }
  @media screen and (max-width: 991.98px) {
    .accordion.gallery-filters {
      max-width: initial;
      margin-bottom: 10px; } }
  .accordion.gallery-filters .card {
    border: none; }
    .accordion.gallery-filters .card:first-child {
      border-radius: 0.25rem 0.25rem 0 0; }
    .accordion.gallery-filters .card:last-child {
      border-radius: 0 0 0.25rem 0.25rem; }
    .accordion.gallery-filters .card .card-header {
      padding: 0; }
      .accordion.gallery-filters .card .card-header button.btn-link {
        width: 100%;
        padding: 12px;
        position: relative;
        background-color: #1B43F5;
        color: #fff;
        transition: 0.5s ease-in-out;
        border-radius: 0;
        border-top: 0;
        border-right: 0;
        border-left: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.5); }
        .accordion.gallery-filters .card .card-header button.btn-link:focus {
          text-decoration: none; }
        .accordion.gallery-filters .card .card-header button.btn-link.collapsed {
          background-color: #D9E1EB;
          color: #333; }
        .accordion.gallery-filters .card .card-header button.btn-link::after {
          position: absolute;
          width: 150%;
          height: 100%;
          right: -150%;
          top: 0;
          transition: 0.5s ease-in-out;
          background-color: #1B43F5;
          border-radius: 50px 0 0 50px;
          content: '';
          z-index: 0; }
        .accordion.gallery-filters .card .card-header button.btn-link:hover {
          color: #fff;
          transition: 0.5s ease-in-out;
          text-decoration: none; }
          .accordion.gallery-filters .card .card-header button.btn-link:hover::after {
            right: 0;
            transition: 0.5s ease-in-out; }
        .accordion.gallery-filters .card .card-header button.btn-link span {
          z-index: 100;
          position: relative;
          font-size: 1rem; }
    .accordion.gallery-filters .card .card-body {
      background-color: #F6F9F9; }
      .accordion.gallery-filters .card .card-body ul {
        padding: 0;
        width: 100%; }
        .accordion.gallery-filters .card .card-body ul li {
          list-style: none;
          padding: 2px 25px;
          width: 100%; }
          .accordion.gallery-filters .card .card-body ul li label {
            display: block;
            position: relative;
            padding-left: 1.75rem;
            cursor: pointer;
            user-select: none;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none; }
            .accordion.gallery-filters .card .card-body ul li label:hover input ~ .checkmark {
              background-color: #AFB4BE; }
          .accordion.gallery-filters .card .card-body ul li input {
            margin-right: 5px;
            position: absolute;
            opacity: 0;
            cursor: pointer;
            height: 0;
            width: 0; }
            .accordion.gallery-filters .card .card-body ul li input:checked ~ .checkmark {
              background-color: #1B43F5 !important; }
              .accordion.gallery-filters .card .card-body ul li input:checked ~ .checkmark::after {
                display: block; }
          .accordion.gallery-filters .card .card-body ul li .checkmark {
            position: absolute;
            top: 4px;
            left: -10px;
            height: 20px;
            width: 20px;
            background-color: #D9E1EB; }
            .accordion.gallery-filters .card .card-body ul li .checkmark::after {
              content: "";
              position: absolute;
              display: none;
              font-family: "Font Awesome 6 Pro";
              font-weight: 900;
              content: "\f00c";
              color: #fff;
              left: 4px;
              top: 1px;
              font-size: .8rem; }
          .accordion.gallery-filters .card .card-body ul li span {
            font-size: 1rem; }

.gallery-photos {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  height: 100%; }
  .gallery-photos .gallery-photo {
    width: calc(25% - 1px);
    overflow: hidden;
    max-width: 250px;
    position: relative;
    margin: 0.5px; }
    .gallery-photos .gallery-photo:after {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: rgba(0, 0, 0, 0.4);
      width: 100%;
      height: 100%;
      content: '';
      opacity: 0;
      z-index: 50; }
    .gallery-photos .gallery-photo a.thumbnail-link {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      z-index: 90;
      opacity: 0;
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: 0.2s ease-in-out;
      font-size: 1.25rem;
      text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
      cursor: pointer; }
    .gallery-photos .gallery-photo img {
      width: 100%;
      margin-bottom: 0;
      margin-top: 0;
      appearance: none;
      -moz-appearance: none;
      -webkit-appearance: none;
      transition: 0.3s ease-in-out; }
    @media screen and (max-width: 991.98px) {
      .gallery-photos .gallery-photo {
        margin: 0 0 10px 5px;
        width: calc(50% - 5px); }
        .gallery-photos .gallery-photo:nth-child(odd) {
          margin: 0 5px 10px 0; } }
    .gallery-photos .gallery-photo.filtered {
      display: none; }
    .gallery-photos .gallery-photo:hover:after {
      opacity: 1; }
    .gallery-photos .gallery-photo:hover a.thumbnail-link {
      opacity: 1;
      text-decoration: none;
      transition: 0.2s ease-in-out; }
    .gallery-photos .gallery-photo:hover img {
      transform: scale(1.1);
      transition: 0.2s ease-in-out; }

.joedal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 200;
  display: none;
  align-items: center;
  justify-content: center;
  -webkit-touch-callout: none;
  /* prevent callout to copy image, etc when tap to hold */
  -webkit-text-size-adjust: none;
  /* prevent webkit from resizing text to fit */
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  /* prevent tap highlight color / shadow */
  -webkit-user-select: none; }
  .joedal .joedal-center {
    max-width: 100%; }
  .joedal i.prev-arrow, .joedal i.next-arrow {
    color: #fff;
    position: absolute;
    padding: 10px 20px;
    background-color: rgba(0, 0, 0, 0.5);
    top: 49%;
    z-index: 100; }
  .joedal i.prev-arrow {
    left: 0; }
  .joedal i.next-arrow {
    right: 0; }
  .joedal .close-gallery {
    background-color: #fff;
    border-radius: 40px;
    width: 3.4375em;
    height: 3.4375em; }
    .joedal .close-gallery a {
      height: 100%;
      width: 100%;
      display: flex; }
      .joedal .close-gallery a:hover {
        text-decoration: none; }
      .joedal .close-gallery a i {
        font-size: 1.5rem;
        align-items: center;
        display: flex;
        margin: 0 auto; }
  .joedal .gallery-lightbox {
    position: relative;
    width: 800px;
    max-width: 100%; }
    .joedal .gallery-lightbox #lightbox-nav {
      position: absolute;
      top: 0;
      right: -3.5rem; }
      @media screen and (max-width: 991px) {
        .joedal .gallery-lightbox #lightbox-nav {
          top: -52px;
          right: 0; } }
      @media screen and (max-width: 825px) {
        .joedal .gallery-lightbox #lightbox-nav {
          right: 1rem; } }
      .joedal .gallery-lightbox #lightbox-nav .lightbox-nav-btns {
        margin-bottom: 1rem;
        display: flex;
        flex-direction: column; }
        @media screen and (max-width: 991px) {
          .joedal .gallery-lightbox #lightbox-nav .lightbox-nav-btns {
            flex-direction: row-reverse;
            margin-bottom: 0; } }
      .joedal .gallery-lightbox #lightbox-nav a.lightbox-btn {
        position: relative;
        background-color: #1B43F5;
        color: #fff;
        width: 42px;
        height: 42px;
        border-radius: 21px;
        padding: .5rem;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 10px;
        transition: 0.3s ease-in-out; }
        .joedal .gallery-lightbox #lightbox-nav a.lightbox-btn.collapsed {
          background-color: #fff;
          color: #1B43F5; }
        .joedal .gallery-lightbox #lightbox-nav a.lightbox-btn.highlighted {
          background-color: #1B43F5;
          color: #fff;
          transition: 0.3s ease-in-out; }
        .joedal .gallery-lightbox #lightbox-nav a.lightbox-btn i {
          font-size: 1.25rem; }
        @media screen and (max-width: 991px) {
          .joedal .gallery-lightbox #lightbox-nav a.lightbox-btn {
            margin-bottom: 0;
            margin-left: 10px; } }
    .joedal .gallery-lightbox .social, .joedal .gallery-lightbox .description {
      position: absolute;
      bottom: 0; }
    .joedal .gallery-lightbox .social {
      width: 100%;
      background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent); }
      .joedal .gallery-lightbox .social .card-body {
        padding: 1rem;
        border: none; }
        .joedal .gallery-lightbox .social .card-body.social-card {
          background-color: transparent;
          padding: 0 !important; }
          .joedal .gallery-lightbox .social .card-body.social-card ul.gallery-share {
            list-style: none;
            padding: 0;
            margin: 0 !important;
            display: flex;
            align-items: center;
            justify-content: center; }
            .joedal .gallery-lightbox .social .card-body.social-card ul.gallery-share li {
              background-color: #fff;
              padding: .5rem;
              border-radius: 21px;
              height: 42px;
              width: 42px;
              display: flex;
              justify-content: center;
              align-items: center;
              margin: 0 10px 10px 10px;
              box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); }
              .joedal .gallery-lightbox .social .card-body.social-card ul.gallery-share li a i {
                position: relative;
                top: 2px;
                right: -1px; }
              .joedal .gallery-lightbox .social .card-body.social-card ul.gallery-share li a.facebook {
                color: #3b5998; }
              .joedal .gallery-lightbox .social .card-body.social-card ul.gallery-share li a.twitter {
                color: #1DA1F2; }
              .joedal .gallery-lightbox .social .card-body.social-card ul.gallery-share li a.pinterest {
                color: #BD081C; }
              .joedal .gallery-lightbox .social .card-body.social-card ul.gallery-share li a.email {
                color: #000182; }
              .joedal .gallery-lightbox .social .card-body.social-card ul.gallery-share li a:hover {
                text-decoration: none; }
              .joedal .gallery-lightbox .social .card-body.social-card ul.gallery-share li a i {
                font-size: 1.5rem; }
    .joedal .gallery-lightbox img.gallery-image {
      margin: 0;
      max-width: 800px;
      box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
      display: block; }

/*-----------EMPLOYEES START-----------------*/
.employee-carousel .employee-slide {
  position: relative; }
  @media screen and (max-width: 991.98px) {
    .employee-carousel .employee-slide {
      width: 600px; } }
  @media screen and (max-width: 767.98px) {
    .employee-carousel .employee-slide {
      width: 440px; } }
  @media screen and (max-width: 575.98px) {
    .employee-carousel .employee-slide {
      width: 315px; } }
  .employee-carousel .employee-slide a {
    font-size: 0;
    width: 100%;
    display: block;
    height: 100%;
    position: absolute; }
  .employee-carousel .employee-slide .slide-media img {
    display: block;
    box-shadow: none;
    border-radius: 0;
    margin: 0 auto;
    padding: 20px; }
  .employee-carousel .employee-slide .slide-content {
    position: absolute;
    bottom: 0px;
    left: 0px;
    max-width: 60%;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }
    .employee-carousel .employee-slide .slide-content h2 {
      margin: 0;
      padding: 15px;
      background-color: #fff; }
      @media screen and (max-width: 575.98px) {
        .employee-carousel .employee-slide .slide-content h2 {
          font-size: 1.25rem; } }
    @media screen and (max-width: 991.98px) {
      .employee-carousel .employee-slide .slide-content {
        max-width: 80%; }
        .employee-carousel .employee-slide .slide-content h2 {
          font-size: 1.25rem; } }
    @media screen and (max-width: 767.98px) {
      .employee-carousel .employee-slide .slide-content {
        max-width: 100%;
        position: relative;
        box-shadow: none; } }
@media screen and (max-width: 991.98px) {
  .employee-carousel .slick-dots {
    bottom: -30px; } }
.employee-carousel .slick-arrow {
  top: calc(50% - 20px);
  height: 48px;
  width: 48px;
  z-index: 1;
  position: absolute;
  background-color: #1B43F5;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
  cursor: pointer; }
  .employee-carousel .slick-arrow.fa-angle-left {
    left: calc(50% - 400px); }
  .employee-carousel .slick-arrow.fa-angle-right {
    right: calc(50% - 400px); }
  .employee-carousel .slick-arrow::before {
    font-size: 3rem;
    color: #fff; }
  @media screen and (max-width: 991.98px) {
    .employee-carousel .slick-arrow.fa-angle-left {
      left: calc(50% - 280px); }
    .employee-carousel .slick-arrow.fa-angle-right {
      right: calc(50% - 280px); } }
  @media screen and (max-width: 766px) {
    .employee-carousel .slick-arrow.fa-angle-left {
      display: none; }
    .employee-carousel .slick-arrow.fa-angle-right {
      display: none; } }
.employee-carousel .slick-dots li.slick-active button {
  background-color: rgba(0, 0, 0, 0.8); }
.employee-carousel .slick-dots li button::before {
  content: '';
  border: 5px solid #333; }

.employees-top {
  padding-bottom: 2rem;
  border-bottom: 1px solid #D9E1EB;
  margin-bottom: 2rem; }

.see-more {
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 1.1rem;
  font-weight: 600;
  text-align: right;
  padding: .5rem;
  display: inline-block;
  margin-top: 1rem; }

.employees-flex {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between; }
  .employees-flex > div {
    width: 31%;
    position: relative;
    margin-left: auto;
    margin-right: auto; }
    @media screen and (max-width: 767.98px) {
      .employees-flex > div {
        width: 46%; } }
    @media screen and (max-width: 575.98px) {
      .employees-flex > div {
        width: 95%; } }
    .employees-flex > div h2 {
      text-transform: uppercase;
      background-color: #333;
      color: #fff;
      font-size: 1.125rem;
      padding: .5rem 1.25rem;
      position: absolute;
      top: -10px;
      left: -10px;
      margin: 0;
      font-weight: 500;
      letter-spacing: 1px; }
    .employees-flex > div .department div {
      padding: 1rem 0; }

.employees-second {
  margin: 2rem 0; }

.employees-flex-second {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between; }
  .employees-flex-second span.angle-link {
    display: block;
    align-self: flex-end;
    width: 100%;
    text-align: center;
    border-top: 1px solid #D9E1EB;
    margin-top: 1rem; }
  .employees-flex-second > div {
    width: 23%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin-left: auto;
    margin-right: auto; }
    @media screen and (max-width: 767.98px) {
      .employees-flex-second > div {
        width: 46%; } }
    @media screen and (max-width: 575.98px) {
      .employees-flex-second > div {
        width: 95%; } }
    .employees-flex-second > div img {
      width: 75px;
      box-shadow: none;
      display: block;
      margin: 0 auto; }
    .employees-flex-second > div div {
      margin-bottom: 15px; }
      .employees-flex-second > div div p {
        font-size: 1.05rem;
        line-height: 1.5;
        margin-bottom: 0; }
      .employees-flex-second > div div h3 {
        margin-top: .5rem;
        text-transform: uppercase;
        letter-spacing: 2px;
        font-size: 1.1rem;
        font-weight: 600;
        text-align: center; }

.employees-third {
  margin: 2rem 0; }
  .employees-third h2 {
    margin-bottom: 1.15rem;
    font-size: 2.25rem; }
    @media screen and (max-width: 991.98px) {
      .employees-third h2 {
        text-align: center; } }

.employees-flex-third {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between; }
  .employees-flex-third img {
    width: 55%;
    height: 100%;
    margin-right: auto; }
    @media screen and (max-width: 1200px) {
      .employees-flex-third img {
        width: 45%; } }
    @media screen and (max-width: 991.98px) {
      .employees-flex-third img {
        width: 95%;
        margin: 0 auto 20px auto; } }
  .employees-flex-third div {
    width: 40%;
    display: flex;
    flex-wrap: wrap;
    margin-left: auto;
    margin-right: auto; }
    @media screen and (max-width: 1200px) {
      .employees-flex-third div {
        width: 50%; } }
    @media screen and (max-width: 991.98px) {
      .employees-flex-third div {
        width: 95%; } }
    @media screen and (max-width: 767.98px) {
      .employees-flex-third div p {
        padding-top: 1.2rem; } }

.employees-fourth {
  margin: 2rem 0; }
  .employees-fourth h2 {
    margin-bottom: 1.15rem;
    font-size: 2.25rem; }
    @media screen and (max-width: 991.98px) {
      .employees-fourth h2 {
        text-align: center; } }

.employees-flex-fourth {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between; }
  .employees-flex-fourth span.angle-link {
    width: 100%;
    text-align: center;
    background-color: #1B43F5;
    align-self: flex-end; }
    .employees-flex-fourth span.angle-link a {
      color: #fff; }
  .employees-flex-fourth > div {
    width: 31%;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-wrap: wrap;
    margin-left: auto;
    margin-right: auto; }
    @media screen and (max-width: 767.98px) {
      .employees-flex-fourth > div {
        width: 46%;
        margin: 1rem auto; } }
    @media screen and (max-width: 575.98px) {
      .employees-flex-fourth > div {
        width: 95%; } }
    .employees-flex-fourth > div img {
      border-radius: 0;
      box-shadow: none;
      max-width: 100%; }
    .employees-flex-fourth > div h3 {
      text-transform: uppercase;
      letter-spacing: 2px;
      font-size: 1.1rem;
      font-weight: 600;
      text-align: left;
      margin-top: .6rem; }
    .employees-flex-fourth > div p {
      margin: 1rem 0 0 0;
      font-size: 1.05rem;
      line-height: 1.5; }
    .employees-flex-fourth > div div {
      padding: 1rem; }

/*------------EMPLOYESS END------------------*/
/*------------INVESTORS START------------------*/
.investor-carousel .investor-slide {
  position: relative;
  height: 50vh;
  background-position: center center;
  overflow: hidden; }
  .investor-carousel .investor-slide span.ir-slide-button {
    background-color: #333;
    font-size: 1rem;
    text-transform: uppercase;
    color: #fff;
    letter-spacing: 1px;
    font-weight: 700;
    padding: .75rem 1.75rem;
    border-radius: 30px;
    transition: all 0.3s ease-in-out;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.4); }
    .investor-carousel .investor-slide span.ir-slide-button:hover {
      background-color: #FF585D;
      transition: all 0.3s ease-in-out; }
  @media screen and (max-width: 991.98px) {
    .investor-carousel .investor-slide {
      height: 250px; } }
  .investor-carousel .investor-slide .zoom-slide {
    background-position: center center;
    background-size: cover;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    transition: all ease-in-out 1s; }
    .investor-carousel .investor-slide .zoom-slide._1 {
      background-image: url("https://www.swimmingpool.com/images/investors/pool01.jpg"); }
    .investor-carousel .investor-slide .zoom-slide._2 {
      background-image: url("https://www.swimmingpool.com/images/investors/pool02.jpg"); }
    .investor-carousel .investor-slide .zoom-slide._3 {
      background-image: url("https://www.swimmingpool.com/images/investors/pool03.jpg"); }
    .investor-carousel .investor-slide .zoom-slide._4 {
      background-image: url("https://www.swimmingpool.com/images/investors/pool04.jpg"); }
  .investor-carousel .investor-slide:hover .slide-content span {
    background-color: rgba(0, 0, 0, 0); }
  .investor-carousel .investor-slide:hover:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5); }
  .investor-carousel .investor-slide:hover .zoom-slide {
    transform: scale(1.5);
    transition: all ease-in-out 5s; }
  .investor-carousel .investor-slide:hover a {
    text-decoration: none; }
    .investor-carousel .investor-slide:hover a span {
      opacity: 1; }
  .investor-carousel .investor-slide a {
    font-size: 0;
    width: 100%;
    display: flex;
    align-items: center;
    height: 100%;
    position: absolute; }
    .investor-carousel .investor-slide a span {
      margin: 0 auto;
      opacity: 0; }
  .investor-carousel .investor-slide .slide-content span {
    font-size: 1rem;
    position: absolute;
    bottom: 0;
    width: 100%;
    background-color: rgba(27, 67, 245, 0.8);
    color: #fff;
    padding-top: .5rem;
    padding-bottom: .5rem;
    text-align: center;
    text-transform: uppercase; }
    @media screen and (max-width: 991.98px) {
      .investor-carousel .investor-slide .slide-content span {
        font-size: .85rem;
        padding-top: .3rem;
        padding-bottom: .3rem; } }
.investor-carousel .slick-dots {
  position: relative;
  top: 0;
  background-color: #1B43F5;
  height: 20px; }
  .investor-carousel .slick-dots li {
    top: -10px; }
    .investor-carousel .slick-dots li.slick-active button:before {
      color: #fff; }
    .investor-carousel .slick-dots li button:before {
      color: #fff;
      font-size: 10px; }

.investor-presentations {
  padding-top: 2rem;
  padding-bottom: 4rem;
  border-bottom: 1px solid #D9E1EB; }
  @media screen and (max-width: 767.98px) {
    .investor-presentations {
      padding-top: 0; } }
  .investor-presentations #LatestPresDiv {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 1rem;
    margin-bottom: 1rem; }
    .investor-presentations #LatestPresDiv #b2iShowCasediv80 {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: center; }
      .investor-presentations #LatestPresDiv #b2iShowCasediv80 > .ShowCaseDivItem {
        width: calc(50% - 20px);
        background-color: #eef2f6;
        margin: 10px; }
        @media screen and (max-width: 767.98px) {
          .investor-presentations #LatestPresDiv #b2iShowCasediv80 > .ShowCaseDivItem {
            margin: 5px; } }
        @media screen and (max-width: 575.98px) {
          .investor-presentations #LatestPresDiv #b2iShowCasediv80 > .ShowCaseDivItem {
            width: 100%; } }
        .investor-presentations #LatestPresDiv #b2iShowCasediv80 > .ShowCaseDivItem .ShowCaseDivDate {
          margin-bottom: 0;
          display: block !important;
          padding: 20px 0  0 20px; }
        .investor-presentations #LatestPresDiv #b2iShowCasediv80 > .ShowCaseDivItem .ShowCaseLink {
          padding: 20px 20px 0 20px;
          display: block; }
          .investor-presentations #LatestPresDiv #b2iShowCasediv80 > .ShowCaseDivItem .ShowCaseLink h4 {
            font-size: 1.45rem;
            text-decoration: none;
            color: #000182; }
            @media screen and (max-width: 767.98px) {
              .investor-presentations #LatestPresDiv #b2iShowCasediv80 > .ShowCaseDivItem .ShowCaseLink h4 {
                font-size: 1.25rem; } }
        .investor-presentations #LatestPresDiv #b2iShowCasediv80 > .ShowCaseDivItem a.btn.ShowCaseLinkImage {
          text-transform: uppercase;
          font-size: .95rem;
          font-weight: 600;
          padding: 20px;
          letter-spacing: 1px;
          width: 100%;
          text-align: right;
          outline: none; }
          .investor-presentations #LatestPresDiv #b2iShowCasediv80 > .ShowCaseDivItem a.btn.ShowCaseLinkImage::after {
            font-family: "Font Awesome 6 Pro";
            content: '\f105';
            padding-left: 5px; }
          .investor-presentations #LatestPresDiv #b2iShowCasediv80 > .ShowCaseDivItem a.btn.ShowCaseLinkImage:hover {
            text-decoration: underline; }
      @media screen and (max-width: 575.98px) {
        .investor-presentations #LatestPresDiv #b2iShowCasediv80 {
          width: 100%; }
          .investor-presentations #LatestPresDiv #b2iShowCasediv80:nth-child(2) {
            margin-top: 1.5rem; } }
      .investor-presentations #LatestPresDiv #b2iShowCasediv80 span.angle-link {
        align-self: flex-end;
        margin-left: auto; }

@media screen and (max-width: 767.98px) {
  .POOLQuoteHeader.tick {
    font-size: 1.45rem; } }

.investor-top-news {
  padding-top: 4rem;
  padding-bottom: 3rem; }
  .investor-top-news h2 {
    text-transform: uppercase;
    background-color: #333;
    color: #fff;
    font-size: 1.125rem;
    padding: .5rem 1.25rem;
    margin: 0;
    font-weight: 500;
    display: inline-block;
    letter-spacing: 1px;
    position: relative;
    left: -15px;
    top: -5px; }
    @media screen and (max-width: 575.98px) {
      .investor-top-news h2 {
        left: 0; } }
  .investor-top-news #LibDiv {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: #fff;
    margin-bottom: 1rem; }
    @media screen and (max-width: 767.98px) {
      .investor-top-news #LibDiv {
        flex-direction: column; } }
    .investor-top-news #LibDiv .b2iLibraryItem {
      width: calc(33% - 20px);
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      background: #eef2f6;
      padding: 20px;
      margin: 10px; }
      @media screen and (max-width: 767.98px) {
        .investor-top-news #LibDiv .b2iLibraryItem {
          width: 90vw;
          margin: 5px auto; } }
      .investor-top-news #LibDiv .b2iLibraryItem .b2iLibraryItemDate {
        color: #333;
        font-size: 1.125rem; }
      .investor-top-news #LibDiv .b2iLibraryItem .b2iLibraryItemHeadline a {
        color: #000182;
        font-size: 1.25rem;
        padding: 20px 0;
        display: block; }
      .investor-top-news #LibDiv .b2iLibraryItem .b2iLibraryReadmore {
        display: block;
        text-align: right;
        width: 100%; }
        .investor-top-news #LibDiv .b2iLibraryItem .b2iLibraryReadmore .b2iLibraryReadmoreLink {
          text-align: right;
          text-transform: uppercase;
          font-size: .95rem;
          font-weight: 600;
          padding: 20px;
          letter-spacing: 1px; }
          .investor-top-news #LibDiv .b2iLibraryItem .b2iLibraryReadmore .b2iLibraryReadmoreLink::after {
            font-family: "Font Awesome 6 Pro";
            content: '\f105';
            font-weight: 600;
            font-size: 1.15rem;
            top: 1px;
            padding-left: .4rem; }

.investor-company-overview {
  padding-top: 4rem;
  padding-bottom: 4rem; }
  .investor-company-overview .numbers-flex {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between; }
    .investor-company-overview .numbers-flex > div {
      width: 24%;
      text-align: center; }
      @media screen and (max-width: 991.98px) {
        .investor-company-overview .numbers-flex > div {
          width: 48%; } }
      .investor-company-overview .numbers-flex > div h2 {
        color: #1B43F5;
        font-size: 4.5rem;
        font-weight: 800; }
        @media screen and (max-width: 480px) {
          .investor-company-overview .numbers-flex > div h2 {
            font-size: 3.5rem; } }
        @media screen and (max-width: 370px) {
          .investor-company-overview .numbers-flex > div h2 {
            font-size: 3rem; } }

.investor-stock-info {
  padding-top: 4.3rem;
  padding-bottom: 4.3rem;
  background: #eef2f6; }
  @media screen and (max-width: 575.98px) {
    .investor-stock-info #b2iSnapQuote tbody:first-of-type tr:first-of-type {
      display: flex;
      flex-wrap: wrap; }
      .investor-stock-info #b2iSnapQuote tbody:first-of-type tr:first-of-type td {
        flex-grow: 1; }
    .investor-stock-info #b2iSnapQuote #snapquoteInfo {
      width: 100%; }
      .investor-stock-info #b2iSnapQuote #snapquoteInfo tr {
        display: flex; }
      .investor-stock-info #b2iSnapQuote #snapquoteInfo .POOLCustomQuote_Label, .investor-stock-info #b2iSnapQuote #snapquoteInfo .POOLCustomQuote_Data {
        font-size: 1rem; } }
  @media screen and (max-width: 575.98px) {
    .investor-stock-info {
      padding-left: 1rem;
      padding-right: 1rem; } }
  .investor-stock-info #snapquoteInfo {
    width: 100%; }
  .investor-stock-info .change {
    display: block; }

/*------------INVESTORS END------------------*/
/*---- ANIMATIONS --------*/
@keyframes pulsing {
  0% {
    transform: scale(1, 1); }
  50% {
    opacity: 0.3; }
  100% {
    transform: scale(1.5);
    opacity: 0; } }
@-webkit-keyframes gradient {
  0% {
    background-position: 0% 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0% 50%; } }
@-moz-keyframes gradient {
  0% {
    background-position: 0% 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0% 50%; } }
@keyframes gradient {
  0% {
    background-position: 0% 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0% 50%; } }
/* ---- STYLE BOARD START ---- */
.styles {
  margin: 5px;
  padding: 0;
  text-align: right;
  position: sticky;
  top: 97px; }
  .styles li {
    list-style: none; }
    .styles li a {
      text-align: right;
      transition: 0.3s ease-in-out;
      padding-right: 5px;
      position: relative;
      color: #fff; }
      .styles li a::after {
        content: '>';
        opacity: 0;
        position: absolute;
        right: 0;
        transition: 0.3s ease-in-out;
        color: #fff; }
      .styles li a:hover {
        text-decoration: none;
        transform: translateX(-5px);
        transition: 0.3s ease-in-out;
        padding-right: 15px;
        color: #fff; }
        .styles li a:hover::after {
          opacity: 1;
          transition: 0.3s ease-in-out;
          color: #fff; }

.grid {
  position: relative; }
  .grid.splash .grid-sizer, .grid.splash .grid-item {
    width: calc(100% / 3 - 10px); }
    @media screen and (max-width: 992px) {
      .grid.splash .grid-sizer, .grid.splash .grid-item {
        width: calc(50% - 10px); } }
    @media screen and (max-width: 992px) {
      .grid.splash .grid-sizer, .grid.splash .grid-item {
        width: 100%; } }
    .grid.splash .grid-sizer a span, .grid.splash .grid-item a span {
      background-color: #fff;
      position: absolute;
      bottom: 15px;
      left: 15px;
      padding: .6rem 1rem;
      color: #1B43F5;
      box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); }
  .grid:after {
    content: '';
    display: block;
    clear: both; }
  .grid .gutter-sizer {
    width: 10px; }
  .grid .grid-sizer, .grid .grid-item {
    width: calc(25% - 10px); }
    @media screen and (max-width: 1200px) {
      .grid .grid-sizer, .grid .grid-item {
        width: calc(33% - 5px); } }
    @media screen and (max-width: 992px) {
      .grid .grid-sizer, .grid .grid-item {
        width: calc(33% - 5px); } }
    @media screen and (max-width: 768px) {
      .grid .grid-sizer, .grid .grid-item {
        width: calc(33% - 5px); } }
    @media screen and (max-width: 575.98px) {
      .grid .grid-sizer, .grid .grid-item {
        width: calc(50% - 5px); } }
  .grid .grid-item {
    float: left;
    background: #D9E1EB;
    margin-bottom: 10px;
    background: none; }
    .grid .grid-item a {
      position: absolute;
      z-index: 1;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0; }
    .grid .grid-item img.grid-img {
      width: 100%;
      display: block;
      border-radius: 0;
      margin-bottom: 0;
      margin-top: 0; }
    .grid .grid-item a.grid-img {
      position: relative;
      z-index: 1;
      display: block; }
      @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
        .grid .grid-item a.grid-img {
          opacity: 1 !important; } }
      @supports (-ms-ime-align: auto) {
        .grid .grid-item a.grid-img {
          opacity: 1 !important; } }
      .grid .grid-item a.grid-img img {
        margin: 0; }
    .grid .grid-item .svg-outline {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%; }
      .grid .grid-item .svg-outline rect {
        stroke: #fff;
        stroke-width: 5;
        width: 100%;
        height: 100%;
        fill: none; }
        .grid .grid-item .svg-outline rect._720 {
          stroke-dasharray: 1800;
          stroke-dashoffset: 1800; }
        .grid .grid-item .svg-outline rect._950 {
          stroke-dasharray: 2030;
          stroke-dashoffset: 2030; }
        .grid .grid-item .svg-outline rect._1400 {
          stroke-dasharray: 2480;
          stroke-dashoffset: 2480; }
        .grid .grid-item .svg-outline rect._1800 {
          stroke-dasharray: 2880;
          stroke-dashoffset: 2880; }

.grid--hidden {
  position: fixed !important;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  opacity: 0; }

.grid--loading::before,
.grid--loading::after {
  content: '';
  z-index: 1000; }

.grid--loading::before {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: #002130; }

.grid--loading::after {
  position: absolute;
  top: calc(25vh - 20px);
  left: 50%;
  width: 40px;
  height: 40px;
  margin: 0 0 0 -20px;
  border: 8px solid #383a41;
  border-bottom-color: #565963;
  border-radius: 50%;
  animation: animLoader 0.8s linear forwards infinite; }

.loading::before,
.loading::after {
  content: '';
  position: fixed;
  z-index: 1000; }

.loading::before {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #002130; }

.loading::after {
  top: 50%;
  left: 50%;
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  border: 8px solid #383a41;
  border-bottom-color: #565963;
  border-radius: 50%;
  animation: animLoader 0.8s linear infinite forwards; }

@keyframes animLoader {
  to {
    transform: rotate(360deg); } }
@keyframes button {
  0% {
    border-radius: 5px; }
  50% {
    border-radius: 5px 100px 100px 5px; }
  100% {
    border-radius: 100px; } }
a.style-guide {
  position: absolute;
  z-index: 1000;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  text-align: center; }
  a.style-guide::after {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 900;
    content: '';
    position: absolute;
    transition: 0.3s ease-in-out;
    opacity: 0; }
  a.style-guide:hover {
    text-decoration: none; }
    a.style-guide:hover::after {
      opacity: 1;
      transition: 0.3s ease-in-out; }
    a.style-guide:hover span {
      opacity: 1;
      transition: 0.3s ease-in-out; }
  a.style-guide span {
    color: #fff;
    background-color: #FF585D;
    padding: 10px 20px;
    border-radius: 25px;
    z-index: 1000;
    opacity: 0;
    transition: 0.3s ease-in-out;
    font-size: 0.9rem; }

/* ---- CUSTOMERS START ---- */
.customers-flex {
  display: flex;
  background-color: #F6F9F9;
  margin: 2rem auto; }
  @media screen and (max-width: 767.98px) {
    .customers-flex {
      flex-direction: column-reverse;
      flex-wrap: wrap; } }
  .customers-flex.bottom-section {
    background-color: inherit;
    width: 30%;
    margin: 0 auto 5vh 0;
    align-items: center;
    flex-direction: column; }
    @media screen and (max-width: 991.98px) {
      .customers-flex.bottom-section {
        flex-direction: column;
        flex-wrap: wrap;
        width: 100%;
        margin: 0 auto 2vh 0; }
        .customers-flex.bottom-section:last-child {
          margin-bottom: 5vh; } }
    .customers-flex.bottom-section div {
      padding: 0 1rem; }
      @media screen and (max-width: 991.98px) {
        .customers-flex.bottom-section div {
          padding: 1rem; } }
      .customers-flex.bottom-section div h3 {
        margin-top: 0;
        margin-bottom: 15px; }
      .customers-flex.bottom-section div .angle-link {
        border-top: 1px solid #D9E1EB;
        margin-top: 1rem; }
    .customers-flex.bottom-section img {
      width: 75px;
      box-shadow: none;
      margin: 15px; }
      @media screen and (max-width: 991.98px) {
        .customers-flex.bottom-section img {
          display: none; } }
  .customers-flex .customer-content {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    padding: 2rem 3.5rem; }
    @media screen and (max-width: 767.98px) {
      .customers-flex .customer-content {
        text-align: center; } }
    .customers-flex .customer-content h2 {
      margin-top: 0; }
  .customers-flex img {
    width: 50%;
    border-radius: 0; }
    @media screen and (max-width: 767.98px) {
      .customers-flex img {
        width: 100%; } }

.bi-flex {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap; }
  @media screen and (max-width: 767.98px) {
    .bi-flex {
      flex-direction: column; } }
  .bi-flex .flex-child {
    width: 50%; }
    .bi-flex .flex-child img {
      max-width: 100px;
      display: block;
      margin: 0 auto; }
    @media screen and (max-width: 767.98px) {
      .bi-flex .flex-child {
        width: 100%; }
        .bi-flex .flex-child img {
          width: 100%; } }
    .bi-flex .flex-child.financing {
      display: flex;
      align-items: center;
      justify-content: center; }
      @media screen and (max-width: 992px) {
        .bi-flex .flex-child.financing {
          flex-direction: column;
          justify-content: flex-start;
          align-items: flex-start; } }
      @media screen and (max-width: 767.98px) {
        .bi-flex .flex-child.financing {
          width: 100%; } }

.financing-image {
  width: 100px;
  text-align: center;
  margin-top: 10px;
  margin-bottom: 10px; }
  @media screen and (max-width: 992px) {
    .financing-image {
      width: 100%; } }
  .financing-image img {
    padding: 10px;
    max-width: 110px;
    margin: 0 auto;
    box-shadow: none; }
    @media screen and (max-width: 767.98px) {
      .financing-image img {
        margin: 30px; } }

.financing-content {
  width: 70%; }
  @media screen and (max-width: 992px) {
    .financing-content {
      width: 100%; } }

.disclaimer p {
  font-size: 0.75rem; }

img.suntrust-bank-icon {
  display: inline-block;
  width: 25px;
  height: 25px;
  padding: 0;
  position: relative;
  bottom: 2px;
  box-shadow: none;
  margin: 0; }

.products-blocks {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  justify-content: space-between; }
  .products-blocks .products-block {
    width: 30%;
    height: 322px;
    text-align: center;
    margin-bottom: 5%;
    background-color: #000182;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }
    .products-blocks .products-block.filler {
      height: 0;
      background-color: #fff; }
    @media screen and (max-width: 1199px) {
      .products-blocks .products-block {
        height: 279px;
        margin-bottom: 4.5%; } }
    @media screen and (max-width: 992px) {
      .products-blocks .products-block {
        width: 46%;
        height: 317px;
        margin-bottom: 6.5%; } }
    @media screen and (max-width: 767.98px) {
      .products-blocks .products-block {
        height: 234px; } }
    @media screen and (max-width: 575.98px) {
      .products-blocks .products-block {
        width: 100%; } }
    .products-blocks .products-block.size-100 {
      width: 100%; }
      .products-blocks .products-block.size-100 img {
        width: 100% !important;
        height: auto !important; }
    .products-blocks .products-block a {
      width: 100%;
      height: 100%;
      display: block;
      position: absolute;
      z-index: 100; }
    .products-blocks .products-block div {
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center; }
      .products-blocks .products-block div img {
        min-height: 100%;
        min-width: 100%;
        object-fit: cover;
        margin: 0;
        position: relative; }
      .products-blocks .products-block div:before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.4)); }
    .products-blocks .products-block span {
      padding: .75rem 1rem;
      background-color: #fff;
      position: absolute;
      z-index: 2;
      left: 15px;
      bottom: 15px;
      color: #333;
      box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
      font-weight: 600;
      font-size: 1.1rem;
      line-height: 1.1rem;
      max-width: 90%; }

.recommended-brands-carousel {
  background-image: linear-gradient(to top, #F6F9F9, #D9E1EB);
  padding: 20px 0 30px 0; }
  .recommended-brands-carousel .slide {
    margin: 0 10px 10px 10px;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background-color: #fff; }
    .recommended-brands-carousel .slide .slide-header {
      width: 100%;
      padding: 15px;
      background-image: linear-gradient(to bottom, #1B43F5, #000182);
      position: relative;
      height: 100px;
      border-radius: 10px 10px 0 0; }
      .recommended-brands-carousel .slide .slide-header .slide-img {
        overflow: hidden;
        text-align: center;
        width: 100%;
        margin: 0 auto;
        bottom: -75px; }
        .recommended-brands-carousel .slide .slide-header .slide-img img {
          width: 100%;
          margin: 0 auto;
          display: block;
          max-width: 175px;
          border: 7px solid #1B43F5;
          box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
          border-radius: 100px; }
    .recommended-brands-carousel .slide .slide-content {
      padding: 0 20px 20px 20px;
      margin-top: 100px; }
      .recommended-brands-carousel .slide .slide-content .angle-link {
        border-top: 1px solid #D9E1EB;
        width: 100%;
        text-align: center; }
  .recommended-brands-carousel .slick-arrow::before {
    color: #1B43F5; }
  @media screen and (max-width: 575.98px) {
    .recommended-brands-carousel .slick-arrow.slick-prev {
      left: -12px; }
    .recommended-brands-carousel .slick-arrow.slick-next {
      right: -12px; } }
  .recommended-brands-carousel .slick-dots {
    bottom: -10px; }

button.link {
  background: none;
  border: none; }

.vip {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #eee; }
  .vip img {
    width: 25%; }
  .vip > div {
    width: 75%;
    padding: 30px; }

#resources-hub {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  margin: 0 auto; }
  #resources-hub .resources-block {
    position: relative;
    height: 50vh;
    width: 100%;
    margin: 20px auto 15vh auto; }
    #resources-hub .resources-block img {
      width: 100%; }
    #resources-hub .resources-block .resource-content {
      position: absolute;
      bottom: -25%;
      left: 0;
      background-color: #fff;
      box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
      padding: 20px; }

.search-results {
  margin-top: 15vh; }

#search-results {
  padding-left: 0; }

.search-result {
  list-style: none;
  padding: 5px; }
  .search-result h3 {
    margin-top: 2vh; }

.build-a-pool {
  width: 100%; }
  .build-a-pool .pool-steps {
    width: 100vw;
    padding: 0 30px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60vh;
    min-height: 200px;
    background-image: linear-gradient(to top, #333, rgba(0, 0, 0, 0.5)), url("/images/build-a-pool/choose-a-pool-type.jpg");
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center; }
    @media screen and (max-width: 991.98px) {
      .build-a-pool .pool-steps {
        height: 30vh; } }
    .build-a-pool .pool-steps .pool-steps-content h1 {
      color: #fff;
      font-size: 4rem;
      max-width: 800px;
      text-align: center;
      text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3); }
      @media screen and (max-width: 991.98px) {
        .build-a-pool .pool-steps .pool-steps-content h1 {
          font-size: 3rem; } }
      @media screen and (max-width: 767.98px) {
        .build-a-pool .pool-steps .pool-steps-content h1 {
          font-size: 2.5rem; } }
  .build-a-pool.flex {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: -5vh; }
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      .build-a-pool.flex {
        justify-content: space-around; } }
    .build-a-pool.flex .block {
      width: 80vw;
      display: flex;
      align-items: center;
      justify-content: center;
      background-attachment: fixed;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      padding: 7vh 0;
      flex-direction: row-reverse; }
      @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
        .build-a-pool.flex .block {
          justify-content: space-around; } }
      @media screen and (max-width: 1200px) {
        .build-a-pool.flex .block {
          width: 90vw; } }
      @media screen and (max-width: 991.98px) {
        .build-a-pool.flex .block {
          width: 100vw;
          padding: 4vh 0; } }
      @media screen and (max-width: 767.98px) {
        .build-a-pool.flex .block {
          padding: 2vh 0; } }
      .build-a-pool.flex .block .block-content {
        width: 45%;
        max-width: 800px;
        padding: 30px;
        margin-right: auto; }
        .build-a-pool.flex .block .block-content h2 {
          margin-top: 0; }
        .build-a-pool.flex .block .block-content h5 {
          color: #1B43F5;
          font-size: 1.15rem; }
        @media screen and (max-width: 1200px) {
          .build-a-pool.flex .block .block-content {
            width: 50%; } }
        @media screen and (max-width: 991.98px) {
          .build-a-pool.flex .block .block-content {
            width: 100%;
            max-width: 600px;
            padding: 30px 15px;
            margin: 0 auto; } }
        @media screen and (max-width: 767.98px) {
          .build-a-pool.flex .block .block-content {
            max-width: 540px; } }
      .build-a-pool.flex .block .block-image {
        width: 40%;
        margin-left: auto; }
        .build-a-pool.flex .block .block-image img {
          box-shadow: none;
          width: 100%;
          padding: 20px; }
        @media screen and (max-width: 1200px) {
          .build-a-pool.flex .block .block-image {
            width: 50%; } }
        @media screen and (max-width: 991.98px) {
          .build-a-pool.flex .block .block-image {
            display: none; } }
      .build-a-pool.flex .block:nth-child(odd) {
        width: 100vw;
        flex-direction: row;
        background-color: #F6F9F9;
        box-shadow: inset 0 5px 10px rgba(0, 0, 0, 0.1); }
        .build-a-pool.flex .block:nth-child(odd) .block-content {
          width: 35%;
          margin-left: auto;
          margin-right: 0; }
          @media screen and (max-width: 1200px) {
            .build-a-pool.flex .block:nth-child(odd) .block-content {
              width: 50%; } }
          @media screen and (max-width: 991.98px) {
            .build-a-pool.flex .block:nth-child(odd) .block-content {
              width: 100%;
              max-width: 600px;
              margin: 0 auto;
              padding: 30px 15px; } }
          @media screen and (max-width: 767.98px) {
            .build-a-pool.flex .block:nth-child(odd) .block-content {
              max-width: 540px; } }
        .build-a-pool.flex .block:nth-child(odd) .block-image {
          width: 35%;
          margin-right: auto;
          margin-left: 0; }
          @media screen and (max-width: 991.98px) {
            .build-a-pool.flex .block:nth-child(odd) .block-image {
              width: 50%;
              margin: 0 auto; } }

.next-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  text-align: center;
  background-image: linear-gradient(to bottom, transparent, #F6F9F9); }
  .next-section::before {
    width: 25px;
    height: 25px;
    position: absolute;
    bottom: -50px;
    content: '';
    background-color: #1B43F5;
    left: 48%;
    transition: 0.3s ease-in-out;
    transform: rotate(45deg); }
  .next-section::after {
    content: '';
    position: absolute;
    width: 100%;
    border-bottom: 5px solid #1B43F5;
    bottom: 0;
    left: 100%;
    transition: 0.3s ease-in-out; }
  .next-section a {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 100;
    font-size: 0; }
  .next-section .next-content {
    padding: 20px 0; }
    .next-section .next-content i {
      color: #000182;
      font-size: 2rem;
      color: #333; }
    .next-section .next-content h3 {
      margin-bottom: 0;
      padding: 0 20px;
      margin-top: 10px;
      color: #333; }
    .next-section .next-content h5 {
      color: #333;
      font-size: 1.15rem;
      margin-bottom: 0;
      margin-top: 20px;
      transition: 0.3s ease-in-out; }
    .next-section .next-content p {
      color: #333;
      transition: 0.3s ease-in-out;
      margin-bottom: 5px; }
  .next-section:hover::before {
    bottom: -10px;
    transition: 0.3s ease-in-out; }
  .next-section:hover::after {
    left: 0;
    transition: 0.3s ease-in-out; }
  .next-section:hover h5, .next-section:hover p {
    color: #1B43F5;
    transition: 0.3s ease-in-out; }

table th {
  border-top: none !important;
  border-bottom: none !important; }
table td h3 {
  margin-top: 0; }

.nav-pills {
  padding-inline-start: 0 !important; }
  .nav-pills .nav-item .nav-link {
    color: #000182;
    font-weight: 700; }
    .nav-pills .nav-item .nav-link.active {
      background-color: #000182;
      color: #fff; }

.tab-content {
  background-color: #F6F9F9;
  padding: 1rem 1rem 1.25rem 2rem;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
  margin-bottom: 2rem; }
  .tab-content .tab-pane > div {
    margin-bottom: 1.25rem; }
    .tab-content .tab-pane > div:last-child {
      margin-bottom: 0; }
  .tab-content .tab-pane .description h5 {
    margin-bottom: .75rem; }
  .tab-content .tab-pane .description p {
    margin-bottom: .5rem; }
    .tab-content .tab-pane .description p:last-child {
      margin-bottom: 0; }
  .tab-content .tab-pane .pros-cons {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap; }
    .tab-content .tab-pane .pros-cons h5 {
      margin-bottom: 1rem; }
    .tab-content .tab-pane .pros-cons > div {
      width: 50%; }
      .tab-content .tab-pane .pros-cons > div ul {
        padding-left: 0;
        margin-bottom: 0 !important; }
        .tab-content .tab-pane .pros-cons > div ul li {
          list-style: none;
          padding-bottom: .75rem;
          padding-right: 1rem; }
          .tab-content .tab-pane .pros-cons > div ul li:before {
            font-family: "Font Awesome 6 Pro";
            font-weight: 600;
            font-size: 1.15rem;
            position: relative;
            top: 1px;
            padding-right: .75rem; }
          .tab-content .tab-pane .pros-cons > div ul li:last-child {
            padding-bottom: 0; }
        .tab-content .tab-pane .pros-cons > div ul.pros li {
          color: #28a745; }
          .tab-content .tab-pane .pros-cons > div ul.pros li:before {
            content: '\f00c'; }
        .tab-content .tab-pane .pros-cons > div ul.cons li {
          color: #dc3545; }
          .tab-content .tab-pane .pros-cons > div ul.cons li:before {
            content: '\f00d'; }
      @media screen and (max-width: 767.98px) {
        .tab-content .tab-pane .pros-cons > div {
          width: 100%; } }
  .tab-content .tab-pane .cost-price h5 i {
    top: 1px;
    position: relative;
    font-size: 1.25rem; }
  .tab-content .tab-pane .buying-tips h5 {
    margin-bottom: .75em; }
  .tab-content .tab-pane .buying-tips p {
    font-style: italic;
    margin-bottom: .5rem; }
    .tab-content .tab-pane .buying-tips p:last-child {
      margin-bottom: 0; }

.pros-cons {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap; }
  .pros-cons h5 {
    margin-bottom: 1rem; }
  .pros-cons > div {
    width: 50%; }
    .pros-cons > div ul {
      padding-left: 0;
      margin-bottom: 0 !important; }
      .pros-cons > div ul li {
        list-style: none;
        padding-bottom: .75rem;
        padding-right: 1rem; }
        .pros-cons > div ul li:before {
          font-family: "Font Awesome 6 Pro";
          font-weight: 600;
          font-size: 1.15rem;
          position: relative;
          top: 1px;
          padding-right: .75rem; }
        .pros-cons > div ul li:last-child {
          padding-bottom: 0; }
      .pros-cons > div ul.pros li {
        color: #28a745; }
        .pros-cons > div ul.pros li:before {
          content: '\f00c'; }
      .pros-cons > div ul.cons li {
        color: #dc3545; }
        .pros-cons > div ul.cons li:before {
          content: '\f00d'; }
    @media screen and (max-width: 767.98px) {
      .pros-cons > div {
        width: 100%; } }

.question {
  background-color: #F6F9F9;
  padding: 10px;
  border-left: 2px solid #1B43F5; }

.answer {
  padding: 10px;
  border-left: 2px solid transparent; }

.carousel-inner img {
  margin: 0 !important; }

.cta-dealer-locator {
  width: 100%;
  margin: 25px 0; }
  .cta-dealer-locator.full-length {
    margin: 0; }
    .cta-dealer-locator.full-length .cta-block {
      padding: 50px 0;
      border-radius: 0;
      background-attachment: fixed; }
  .cta-dealer-locator .cta-block {
    display: flex;
    align-items: center;
    justify-content: space-around;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
    width: 100%;
    border-radius: 20px 0 20px 0;
    padding: 20px; }
    .cta-dealer-locator .cta-block img {
      box-shadow: none; }
    .cta-dealer-locator .cta-block h2 {
      color: #fff;
      margin-top: 0; }
    .cta-dealer-locator .cta-block .button {
      color: #fff;
      font-size: 1rem;
      padding: 10px 20px;
      border-radius: 25px;
      border: 1px solid #fff;
      transition: 0.3s ease-in-out;
      text-align: center; }
      .cta-dealer-locator .cta-block .button:hover {
        background-color: #FF585D;
        border: 1px solid #FF585D; }
    .cta-dealer-locator .cta-block.builder {
      background-image: linear-gradient(45deg, rgba(27, 67, 245, 0.9), rgba(0, 1, 130, 0.9)), url("/images/cta/backgrounds/a_4047_ss_irishmist_palmsprings_ca_052015.jpg"); }
    .cta-dealer-locator .cta-block.service {
      background-image: linear-gradient(45deg, rgba(27, 67, 245, 0.9), rgba(0, 1, 130, 0.9)), url("/images/cta/backgrounds/service.jpg"); }
    .cta-dealer-locator .cta-block.store {
      background-image: linear-gradient(45deg, rgba(27, 67, 245, 0.9), rgba(0, 1, 130, 0.9)), url("/images/cta/backgrounds/chemicals.jpg"); }
    .cta-dealer-locator .cta-block.chemical {
      background-image: linear-gradient(45deg, rgba(27, 67, 245, 0.9), rgba(0, 1, 130, 0.9)), url("/images/cta/backgrounds/chemicals.jpg"); }
    .cta-dealer-locator .cta-block .cta-content {
      max-width: 80%;
      text-align: center; }
      .cta-dealer-locator .cta-block .cta-content .button {
        width: 100%;
        text-transform: uppercase;
        letter-spacing: 2px;
        font-size: 0.9rem;
        text-align: center;
        margin-top: 5px; }

/*----- DEALER SECTION START --- */
.dealer-carousel i.fas {
  z-index: 1;
  top: calc(50% - 10px);
  width: 47px;
  height: 45px;
  position: absolute;
  color: #fff;
  background-color: #1B43F5;
  border-radius: 25px;
  display: flex;
  align-items: center;
  justify-content: center; }
  .dealer-carousel i.fas.fa-angle-left {
    left: 5%; }
  .dealer-carousel i.fas.fa-angle-right {
    right: 5%; }
  .dealer-carousel i.fas:before {
    font-size: 2.7rem;
    padding: 10px; }
.dealer-carousel .dealer-slide {
  position: relative;
  background-position: center center;
  overflow: hidden; }
  .dealer-carousel .dealer-slide .slide {
    margin: 1rem;
    position: relative; }
    @media screen and (max-width: 575.98px) {
      .dealer-carousel .dealer-slide .slide {
        margin: .5rem; } }
    .dealer-carousel .dealer-slide .slide img {
      margin: 0; }
    .dealer-carousel .dealer-slide .slide .slide-content {
      padding: 1rem 2rem;
      background-color: #D9E1EB;
      width: 100%;
      color: #333; }
      @media screen and (max-width: 575.98px) {
        .dealer-carousel .dealer-slide .slide .slide-content {
          padding: .4rem .7rem; } }
  .dealer-carousel .dealer-slide a {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2; }
.dealer-carousel .slick-dots {
  position: relative;
  top: 0;
  height: 20px; }
  .dealer-carousel .slick-dots li {
    top: -10px; }
    .dealer-carousel .slick-dots li.slick-active button:before {
      color: #333; }
    .dealer-carousel .slick-dots li button:before {
      color: #333;
      font-size: 10px; }

.dealer-feed-item {
  display: flex;
  flex-direction: row;
  position: relative;
  padding-bottom: .75rem;
  border-bottom: 1px solid #D9E1EB; }
  .dealer-feed-item:nth-last-child(2) {
    border-bottom: none; }
  .dealer-feed-item a {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 0;
    z-index: 1; }
  .dealer-feed-item div {
    padding-left: 20px; }
    .dealer-feed-item div h2 {
      font-weight: 900;
      font-size: 1.3rem; }
    .dealer-feed-item div .teaser {
      font-size: 0.95rem;
      margin-bottom: 0; }
    .dealer-feed-item div.feed-image {
      width: 30%;
      margin-right: 0;
      padding: 0; }
    .dealer-feed-item div:last-child {
      width: 70%; }
    @media screen and (max-width: 575.98px) {
      .dealer-feed-item div {
        width: 70%;
        padding: 0 0 0 10px; }
        .dealer-feed-item div h2 {
          font-size: .975rem; }
        .dealer-feed-item div p.teaser {
          font-size: .75rem; } }

@media screen and (max-width: 991px) {
  .dealer-side-items {
    margin-top: 3rem; } }

.dealer-side-item {
  background-color: #D9E1EB;
  padding: 20px;
  text-align: center;
  margin-bottom: 10px; }
  .dealer-side-item h2 {
    margin: 0;
    margin-bottom: 2rem; }

a.flipdoc-thumb {
  display: block; }
  a.flipdoc-thumb img {
    width: 200px; }

.article-cards .card {
  height: 100%;
  border-top: 0;
  border-right: 0;
  border-left: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.125); }
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .article-cards .card {
      display: block; } }
  .article-cards .card:hover {
    background-color: #F6F9F9;
    border-bottom: 1px solid #FFAC04; }
  .article-cards .card a {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0; }
  .article-cards .card img {
    margin: 0; }
  .article-cards .card .card-body {
    display: flex;
    flex-wrap: wrap;
    align-items: center; }
    .article-cards .card .card-body h2 {
      font-size: 1.3rem;
      margin-top: 0;
      font-weight: 900; }
    .article-cards .card .card-body h5 {
      margin-bottom: 0; }
    .article-cards .card .card-body p {
      font-size: 0.95rem; }
    @media screen and (max-width: 575.98px) {
      .article-cards .card .card-body h2 {
        font-size: .975rem; }
      .article-cards .card .card-body p {
        font-size: .75rem; } }

.dealer-quick-links {
  padding: 0; }
  .dealer-quick-links .finish-resources .nav-item {
    width: auto;
    border: 0; }
    .dealer-quick-links .finish-resources .nav-item .nav-link.active {
      color: #fff; }
  .dealer-quick-links .nav-item {
    border-bottom: 1px solid #D9E1EB;
    width: 100%; }
    .dealer-quick-links .nav-item:last-child {
      border-bottom: none; }
    .dealer-quick-links .nav-item .nav-link {
      color: #AFB4BE; }
      .dealer-quick-links .nav-item .nav-link.active {
        color: #1B43F5;
        opacity: 1; }

.dealer-video-carousel .video-slide {
  margin: 10px; }
  .dealer-video-carousel .video-slide .featured-video.embed-responsive {
    margin: 0; }
  .dealer-video-carousel .video-slide .featured-product-label {
    margin: 0 20px; }

.social-media-link img {
  display: inline; }
.social-media-link:hover {
  text-decoration: none; }

img.social-media-icon {
  transition: 0.3s ease-in-out;
  width: 55px;
  height: 55px;
  padding: 5px;
  box-shadow: none; }
  img.social-media-icon:hover {
    transition: 0.3s ease-in-out;
    transform: translateY(-5px);
    -webkit-transform: translateY(-5px);
    -moz-transform: translateY(-5px);
    -o-transform: translateY(-5px);
    -ms-transform: translateY(-5px);
    text-decoration: none; }

img.social-media-logo {
  transition: 0.3s ease-in-out;
  width: auto;
  height: 55px;
  padding: 5px;
  display: inline-block;
  box-shadow: none; }
  img.social-media-logo:hover {
    transition: 0.3s ease-in-out;
    transform: translateY(-5px);
    -webkit-transform: translateY(-5px);
    -moz-transform: translateY(-5px);
    -o-transform: translateY(-5px);
    -ms-transform: translateY(-5px);
    text-decoration: none; }

img.horizontal-icon {
  width: 130px;
  box-shadow: none; }

.marker.company {
  font-weight: bold;
  color: #000182;
  display: block;
  font-size: 1rem; }
.marker.address {
  padding: 5px 0;
  display: block; }
.marker.get-directions {
  color: #fff;
  background-color: #1B43F5;
  padding: 7px;
  border-radius: 3px;
  display: inline-block;
  transition: 0.3s ease-in-out; }
  .marker.get-directions:hover {
    text-decoration: none;
    background-color: #FF585D;
    transition: 0.3s ease-in-out; }
  .marker.get-directions i {
    padding-right: 5px; }

.quick-links {
  position: relative; }
  .quick-links h2 {
    text-align: center;
    display: inline-block;
    padding: 20px;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 auto;
    background-color: #fff;
    z-index: 0;
    font-weight: 900; }
  .quick-links::after {
    content: '';
    border-top: 5px solid #FFAC04;
    border-right: 5px solid #FFAC04;
    border-left: 5px solid #FFAC04;
    position: absolute;
    width: 100%;
    left: 0;
    top: 35px;
    height: 40px;
    z-index: -10; }
  .quick-links.gray::after {
    border-top: 5px solid #D9E1EB;
    border-right: 5px solid #D9E1EB;
    border-left: 5px solid #D9E1EB; }

ul.dealer-quick-links.primary .nav-item a.nav-link.active {
  color: #fff; }
  ul.dealer-quick-links.primary .nav-item a.nav-link.active.builder-support {
    background-color: #FFAC04; }
  ul.dealer-quick-links.primary .nav-item a.nav-link.active.retail-support {
    background-color: #1B43F5; }
  ul.dealer-quick-links.primary .nav-item a.nav-link.active.service-support {
    background-color: #54DEFD; }
  ul.dealer-quick-links.primary .nav-item a.nav-link.active.marketing-tools {
    background-color: #FF585D; }
  ul.dealer-quick-links.primary .nav-item a.nav-link.active.resources {
    background-color: #000182; }

.dealer-quick-links {
  background-color: transparent;
  box-shadow: none; }
  .dealer-quick-links .article-cards > div {
    padding-left: 10px;
    padding-right: 10px; }
  .dealer-quick-links .article-cards .card {
    border: 1px solid #eee;
    text-align: center;
    transition: 0.3s ease-in-out; }
    .dealer-quick-links .article-cards .card h5 {
      margin-bottom: 0; }
      @media screen and (max-width: 575.98px) {
        .dealer-quick-links .article-cards .card h5 {
          font-size: .875rem;
          letter-spacing: .75px; } }
    .dealer-quick-links .article-cards .card:hover {
      transform: translateY(-5px);
      transition: 0.3s ease-in-out;
      box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }
    .dealer-quick-links .article-cards .card .card-body {
      display: flex;
      align-items: center;
      justify-content: center; }
      @media screen and (max-width: 575.98px) {
        .dealer-quick-links .article-cards .card .card-body {
          padding: .5rem; } }

.pdf-flex {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%; }
  .pdf-flex .pdf-brick, .pdf-flex .web-brick {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0 10px 0 10px;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
    width: calc(50% - 10px);
    margin: 10px 0 10px 0;
    background-color: #fff;
    top: 0;
    transition: all 0.3s ease-in-out;
    margin: 5px; }
    @media screen and (max-width: 991.98px) {
      .pdf-flex .pdf-brick, .pdf-flex .web-brick {
        width: calc(50% - 10px); } }
    @media screen and (max-width: 575.98px) {
      .pdf-flex .pdf-brick, .pdf-flex .web-brick {
        padding: 10px 2vw 10px 3vw;
        width: calc(50% - 5px);
        height: 90px; } }
    .pdf-flex .pdf-brick:hover, .pdf-flex .web-brick:hover {
      top: -5px;
      box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.08);
      transition: all 0.3s ease-in-out; }
      .pdf-flex .pdf-brick:hover::after, .pdf-flex .web-brick:hover::after {
        opacity: 1;
        transition: all 0.3s ease-in-out; }
    .pdf-flex .pdf-brick a, .pdf-flex .web-brick a {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 100; }
    .pdf-flex .pdf-brick img, .pdf-flex .web-brick img {
      width: 30px;
      margin-right: 10px;
      margin-top: 1rem;
      margin-bottom: 1rem;
      box-shadow: none; }
      @media screen and (max-width: 575.98px) {
        .pdf-flex .pdf-brick img, .pdf-flex .web-brick img {
          width: 20px;
          margin-top: .5rem;
          margin-bottom: .5rem; } }
    .pdf-flex .pdf-brick p, .pdf-flex .web-brick p {
      margin-bottom: 0;
      font-size: 1rem;
      line-height: 1.5rem; }
      @media screen and (max-width: 575.98px) {
        .pdf-flex .pdf-brick p, .pdf-flex .web-brick p {
          font-size: .9rem;
          line-height: 1.2rem; } }
    .pdf-flex .pdf-brick::after, .pdf-flex .web-brick::after {
      background-color: #1B43F5;
      position: absolute;
      content: 'Download';
      background-image: url("/images/download-icon.svg");
      background-position: 25% 45%;
      background-size: 20px;
      background-repeat: no-repeat;
      width: 100%;
      height: 100%;
      top: 0;
      bottom: 0;
      right: 0;
      left: 0;
      opacity: 0;
      transition: all 0.3s ease-in-out;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      padding-left: 10px;
      z-index: 90; }
      @media screen and (max-width: 575.98px) {
        .pdf-flex .pdf-brick::after, .pdf-flex .web-brick::after {
          background-image: none;
          padding-left: 0; } }

.web-brick::after {
  background-image: url("/images/next-icon.svg") !important;
  background-position: 21px 17px !important; }

@media screen and (max-width: 767px) {
  ul.control-grids {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap; } }

li.control-item {
  display: flex;
  align-items: center;
  position: relative;
  justify-content: flex-end;
  margin: 3px 0; }
  @media screen and (max-width: 767px) {
    li.control-item {
      width: 50%;
      margin: 10px 0;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap; } }
  li.control-item .control-button {
    background-color: transparent;
    color: transparent;
    border: none;
    padding: 5px 15px;
    position: absolute;
    top: -5px;
    right: -13px; }
    li.control-item .control-button:focus {
      outline: none; }
    li.control-item .control-button.active {
      background-color: #FF585D;
      color: transparent;
      border-radius: 25px; }
    @media screen and (max-width: 767px) {
      li.control-item .control-button {
        width: 100%; } }
  li.control-item .control-label {
    color: #fff;
    text-align: center;
    z-index: 100; }
    li.control-item .control-label:hover {
      color: #FF585D;
      cursor: pointer; }
    li.control-item .control-label.active:hover {
      color: #fff; }
    @media screen and (max-width: 767px) {
      li.control-item .control-label {
        width: 100%; } }

.sticky {
  position: sticky;
  top: 100px; }

p.under-image {
  font-size: 1rem;
  opacity: 0.8;
  text-align: center;
  margin-top: -10px; }
  p.under-image.hero {
    margin-top: -3rem; }

h2.uppercase {
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 900; }

.responsibility-block {
  background-color: #000182;
  padding: 5vh 0;
  margin-bottom: -5vh;
  margin-top: 3rem; }
  .responsibility-block h2, .responsibility-block p {
    color: #fff; }

.login-flex {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-around;
  height: calc(100vh - 86px);
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }
  @media screen and (max-width: 1200px) {
    .login-flex {
      flex-wrap: wrap;
      height: auto;
      flex-direction: column-reverse; } }
  .login-flex .auth-tab {
    width: 35%;
    padding: 0 5vw;
    text-align: center;
    background-color: #fff;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center; }
    .login-flex .auth-tab h2 {
      margin-top: 0; }
    .login-flex .auth-tab form {
      margin-top: 2rem; }
    @media screen and (min-width: 1800px) {
      .login-flex .auth-tab {
        width: 25%; } }
    @media screen and (max-width: 1799px) {
      .login-flex .auth-tab {
        width: 30%; } }
    @media screen and (max-width: 1400px) {
      .login-flex .auth-tab {
        width: 40%; } }
    @media screen and (max-width: 1200px) {
      .login-flex .auth-tab {
        width: 100%;
        padding: 40px; } }
  .login-flex .sign-in-links {
    font-size: 1rem;
    text-align: center; }
    .login-flex .sign-in-links span {
      color: #888; }
  .login-flex .login-content {
    width: 65%;
    height: 100%;
    padding: 30px;
    background-image: linear-gradient(to bottom, #1c2833, rgba(27, 67, 245, 0.8)), url("/images/dealer-portal/login/1177980696.jpg");
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; }
    @media screen and (min-width: 1800px) {
      .login-flex .login-content {
        width: 75%; } }
    @media screen and (max-width: 1799px) {
      .login-flex .login-content {
        width: 70%; } }
    @media screen and (max-width: 1400px) {
      .login-flex .login-content {
        width: 60%; } }
    @media screen and (max-width: 1200px) {
      .login-flex .login-content {
        width: 100%; } }
    .login-flex .login-content h1, .login-flex .login-content h2, .login-flex .login-content h3, .login-flex .login-content h5, .login-flex .login-content p, .login-flex .login-content a, .login-flex .login-content li {
      color: #fff; }
    .login-flex .login-content > div {
      max-width: 800px; }
      .login-flex .login-content > div h1 {
        color: #fff;
        text-transform: uppercase;
        letter-spacing: 2px;
        font-weight: 200;
        font-size: 2.5rem;
        margin-bottom: 3rem; }
        @media screen and (max-width: 1200px) {
          .login-flex .login-content > div h1 {
            margin-bottom: 2rem; } }
        @media screen and (max-width: 992px) {
          .login-flex .login-content > div h1 {
            font-size: 2.2rem; } }
        @media screen and (max-width: 767px) {
          .login-flex .login-content > div h1 {
            font-size: 1.5rem; } }
      .login-flex .login-content > div h3 {
        font-weight: 400;
        margin-bottom: 1rem; }
        @media screen and (max-width: 1200px) {
          .login-flex .login-content > div h3 {
            margin-top: 0; } }
        @media screen and (max-width: 767px) {
          .login-flex .login-content > div h3 {
            display: none; } }
      .login-flex .login-content > div h5 {
        position: relative; }
        .login-flex .login-content > div h5::before, .login-flex .login-content > div h5::after {
          content: "";
          position: absolute;
          border-bottom: 2px solid #fff;
          top: 9px;
          width: 20%;
          max-width: 100px; }
          @media screen and (max-width: 1400px) {
            .login-flex .login-content > div h5::before, .login-flex .login-content > div h5::after {
              display: none; } }
        .login-flex .login-content > div h5::before {
          left: 0; }
        .login-flex .login-content > div h5::after {
          right: 0; }
        @media screen and (max-width: 1200px) {
          .login-flex .login-content > div h5 {
            display: none; } }
      .login-flex .login-content > div ul {
        display: flex;
        flex-direction: column;
        height: 180px;
        flex-wrap: wrap;
        list-style: none;
        padding-left: 0;
        counter-reset: counter; }
        @media screen and (max-width: 1400px) {
          .login-flex .login-content > div ul {
            height: 200px; } }
        .login-flex .login-content > div ul li {
          width: 50%;
          counter-increment: counter;
          margin-bottom: 10px;
          display: flex;
          align-items: center; }
          .login-flex .login-content > div ul li:before {
            font-family: "Font Awesome 6 Pro";
            font-weight: 300;
            font-size: 2.5rem;
            margin-right: 0.5rem;
            line-height: 1;
            width: 50px;
            text-align: center; }
          .login-flex .login-content > div ul li:nth-child(1):before {
            content: "\f03d"; }
          .login-flex .login-content > div ul li:nth-child(2):before {
            content: "\f1ea"; }
          .login-flex .login-content > div ul li:nth-child(3):before {
            content: "\f333"; }
          .login-flex .login-content > div ul li:nth-child(4):before {
            content: "\f07a"; }
          .login-flex .login-content > div ul li:nth-child(5):before {
            content: "\f652"; }
          .login-flex .login-content > div ul li:nth-child(6):before {
            content: "\f82c"; }
        @media screen and (max-width: 1200px) {
          .login-flex .login-content > div ul {
            display: none; } }
    .login-flex .login-content a.troubleshooting {
      margin-top: 3rem; }
      @media screen and (max-width: 1200px) {
        .login-flex .login-content a.troubleshooting {
          margin-top: 0; } }
    .login-flex .login-content .customer-block {
      display: flex;
      align-items: flex-start;
      justify-content: space-around; }
      .login-flex .login-content .customer-block > div {
        width: 50%;
        padding: 10px; }

.social-links {
  font-size: 2rem;
  display: flex;
  align-items: center;
  justify-content: center; }
  .social-links i {
    margin: 5px 7px; }

.card {
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }
  .card .card-header {
    background-color: #1B43F5;
    padding: 20px; }
    .card .card-header h5 {
      color: #fff;
      margin-bottom: 0; }

.flipdoc-flex {
  display: flex;
  align-items: flex-start;
  justify-content: space-around;
  flex-wrap: wrap; }
  .flipdoc-flex > div {
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 1rem;
    flex-basis: 33%; }
    @media screen and (max-width: 575.98px) {
      .flipdoc-flex > div {
        flex-basis: 50%; } }
    .flipdoc-flex > div a {
      transition: 0.3s ease-in-out;
      margin: 0 5px; }
      .flipdoc-flex > div a img {
        margin-bottom: .75rem; }
      .flipdoc-flex > div a:hover {
        transform: translateY(-5px);
        transition: 0.3s ease-in-out; }
    .flipdoc-flex > div span {
      text-align: center; }

.magazine-flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center; }
  .magazine-flex > div:nth-child(2) {
    flex-basis: calc(80% - 10px); }
    @media screen and (max-width: 1199.98px) {
      .magazine-flex > div:nth-child(2) {
        flex-basis: calc(75% - 10px); } }
    @media screen and (max-width: 767.98px) {
      .magazine-flex > div:nth-child(2) {
        flex-basis: calc(65% - 10px); } }
    @media screen and (max-width: 575.98px) {
      .magazine-flex > div:nth-child(2) {
        flex-basis: 100%; } }
    .magazine-flex > div:nth-child(2) h3 {
      margin-top: .5em; }
  .magazine-flex > div:nth-child(1) {
    flex-basis: calc(20% - 10px); }
    @media screen and (max-width: 1199.98px) {
      .magazine-flex > div:nth-child(1) {
        flex-basis: calc(25% - 10px); } }
    @media screen and (max-width: 767.98px) {
      .magazine-flex > div:nth-child(1) {
        flex-basis: calc(35% - 10px); } }
    @media screen and (max-width: 575.98px) {
      .magazine-flex > div:nth-child(1) {
        flex-basis: 65%;
        margin-left: auto;
        margin-right: auto;
        max-width: 190px; } }
    .magazine-flex > div:nth-child(1) a {
      transition: 0.3s ease-in-out;
      margin: 0 5px;
      display: block; }
      .magazine-flex > div:nth-child(1) a img {
        margin-bottom: .75rem; }
      .magazine-flex > div:nth-child(1) a:hover {
        transform: translateY(-5px);
        transition: 0.3s ease-in-out; }
    .magazine-flex > div:nth-child(1) span {
      text-align: center; }

.social-icons {
  display: flex;
  justify-content: space-around;
  flex-direction: row;
  width: 100%; }
  .social-icons a {
    color: #333;
    border-radius: 100px;
    background-color: transparent;
    transition: 0.3s ease-in-out;
    padding: 10px 10px 5px 10px;
    position: relative; }
    .social-icons a:hover {
      color: #fff;
      transition: 0.3s ease-in-out;
      box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2);
      background-color: #1B43F5; }
    .social-icons a i {
      font-size: 1.65rem;
      line-height: 1.65rem; }
  .social-icons.manufacturer {
    justify-content: flex-start; }
    .social-icons.manufacturer a {
      color: #1B43F5; }
      .social-icons.manufacturer a:hover {
        color: #FF585D;
        background-color: transparent;
        box-shadow: none; }

.link-flex {
  display: flex;
  align-items: center;
  justify-content: space-around; }

.dealer-carousel-tips .slick-next {
  right: -55px; }
.dealer-carousel-tips .slick-prev {
  left: -55px; }
.dealer-carousel-tips .news-slide {
  display: flex !important;
  margin-top: 1rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
  align-items: center;
  background-color: #eef2f6;
  padding: 30px; }
  .dealer-carousel-tips .news-slide > div {
    flex-basis: 50%; }
    @media screen and (max-width: 767.98px) {
      .dealer-carousel-tips .news-slide > div {
        flex-basis: 100%;
        padding-bottom: 1rem; } }
    .dealer-carousel-tips .news-slide > div:nth-child(1) {
      display: flex;
      flex-wrap: wrap;
      padding-right: 30px; }
      @media screen and (max-width: 575.98px) {
        .dealer-carousel-tips .news-slide > div:nth-child(1) {
          padding-left: 1rem;
          padding-right: 1rem;
          padding-bottom: 0; } }
      .dealer-carousel-tips .news-slide > div:nth-child(1) h3 {
        margin-top: 0; }
    .dealer-carousel-tips .news-slide > div img {
      margin: 0;
      box-shadow: none; }
      @media screen and (max-width: 767.98px) {
        .dealer-carousel-tips .news-slide > div img {
          padding-left: 1rem;
          padding-right: 1rem; } }
.dealer-carousel-tips .slick-arrow {
  width: 47px;
  height: 43px; }
  .dealer-carousel-tips .slick-arrow:before {
    color: #1B43F5;
    font-size: 3rem; }
.dealer-carousel-tips .slick-dots {
  position: relative;
  top: 0;
  height: 20px; }
  .dealer-carousel-tips .slick-dots li {
    top: -10px; }
    .dealer-carousel-tips .slick-dots li.slick-active button:before {
      color: #333; }
    .dealer-carousel-tips .slick-dots li button:before {
      color: #333;
      font-size: 10px; }

.dl-extra-info {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  margin-top: 20px; }
  @media screen and (max-width: 767px) {
    .dl-extra-info {
      flex-direction: column; } }
  .dl-extra-info .dl-extra-card {
    width: calc(50% - 10px);
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
    background-color: #fff; }
    .dl-extra-info .dl-extra-card:first-child {
      margin-right: 20px; }
    .dl-extra-info .dl-extra-card .dl-extra-image img {
      margin-bottom: 0;
      margin-top: 0; }
    .dl-extra-info .dl-extra-card .dl-extra-content {
      padding: 20px; }
      .dl-extra-info .dl-extra-card .dl-extra-content h2 {
        margin-top: 10px;
        font-size: 1.65rem; }
    @media screen and (max-width: 767px) {
      .dl-extra-info .dl-extra-card {
        width: 100%;
        margin-bottom: 20px; }
        .dl-extra-info .dl-extra-card:first-child {
          margin-right: 0; }
        .dl-extra-info .dl-extra-card:last-child {
          margin-bottom: 0; } }

.image-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center; }
  .image-grid .grid-item {
    width: calc(33% - 10px);
    margin: 5px;
    text-align: center; }
    @media screen and (max-width: 991px) {
      .image-grid .grid-item {
        width: calc(50% - 10px); } }

@media screen and (max-width: 991px) {
  .col-form-label {
    padding-bottom: 20px;
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold; } }

.order-flex {
  display: flex;
  padding-top: 5px;
  padding-bottom: 5px; }
  .order-flex:nth-child(odd) {
    background-color: #eef2f6; }
  .order-flex .literature {
    display: flex;
    flex-wrap: wrap;
    flex-grow: 1;
    padding-right: 7px;
    padding-left: 7px; }
    .order-flex .literature .prod-name {
      flex-basis: 50%;
      padding-top: 10px;
      padding-bottom: 10px; }
      @media screen and (max-width: 767px) {
        .order-flex .literature .prod-name {
          flex-basis: 100%;
          padding-top: 5px;
          padding-bottom: 5px;
          font-weight: bold;
          font-size: 1.2rem; } }
    .order-flex .literature .prod-num {
      flex-basis: 25%;
      padding-top: 10px;
      padding-bottom: 10px; }
      @media screen and (max-width: 767px) {
        .order-flex .literature .prod-num {
          flex-basis: 50%; } }
    .order-flex .literature .prod-price, .order-flex .literature .quantity {
      flex-basis: 10%;
      padding-top: 10px;
      padding-bottom: 10px;
      text-align: center; }
      .order-flex .literature .prod-price label, .order-flex .literature .quantity label {
        margin-bottom: 0; }
      @media screen and (max-width: 767px) {
        .order-flex .literature .prod-price, .order-flex .literature .quantity {
          flex-basis: 25%;
          padding-top: 5px;
          padding-bottom: 5px; } }
  .order-flex .order-amt {
    flex-basis: 100px;
    display: flex;
    align-items: center; }

.sponsored-content {
  display: flex;
  position: relative;
  align-items: flex-start;
  justify-content: space-around;
  border-bottom: 1px solid #D9E1EB;
  padding-bottom: 10px;
  padding-top: 15px; }
  .sponsored-content a {
    position: absolute;
    font-size: 0;
    width: 100%;
    height: 100%;
    z-index: 100; }
  .sponsored-content:first-child {
    padding-top: 0; }
  .sponsored-content:last-child {
    border-bottom: 1px solid transparent; }
  .sponsored-content .sponsored-content-block {
    width: 65%;
    padding-right: 30px; }
    .sponsored-content .sponsored-content-block h4 {
      color: #000182;
      transition: 0.3s ease-in-out; }
    @media screen and (max-width: 991px) {
      .sponsored-content .sponsored-content-block {
        width: 100%; } }
  .sponsored-content .sponsored-image {
    width: 35%; }
    .sponsored-content .sponsored-image img {
      width: 100%; }
    @media screen and (max-width: 991px) {
      .sponsored-content .sponsored-image {
        display: none; } }

.background-gray {
  background-color: #D9E1EB;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 20vh;
  width: 100%; }
  .background-gray h3 {
    margin-top: 0;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #333; }

.sign-carousel .sign-slide {
  padding: 10px; }

.log-out {
  background-color: #F6F9F9;
  margin-bottom: 20px; }
  .log-out a {
    margin: 0 auto;
    text-align: right;
    padding: 5px;
    display: block; }

.publication {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-around;
  max-width: 1280px;
  margin: 0 auto;
  padding: 20px; }
  .publication .pub-content {
    width: 50%; }
    @media screen and (max-width: 1500px) {
      .publication .pub-content .button {
        margin: 0 auto;
        display: inline-block; } }
  .publication .pub-image {
    width: 50%;
    margin-left: 2.5rem; }
    @media screen and (max-width: 1500px) {
      .publication .pub-image {
        width: 70%;
        margin-left: 0; } }
    @media screen and (max-width: 991px) {
      .publication .pub-image {
        width: 100%; } }
  .publication:nth-child(odd) {
    background-color: #F6F9F9;
    flex-direction: row-reverse; }
    .publication:nth-child(odd) .pub-image {
      margin-right: 2.5rem; }
      @media screen and (max-width: 1500px) {
        .publication:nth-child(odd) .pub-image {
          margin-right: 0; } }
    @media screen and (max-width: 1500px) {
      .publication:nth-child(odd) {
        flex-direction: column-reverse; } }
  @media screen and (max-width: 1500px) {
    .publication {
      margin: 0 auto;
      flex-direction: column-reverse;
      max-width: 1140px;
      padding: 20px 15px; }
      .publication .pub-content {
        width: 75%; } }
  @media screen and (max-width: 1200px) {
    .publication {
      max-width: 960px; } }
  @media screen and (max-width: 991px) {
    .publication {
      max-width: 720px; }
      .publication .pub-content {
        width: 83.33%; } }
  @media screen and (max-width: 768px) {
    .publication {
      max-width: 540px; }
      .publication .pub-content {
        width: 100%; } }
  @media screen and (max-width: 576px) {
    .publication .pub-content {
      width: 100%; } }

.catalog-form {
  background-image: url("/images/resources/publications/typeform-bg.jpg");
  padding-top: 7vh;
  padding-bottom: 7vh;
  background-repeat: none;
  background-position: center;
  background-size: cover;
  background-attachment: fixed; }
  .catalog-form .row > div {
    background-color: #fff;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
    padding: 0; }

.no-btn-border .mm-listitem__btn:not(.mm-listitem__text) {
  border-left-width: 0; }

.state-grid {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap; }
  .state-grid .state {
    width: calc(50% - 10px);
    margin: 5px;
    background-color: #eef2f6; }
    .state-grid .state.cities {
      width: 100%; }
      .state-grid .state.cities h4 {
        text-align: left; }
      .state-grid .state.cities .city {
        background-color: #000182;
        padding: 15px; }
        .state-grid .state.cities .city h5 {
          border-bottom: 1px solid #fff;
          color: #fff; }
        .state-grid .state.cities .city a {
          padding: 15px;
          color: #fff; }
    .state-grid .state h4 {
      font-weight: 500;
      text-align: center;
      padding: 15px;
      margin-bottom: 0; }
    .state-grid .state .state-links {
      height: 51px;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      background-color: #1c3dce; }
      .state-grid .state .state-links a {
        display: block;
        width: 100%;
        background-color: #1c3dce;
        padding: 10px;
        color: #fff;
        text-align: center; }
        .state-grid .state .state-links a:only-child {
          height: 100%;
          padding-top: 15px; }
      .state-grid .state .state-links .stay-at-home {
        background-color: #FF585D; }
    @media screen and (max-width: 991px) {
      .state-grid .state {
        width: calc(50% - 10px); } }

.table-image {
  width: 250px !important; }
  @media screen and (max-width: 575.98px) {
    .table-image {
      float: none !important;
      margin-left: auto;
      margin-right: auto;
      display: block; } }

div#tarteaucitronAlertBig {
  box-shadow: 0px -5px 10px rgba(0, 0, 0, 0.1);
  padding: 15px !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center; }
  div#tarteaucitronAlertBig span#tarteaucitronDisclaimerAlert {
    font-family: 'Lato', sans-serif !important;
    font-size: 1rem !important; }
    @media screen and (max-width: 996px) {
      div#tarteaucitronAlertBig span#tarteaucitronDisclaimerAlert {
        width: 100%;
        display: block;
        text-align: center !important;
        margin-bottom: .5rem;
        line-height: 1.5 !important; } }
  div#tarteaucitronAlertBig button#tarteaucitronPersonalize, div#tarteaucitronAlertBig button#tarteaucitronCloseAlert, div#tarteaucitronAlertBig button#tarteaucitronPrivacyUrl {
    font-size: 1rem !important;
    padding: 7px 20px !important;
    border-radius: 25px !important;
    font-family: 'Lato', sans-serif !important;
    margin: .25rem 0 .25rem .5rem !important;
    line-height: 1.5 !important; }
    @media screen and (max-width: 996px) {
      div#tarteaucitronAlertBig button#tarteaucitronPersonalize, div#tarteaucitronAlertBig button#tarteaucitronCloseAlert, div#tarteaucitronAlertBig button#tarteaucitronPrivacyUrl {
        margin: .25rem !important; } }
  @media screen and (max-width: 462px) {
    div#tarteaucitronAlertBig button#tarteaucitronPersonalize {
      flex-grow: 1;
      width: 70%; } }
  @media screen and (max-width: 462px) {
    div#tarteaucitronAlertBig button#tarteaucitronCloseAlert, div#tarteaucitronAlertBig button#tarteaucitronPrivacyUrl {
      flex-grow: 1;
      font-size: .875rem !important; } }

.privacy-cookies-btn {
  background: transparent;
  border: none;
  color: #1B43F5 !important;
  padding: 0; }
  .privacy-cookies-btn:hover {
    cursor: pointer;
    text-decoration: underline; }
  .privacy-cookies-btn:focus {
    outline: none !important; }

.social-content-buttons {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  margin: 20px 0; }
  .social-content-buttons .social-content-button a {
    color: #fff;
    font-size: .875rem;
    padding: 6px 15px;
    border-radius: 25px;
    margin: 10px 5px;
    transition: 0.3s ease-in-out;
    display: inline-block;
    position: relative; }
    @media screen and (max-width: 575.98px) {
      .social-content-buttons .social-content-button a {
        font-size: 1rem;
        height: 34px;
        padding: 7px 17px; } }
    .social-content-buttons .social-content-button a span {
      padding-left: 10px; }
      @media screen and (max-width: 575.98px) {
        .social-content-buttons .social-content-button a span {
          display: none; } }
    @media screen and (max-width: 575.98px) {
      .social-content-buttons .social-content-button a i {
        position: absolute;
        left: 9px;
        top: 9px; } }
    .social-content-buttons .social-content-button a:hover {
      text-decoration: none;
      transform: translateY(-5px);
      transition: 0.3s ease-in-out; }
    .social-content-buttons .social-content-button a.facebook {
      background-color: #3b5998; }
    .social-content-buttons .social-content-button a.twitter {
      background-color: #1DA1F2; }
    .social-content-buttons .social-content-button a.pinterest {
      background-color: #BD081C; }
    .social-content-buttons .social-content-button a.email {
      background-color: #000182; }

.joedal-arrow {
  cursor: pointer; }

.caption {
  font-style: italic;
  color: #666;
  text-align: center;
  margin-top: -10px;
  font-size: 1rem; }
  .caption.top {
    margin-top: -2.5rem; }

.save-15 {
  display: flex; }
  .save-15 div {
    margin: 0 auto;
    padding: 1rem;
    text-align: center;
    margin-bottom: 1rem; }
    .save-15 div h2 {
      font-size: 2rem;
      margin: 0; }
    .save-15 div p {
      margin: 0;
      font-size: 1.2rem; }

.tab-content.pool-finish-content {
  padding: 1rem;
  background-color: #fff;
  box-shadow: none; }
  @media screen and (max-width: 575.98px) {
    .tab-content.pool-finish-content {
      padding: 1rem 0; } }
  @media screen and (max-width: 575.98px) {
    .tab-content.pool-finish-content .pdf-brick {
      width: calc(50% - 10px); } }
  @media screen and (max-width: 575.98px) {
    .tab-content.pool-finish-content .pdf-brick p {
      font-size: .8rem; } }

#newsletter {
  display: none;
  z-index: 900;
  background-color: #fff;
  width: 60vw;
  height: 500px;
  left: calc(50% - 450px);
  top: calc(50% - 250px);
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
  max-width: 900px;
  min-height: 400px;
  position: fixed; }
  #newsletter.active {
    display: flex;
    animation-name: fadeDown;
    animation-duration: 0.5s; }
    @media screen and (max-width: 1200px) {
      #newsletter.active {
        width: 80vw;
        left: calc(50% - 40vw); } }
    @media screen and (max-width: 991px) {
      #newsletter.active {
        width: 90vw;
        left: calc(50% - 45vw); } }
    @media screen and (max-width: 767px) {
      #newsletter.active {
        flex-wrap: wrap;
        height: initial;
        text-align: center; }
        #newsletter.active .bg-image, #newsletter.active .newsletter-content {
          width: 100%; } }
  @media screen and (max-width: 576px) {
    #newsletter {
      top: calc(50% - 180px); } }
  #newsletter .close {
    position: absolute;
    top: 10px;
    right: 15px; }
    @media screen and (max-width: 767px) {
      #newsletter .close {
        color: #fff;
        opacity: 1;
        text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); } }
    @media screen and (max-width: 576px) {
      #newsletter .close {
        color: #333; } }
  #newsletter .bg-image {
    width: 43%;
    background-image: url("/images/newsletter/h_0114_ss_laquinta_ca_011420.jpg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    height: 100%; }
    @media screen and (max-width: 767px) {
      #newsletter .bg-image {
        width: 100%;
        height: 150px; } }
    @media screen and (max-width: 576px) {
      #newsletter .bg-image {
        display: none; } }
  #newsletter .newsletter-content {
    width: 57%;
    padding: 5vh 5vw;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%; }
    @media screen and (max-width: 767px) {
      #newsletter .newsletter-content {
        width: 100%;
        height: initial;
        padding-top: 0; } }
    #newsletter .newsletter-content form {
      margin-top: 15px; }
    #newsletter .newsletter-content h4 {
      padding-top: 0; }
    #newsletter .newsletter-content button {
      border: none;
      background-color: transparent; }
      #newsletter .newsletter-content button.no-thanks {
        color: #777;
        font-size: 1rem;
        text-transform: uppercase;
        letter-spacing: 1px;
        text-decoration: underline; }

.tint {
  display: none; }
  .tint.active {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 800; }

@keyframes fadeDown {
  0% {
    opacity: 0;
    transform: translateY(-20px); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
.quizes .card-body h2.card-title {
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: 900;
  margin-top: 0;
  font-size: 1.5rem; }

.sources p {
  font-size: small;
  margin-bottom: 5px; }

.references li {
  font-size: .875rem; }

.clamp-image {
  position: relative; }
  .clamp-image .clamp-texture {
    position: absolute;
    left: 0;
    bottom: 0;
    width: clamp(110px, 25%, 250px); }
  .clamp-image .clamp-texture-right {
    position: absolute;
    right: 0;
    bottom: 0;
    width: clamp(110px, 25%, 250px);
    border-top: 5px solid white;
    border-left: 5px solid white; }

.styleboard-social-icons {
  position: absolute;
  bottom: 50px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center; }
  .styleboard-social-icons a.pinterest {
    position: absolute;
    bottom: 5px;
    right: 5px;
    font-size: 2rem;
    color: #fff;
    margin: 5px; }

.color-image-flex {
  display: flex;
  justify-content: space-between; }
  .color-image-flex img {
    width: calc(25% - 5px); }

.styleboard-collage {
  position: relative;
  background-image: url("/images/media-gallery/style-board-collage.jpg");
  background-size: cover;
  text-align: center;
  padding: 20% 0; }
  .styleboard-collage:before {
    position: absolute;
    content: "";
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.2)); }
  .styleboard-collage a {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    padding: .75rem 1.75rem;
    position: relative;
    z-index: 1; }

.movie-cards .card {
  position: relative;
  background-size: cover;
  background-position: center;
  color: #fff; }
  .movie-cards .card:before {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(32, 32, 32, 0.75); }
  .movie-cards .card > * {
    position: relative;
    z-index: 1; }
  .movie-cards .card.action-adventure {
    background-image: url("/images/blog/2018-05-30/action-adventure.jpg"); }
  .movie-cards .card.drama {
    background-image: url("/images/blog/2018-05-30/drama-movie.jpg"); }
  .movie-cards .card.comedy {
    background-image: url("/images/blog/2018-05-30/comedy-movie.jpg"); }
  .movie-cards .card.thriller-horror {
    background-image: url("/images/blog/2018-05-30/horror-movie.jpg"); }
  .movie-cards .card.animated-movie {
    background-image: url("/images/blog/2018-05-30/animated-movie.jpg"); }
  .movie-cards .card.classic-movie {
    background-image: url("/images/blog/2018-05-30/classic-movie.jpg"); }
  .movie-cards .card.family-movie {
    background-image: url("/images/blog/2018-05-30/family-movie.jpg"); }
.movie-cards h5 {
  color: #fff; }

.recipes .card-title {
  font-size: 1.25rem;
  font-weight: 900;
  color: #333;
  margin-top: 0; }
.recipes .card-text {
  font-size: 0.875rem; }
.recipes a:hover {
  color: #000; }

ul.ingredients {
  list-style: none;
  padding-left: 0;
  margin-top: 1rem; }
  ul.ingredients li {
    padding-bottom: .5rem; }

ol.directions li {
  padding-bottom: .5rem; }

.styled-checkbox {
  position: absolute;
  opacity: 0; }
  .styled-checkbox + label {
    position: relative;
    cursor: pointer;
    padding: 0;
    padding-left: 2rem; }
  .styled-checkbox + label:before {
    content: '';
    margin-right: 15px;
    display: inline-block;
    vertical-align: text-top;
    width: 20px;
    height: 20px;
    background: #f0f3f5;
    top: 3px;
    position: absolute;
    left: 0; }
  .styled-checkbox:hover + label:before {
    background: #dee3e7; }
  .styled-checkbox:focus + label:before {
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12); }
  .styled-checkbox:checked + label:before {
    background: #1B43F5; }
  .styled-checkbox:disabled + label {
    color: #b8b8b8;
    cursor: auto; }
  .styled-checkbox:disabled + label:before {
    box-shadow: none;
    background: #ddd; }
  .styled-checkbox:checked + label:after {
    content: '\f00c';
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    position: absolute;
    color: #fff;
    left: 2px; }

#ad-anchor {
  visibility: hidden; }

.app-badges img {
  max-width: 200px; }

.sb-hero {
  height: 600px;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  margin-top: 58px; }
  @media screen and (max-width: 991px) {
    .sb-hero {
      margin-top: 0; } }
  .sb-hero.sub-hero {
    height: 400px; }
  .sb-hero .sb-logo {
    width: 100%;
    position: absolute;
    left: 10px;
    z-index: 90;
    top: 0;
    margin-top: 20px; }
    .sb-hero .sb-logo img {
      width: 200px;
      display: block; }
  .sb-hero .hero-text {
    z-index: 100; }
    .sb-hero .hero-text h1 {
      font-weight: 300 !important; }
    .sb-hero .hero-text h2 {
      font-size: 2rem;
      color: black;
      letter-spacing: 1px; }
  .sb-hero .tint {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0) 80%);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100px;
    z-index: 10; }
  .sb-hero video {
    left: 0;
    overflow: hidden;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 0;
    width: 100%; }

.sb-card {
  text-align: center;
  padding: 2rem; }
  .sb-card a {
    color: black; }
    .sb-card a:hover {
      text-decoration: none; }
      .sb-card a:hover .img {
        transform: translateY(-5px);
        transition: 0.3s ease-in-out; }
  .sb-card .img {
    width: 220px;
    height: 220px;
    border-radius: 50%;
    outline: 10px solid rgba(255, 255, 255, 0.3);
    outline-offset: -10px;
    margin: 0 auto 20px auto;
    transition: 0.3s ease-in-out; }
    .sb-card .img img {
      width: 100%;
      border-radius: 50%;
      height: 100%;
      margin-top: 0; }

video.video {
  width: 100%; }
  @media screen and (max-width: 1080px) {
    video.video {
      height: 100%;
      width: auto; } }

.sb-breadcrumbs {
  padding: 20px 0; }
  .sb-breadcrumbs ul {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center; }
    .sb-breadcrumbs ul li {
      list-style: none;
      margin-right: 20px; }
      .sb-breadcrumbs ul li::after {
        content: '';
        border-right: 1px solid #ddd;
        padding-left: 20px; }
      .sb-breadcrumbs ul li:last-child {
        margin-right: 0; }
        .sb-breadcrumbs ul li:last-child::after {
          border-right: none; }
      .sb-breadcrumbs ul li a {
        color: black;
        font-weight: 400; }

.bye-hero {
  background: url("/images/backyardescape/bye-hero.jpg");
  background-size: cover;
  background-position: center;
  display: flex;
  margin-bottom: 0;
  position: relative;
  align-items: center;
  margin-top: 0; }
  @media screen and (min-width: 992px) {
    .bye-hero {
      margin-top: 59.78px; } }
  .bye-hero:before {
    content: '';
    background: linear-gradient(135deg, #143980 0%, #bfd857 100%);
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    opacity: 0.2; }
  .bye-hero h1 {
    font-weight: 800;
    line-height: 1;
    margin-top: 7rem;
    margin-bottom: 7.5rem;
    background: linear-gradient(135deg, #8aa527 0%, #bfd857 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; }
    @media screen and (max-width: 991px) {
      .bye-hero h1 {
        font-size: 5rem; } }
    @media screen and (max-width: 767px) {
      .bye-hero h1 {
        font-size: 3.875rem; } }
    @media screen and (max-width: 575px) {
      .bye-hero h1 {
        font-size: 2.75rem; } }

.sb-flipdoc, .flipdoc {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  background-color: #eee;
  padding: 20px;
  flex-wrap: wrap;
  border-radius: 10px;
  transition: 0.3s ease-in-out;
  flex-direction: column; }
  .sb-flipdoc:hover, .flipdoc:hover {
    text-decoration: none;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
    transition: 0.3s ease-in-out; }
  .sb-flipdoc h5, .flipdoc h5 {
    color: black;
    display: block; }
  .sb-flipdoc img, .flipdoc img {
    display: block;
    width: auto;
    margin: 20px; }

.flex-area {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center; }
  .flex-area.designer-surfaces .flex-block {
    width: 250px;
    margin: 30px; }
  .flex-area.accessories .flex-block {
    width: 200px; }
  .flex-area .flex-block {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 285px;
    background-position: center;
    background-size: cover;
    border-radius: 5px;
    margin: 10px; }
    .flex-area .flex-block h4, .flex-area .flex-block h5 {
      text-align: center; }
    .flex-area .flex-block h5 {
      padding-top: .5rem; }
    .flex-area .flex-block img {
      width: 100%; }
    .flex-area .flex-block a {
      font-family: 'Oswald', sans-serif;
      opacity: 1;
      background-color: rgba(0, 0, 0, 0.4);
      color: #fff;
      transition: .3s ease-in-out;
      display: block;
      width: 100%;
      text-align: center;
      padding: 100px 0;
      font-size: 1.5rem;
      border-radius: 5px;
      text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); }
      .flex-area .flex-block a:hover {
        opacity: 1;
        transition: .3s ease-in-out;
        text-decoration: none;
        background-color: rgba(138, 165, 39, 0.2); }
    .flex-area .flex-block.pool-shapes {
      background-image: url("/images/backyardescape/pool-shapes.jpg"); }
    .flex-area .flex-block.accessories {
      background-image: url("/images/backyardescape/accessories.jpg"); }

.carousel-caption h3 {
  color: #fff;
  text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); }

.home-card {
  background-color: #fff;
  height: 500px;
  padding: 2rem;
  margin: 1rem;
  box-shadow: 8px 8px 15px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-align: center; }
  .home-card h2 {
    margin-top: 0;
    margin-bottom: 1rem; }
  @media screen and (max-width: 575px) {
    .home-card {
      margin: 0; } }
  .home-card img {
    width: 100%; }

h2.accent-2 {
  color: #0081b3;
  font-size: 3rem; }
  @media screen and (max-width: 575px) {
    h2.accent-2 {
      font-size: 2.25rem; } }

.modal-body img {
  margin: 0; }

.home-carousel img.carousel-thumbnail {
  padding: 1rem;
  padding-bottom: 0;
  margin: 0;
  box-shadow: none; }
  .home-carousel img.carousel-thumbnail:hover {
    cursor: pointer; }
  @media screen and (max-width: 575px) {
    .home-carousel img.carousel-thumbnail {
      padding: .5rem; } }
.home-carousel img {
  width: 100%; }
.home-carousel .slick-prev:before, .home-carousel .slick-next:before {
  color: #0081b3; }

.home-card-carousel .slick-prev:before,
.home-card-carousel .slick-next:before {
  font-size: 40px; }
.home-card-carousel .slick-prev {
  left: -45px; }

.optimum-icon {
  width: 125px !important; }

.optimum-button {
  background-image: linear-gradient(45deg, #00B7E2, #6FCDDC);
  color: #fff !important;
  font-weight: 700;
  border-radius: 25px;
  padding: .75rem 2.25rem;
  text-decoration: none;
  display: inline-block;
  border: 0; }
  .optimum-button:hover {
    color: #1B43F5 !important;
    text-decoration: none; }

.optimum-faq ol > li {
  padding: 10px 0;
  font-weight: bold; }
.optimum-faq ul li {
  padding: 10px 0; }

.optimum-downloads {
  text-align: center; }
  .optimum-downloads span:last-child a {
    border-bottom: 0; }
  .optimum-downloads span a {
    margin: 0 auto;
    display: block;
    font-size: 1.25rem;
    color: #666;
    text-decoration: none;
    padding: 50px;
    border-bottom: 1px solid #eee; }
    .optimum-downloads span a:hover {
      color: #0081b3; }

.thumbnail-container {
  width: calc((100% / 3) - 15px); }
  @media screen and (max-width: 991.98px) {
    .thumbnail-container {
      width: calc((100% / 3) - 10px); } }
  @media screen and (max-width: 767.98px) {
    .thumbnail-container {
      width: calc(50% - 10px); } }
  .thumbnail-container img {
    width: 100%; }
  .thumbnail-container h4 {
    font-size: 1rem;
    font-weight: 500;
    color: #707070;
    text-align: center; }
    @media screen and (max-width: 575.98px) {
      .thumbnail-container h4 {
        font-size: 0.8em;
        line-height: 1.35em; } }
  .thumbnail-container .thumbnail {
    position: relative;
    margin-top: 1rem;
    margin-bottom: .5rem; }
    .thumbnail-container .thumbnail .play-icon {
      position: absolute;
      top: 0;
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center; }
      .thumbnail-container .thumbnail .play-icon i {
        color: #fff;
        font-size: 3rem;
        opacity: .7;
        transition: .3s ease-in-out; }
        @media screen and (max-width: 575.98px) {
          .thumbnail-container .thumbnail .play-icon i {
            font-size: 2rem; } }
        .thumbnail-container .thumbnail .play-icon i:hover {
          opacity: 1;
          transition: 0.3s ease-in-out;
          cursor: pointer; }

.dream-carousel .slick-slide {
  padding: 0 1rem; }
  @media screen and (max-width: 991.98px) {
    .dream-carousel .slick-slide {
      padding: 0 .75rem; } }
  @media screen and (max-width: 767.98px) {
    .dream-carousel .slick-slide {
      padding: 0 .5rem; } }
  @media screen and (max-width: 575.98px) {
    .dream-carousel .slick-slide {
      padding: 0 .25rem; } }
.dream-carousel .slick-prev:before, .dream-carousel .slick-next:before {
  color: #0081b3; }

.text-optimum-blue {
  color: #0081b3; }

.text-optimum-light-blue {
  color: #52b7de; }

.flex-optimum-numbers {
  display: flex;
  justify-content: center;
  flex-wrap: wrap; }
  .flex-optimum-numbers span {
    font-size: 5rem;
    font-weight: 800;
    line-height: 1;
    color: #0081b3; }
  .flex-optimum-numbers p {
    font-size: .875rem; }
  .flex-optimum-numbers > div {
    width: calc(100% / 3);
    border-right: 2px solid #0081b3;
    padding: 1rem; }
    .flex-optimum-numbers > div:last-child {
      border-right: 0; }
    @media screen and (max-width: 575px) {
      .flex-optimum-numbers > div {
        width: 50%;
        border-right: 0; }
        .flex-optimum-numbers > div:first-child {
          border-right: 2px solid #0081b3; } }

.dealer-cpq-thumbs-up {
  font-size: 100px;
  color: #2190bc; }

.card.compare {
  padding: 2rem;
  background-image: linear-gradient(to bottom, #D9F2F6, #fff); }
  .card.compare h3 {
    font-weight: 600;
    font-size: 1.5rem;
    margin-top: 0; }
  .card.compare h5 {
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 2px;
    font-family: all-round-gothic, sans-serif; }
  .card.compare i.fa-dollar-sign {
    font-size: 1.75rem; }
  .card.compare ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0 !important; }
    .card.compare ul li {
      font-size: 1.125rem;
      position: relative;
      left: -9px; }
      .card.compare ul li:before {
        content: "\f00c";
        font-family: "Font Awesome 6 Pro";
        font-weight: 900;
        padding-right: .5rem;
        color: #198754;
        font-size: 1.25rem; }

.calibay-carousel {
  padding-bottom: 10px; }

.card.calibay {
  margin: 10px;
  height: 100%;
  text-align: center;
  height: 250px; }

.content .calibay-feature.slick-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px; }
  @media screen and (max-width: 991px) {
    .content .calibay-feature.slick-slide {
      flex-direction: column; } }
  .content .calibay-feature.slick-slide img {
    width: auto;
    margin-right: 2rem; }

.calibay-hero {
  margin-top: 116px;
  background: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url("/images/calibaypools/home-hero.jpg");
  color: #fff;
  text-align: center;
  padding: 2rem;
  border-radius: 0 100px 0 100px; }
  .calibay-hero img.logo {
    width: 115px !important;
    margin-bottom: 20px; }

/* The Pool Resource Start */
.thepoolresource .picture-nav {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding: 0;
  max-width: 800px;
  margin: 0 auto; }
  .thepoolresource .picture-nav li {
    list-style: none;
    background-color: #fff;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 90%;
    box-shadow: 2px 2px 2px #eee;
    margin: 10px;
    text-align: center;
    transition: 0.3s ease-in-out; }
    .thepoolresource .picture-nav li:hover {
      box-shadow: 2px 5px 5px #eee;
      transition: 0.3s ease-in-out;
      transform: translateY(-10px); }
    .thepoolresource .picture-nav li a {
      display: block;
      width: 200px;
      height: 200px;
      line-height: 350px;
      padding: 0 2vw 0 2vw;
      box-sizing: border-box;
      border-radius: 5px;
      border: 2px solid transparent;
      transition: 0.3s ease-in-out; }
      .thepoolresource .picture-nav li a:hover {
        text-decoration: none;
        border: 2px solid #ba393e;
        transition: 0.3s ease-in-out; }
.thepoolresource #sunray {
  background-image: url("/thepoolresource/images/pool_types/sunray.jpg"); }
.thepoolresource #pretium {
  background-image: url("/thepoolresource/images/pool_types/pretium.jpg"); }
.thepoolresource #ohana {
  background-image: url("/thepoolresource/images/pool_types/ohana.jpg"); }
.thepoolresource #magnus {
  background-image: url("/thepoolresource/images/pool_types/magnus.jpg"); }
.thepoolresource #azor {
  background-image: url("/thepoolresource/images/pool_types/azor.jpg"); }
.thepoolresource #regency {
  background-image: url("/thepoolresource/images/pool_types/regency.jpg"); }
.thepoolresource #excursion {
  background-image: url("/thepoolresource/images/pool_types/excursion.jpg"); }
.thepoolresource img.pdf-download {
  width: auto;
  height: 20px;
  margin-bottom: 3px;
  margin-right: 5px;
  margin-top: 0;
  box-shadow: none; }
.thepoolresource .thumbnail {
  max-width: 400px;
  box-shadow: none; }
.thepoolresource .pool-size-flex {
  display: flex;
  flex-wrap: wrap;
  align-items: center; }
  @media screen and (max-width: 1053px) {
    .thepoolresource .pool-size-flex {
      justify-content: center; } }
  .thepoolresource .pool-size-flex .pool-size-brick {
    padding: 20px;
    border: 1px solid #eee;
    margin: 10px;
    box-shadow: 3px 3px 3px #ddd;
    width: calc(50% - 20px);
    min-width: 335px; }
    .thepoolresource .pool-size-flex .pool-size-brick h3 {
      margin-top: 0; }
    .thepoolresource .pool-size-flex .pool-size-brick p {
      font-size: 1rem; }
    .thepoolresource .pool-size-flex .pool-size-brick ul {
      padding: 0;
      font-size: 1rem;
      margin-bottom: 0 !important; }
      .thepoolresource .pool-size-flex .pool-size-brick ul li {
        list-style: none;
        display: block;
        padding: 5px; }

.thepoolresource .card a {
  display: block; }
.thepoolresource .card img {
  box-shadow: none; }

/* The Pool Resource End */
.content.swimaboveground h1.wave::after, .content.swimaboveground h2.wave::after, .content.swimaboveground h3.wave::after, .content.swimaboveground h4.wave::after, .content.swimaboveground h5.wave::after, .content.swimaboveground h6.wave::after {
  content: " ";
  display: block;
  width: 100px;
  height: 15px;
  background-image: url("/images/swimaboveground/wave_lightblue.svg");
  background-size: 100px;
  background-repeat: no-repeat;
  background-position: center;
  margin: 1rem auto 1rem 0; }
.content.swimaboveground h1.wave.white::after, .content.swimaboveground h2.wave.white::after, .content.swimaboveground h3.wave.white::after, .content.swimaboveground h4.wave.white::after, .content.swimaboveground h5.wave.white::after, .content.swimaboveground h6.wave.white::after {
  background-image: url("/images/swimaboveground/wave_white.svg"); }
.content.swimaboveground h1.wave.center::after, .content.swimaboveground h2.wave.center::after, .content.swimaboveground h3.wave.center::after, .content.swimaboveground h4.wave.center::after, .content.swimaboveground h5.wave.center::after, .content.swimaboveground h6.wave.center::after {
  margin: 1rem auto; }
.content.swimaboveground .navbar.swag {
  position: absolute;
  width: 100%;
  z-index: 100; }
  @media screen and (max-width: 991px) {
    .content.swimaboveground .navbar.swag {
      background-color: blue;
      position: relative; } }
  .content.swimaboveground .navbar.swag .navbar-brand {
    width: 175px; }
    .content.swimaboveground .navbar.swag .navbar-brand img {
      margin: 0; }
    @media screen and (max-width: 991px) {
      .content.swimaboveground .navbar.swag .navbar-brand {
        width: 125px; } }
  .content.swimaboveground .navbar.swag .navbar-nav {
    position: absolute;
    top: 10px;
    right: 15px; }
  .content.swimaboveground .navbar.swag .nav-link.dropdown-toggle {
    color: #fff;
    text-align: right; }
  .content.swimaboveground .navbar.swag .dropdown-menu {
    background-color: #343a40;
    padding: 0; }
    .content.swimaboveground .navbar.swag .dropdown-menu a.dropdown-item {
      background-color: #343a40;
      color: #fff;
      font-size: 0.9rem;
      padding: 15px; }
      .content.swimaboveground .navbar.swag .dropdown-menu a.dropdown-item:hover {
        background-color: #007CFF; }
.content.swimaboveground .white {
  color: #fff; }
  @media screen and (max-width: 991px) {
    .content.swimaboveground .white {
      color: #212529; } }
.content.swimaboveground .button-plain {
  background-color: #007CFF; }
  .content.swimaboveground .button-plain.left {
    margin-left: 0; }
.content.swimaboveground .hero-image {
  position: relative; }
  @media screen and (max-width: 991px) {
    .content.swimaboveground .hero-image {
      margin-top: -16px; } }
  .content.swimaboveground .hero-image .text-wrapper {
    position: absolute;
    left: 0;
    width: 100%;
    top: 0;
    z-index: 3;
    height: 100%;
    display: flex;
    align-items: center; }
    @media all and (max-width: 991px) {
      .content.swimaboveground .hero-image .text-wrapper {
        position: static;
        display: block;
        padding: 30px 20px 40px 20px; } }
    .content.swimaboveground .hero-image .text-wrapper .container {
      max-width: 40%;
      margin: 0 5% 0 auto;
      position: relative;
      bottom: 30px;
      color: #fff; }
      @media all and (max-width: 991px) {
        .content.swimaboveground .hero-image .text-wrapper .container {
          margin: 0;
          max-width: none;
          bottom: 0;
          color: #F7F9FC; } }
      .content.swimaboveground .hero-image .text-wrapper .container .text h3.wave {
        font-size: 1.9rem; }
        @media all and (max-width: 991px) {
          .content.swimaboveground .hero-image .text-wrapper .container .text h3.wave::after {
            background-image: url("/images/swimaboveground/wave_lightblue.svg"); } }
      .content.swimaboveground .hero-image .text-wrapper .container .text p {
        font-weight: bold;
        font-size: 0.9em; }
        @media all and (max-width: 900px) {
          .content.swimaboveground .hero-image .text-wrapper .container .text p {
            font-weight: normal;
            font-size: 1em; } }
.content.swimaboveground img {
  max-width: 100%;
  box-shadow: none;
  width: auto;
  height: auto; }
  .content.swimaboveground img.lightstream {
    height: 67px; }
.content.swimaboveground #pools-slider {
  margin-top: 2rem;
  display: flex; }
  .content.swimaboveground #pools-slider .slick-slide {
    padding: 0 10px; }
    .content.swimaboveground #pools-slider .slick-slide .inner {
      background: #F7F9FC;
      border-radius: 30px;
      padding: 20px; }
    .content.swimaboveground #pools-slider .slick-slide img {
      height: 100px;
      object-fit: contain;
      object-position: center;
      margin: 0 auto 20px auto; }
    .content.swimaboveground #pools-slider .slick-slide p {
      font-size: 15px;
      margin: 0; }
    .content.swimaboveground #pools-slider .slick-slide .btn {
      margin-top: 1rem; }
.content.swimaboveground .container.financing .col-sm-5 {
  padding-right: 2rem; }
  @media screen and (max-width: 991px) {
    .content.swimaboveground .container.financing .col-sm-5 {
      padding: 0 3rem;
      margin-bottom: 40px; } }
.content.swimaboveground .container.financing .overlapping-images {
  position: relative;
  height: 500px;
  padding-left: 1rem; }
  @media all and (min-width: 576px) and (max-width: 993px) {
    .content.swimaboveground .container.financing .overlapping-images {
      height: 300px;
      padding-left: 0; } }
  @media all and (max-width: 576px) {
    .content.swimaboveground .container.financing .overlapping-images {
      height: 260px;
      padding-left: 0; } }
  .content.swimaboveground .container.financing .overlapping-images img.img-1 {
    border-radius: 30px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 1rem;
    width: 80%;
    height: auto; }
  .content.swimaboveground .container.financing .overlapping-images img.img-2 {
    border-radius: 30px;
    overflow: hidden;
    border: 10px solid #fff;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 60%;
    height: auto; }
.content.swimaboveground .container-fluid.questions {
  background-image: url("/images/swimaboveground/pool_bg.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed; }
  .content.swimaboveground .container-fluid.questions .col-sm-5 {
    padding-left: 2rem; }
    @media screen and (max-width: 991px) {
      .content.swimaboveground .container-fluid.questions .col-sm-5 {
        padding: 0 3rem;
        margin-top: 40px; } }
  .content.swimaboveground .container-fluid.questions .overlapping-images {
    position: relative;
    height: 500px;
    padding-right: 1rem; }
    @media all and (min-width: 576px) and (max-width: 993px) {
      .content.swimaboveground .container-fluid.questions .overlapping-images {
        height: 300px;
        padding-right: 0; } }
    @media all and (max-width: 576px) {
      .content.swimaboveground .container-fluid.questions .overlapping-images {
        height: 260px;
        padding-right: 0; } }
    .content.swimaboveground .container-fluid.questions .overlapping-images img.img-1 {
      border-radius: 30px;
      overflow: hidden;
      position: absolute;
      top: 0;
      right: 1rem;
      width: 80%;
      height: auto; }
    .content.swimaboveground .container-fluid.questions .overlapping-images img.img-2 {
      border-radius: 30px;
      overflow: hidden;
      border: 10px solid #fff;
      position: absolute;
      left: 0;
      bottom: 0;
      width: 60%;
      height: auto; }
.content.swimaboveground .model-index .row {
  justify-content: space-between; }
  .content.swimaboveground .model-index .row .col {
    margin: 0 0 1rem 0;
    min-width: 32%;
    max-width: 33.33333%; }
    .content.swimaboveground .model-index .row .col .inner {
      background: #fff;
      border-radius: 1.5rem;
      box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1); }
    @media screen and (max-width: 991px) {
      .content.swimaboveground .model-index .row .col {
        margin: 0 0 1rem 0;
        flex: 0 0 100%;
        min-width: 0;
        max-width: none; }
        .content.swimaboveground .model-index .row .col:last-of-type {
          margin: 0; } }
    .content.swimaboveground .model-index .row .col img {
      display: block;
      height: 160px;
      width: 100%;
      object-fit: contain;
      object-position: center; }
    .content.swimaboveground .model-index .row .col h3 {
      font-size: 1.3rem; }
    .content.swimaboveground .model-index .row .col .button-plain {
      margin-top: 1rem; }
.content.swimaboveground .faq {
  margin-bottom: 2rem; }
  .content.swimaboveground .faq:last-of-type {
    margin: 0; }
  .content.swimaboveground .faq h4.question {
    cursor: pointer;
    display: flex;
    align-items: center;
    margin: 0;
    background-color: transparent;
    border-left: none;
    font-weight: bold; }
    .content.swimaboveground .faq h4.question:hover {
      color: #007CFF; }
    .content.swimaboveground .faq h4.question::before {
      content: "+";
      width: 23px;
      height: 23px;
      flex: 0 0 23px;
      border-radius: 50%;
      background: #007CFF;
      color: #fff;
      font-size: 15px;
      font-family: "Arial";
      display: flex;
      align-items: center;
      justify-content: center;
      margin-right: 12px;
      padding: 1px 0 0 1px;
      transition: transform 300ms ease; }
  .content.swimaboveground .faq .richtext.answer {
    padding-top: 1rem;
    display: none; }
  .content.swimaboveground .faq.open h4.question {
    color: #007CFF; }
    .content.swimaboveground .faq.open h4.question:hover {
      color: tint(#007CFF, 15%); }
    .content.swimaboveground .faq.open h4.question::before {
      transform: rotate(45deg); }
.content.swimaboveground .swag-measurements {
  background: #F7F9FC;
  border-radius: 1.5rem;
  padding: 15px 8px 16px 8px;
  text-align: center; }
  .content.swimaboveground .swag-measurements h3 {
    margin-top: 0; }
  .content.swimaboveground .swag-measurements span {
    display: block; }
.content.swimaboveground ul.swag-features {
  margin: 2rem auto 2rem auto !important;
  column-count: 3;
  padding-left: 0; }
  @media screen and (max-width: 767.98px) {
    .content.swimaboveground ul.swag-features {
      column-count: 2; } }
  @media screen and (max-width: 450px) {
    .content.swimaboveground ul.swag-features {
      column-count: 1; } }
  .content.swimaboveground ul.swag-features li {
    text-align: left;
    border-left: 4px solid #97C8F7;
    padding: 8px 10px 8px 15px;
    list-style: none; }
.content.swimaboveground .swag-brochure-banner {
  background-color: #97C8F7;
  margin-bottom: -5vh;
  padding-top: 1rem;
  padding-bottom: 1rem;
  margin-top: 1rem; }

.cards {
  display: flex;
  align-items: stretch;
  justify-content: center;
  flex-wrap: wrap; }
  .cards .card {
    background: #F7F9FC;
    border-radius: 30px;
    padding: 20px;
    border: none;
    box-shadow: none;
    margin: 5px;
    width: 350px;
    position: relative;
    padding-bottom: 70px; }
    .cards .card .link {
      width: 100%;
      height: 50px;
      position: absolute;
      display: flex;
      align-items: center;
      justify-content: center;
      bottom: 0px;
      left: 0;
      margin-bottom: 30px; }
    @media screen and (max-width: 991px) {
      .cards .card {
        width: 250px; } }
    @media screen and (max-width: 767px) {
      .cards .card {
        width: calc(50% - 10px); }
        .cards .card p {
          display: none; } }

.w-300 {
  width: 300px !important; }

.abg-hero img {
  margin-top: 0;
  margin: 0 auto;
  box-shadow: none;
  border-radius: 0 0 25px 25px; }
  .abg-hero img.desktop {
    max-width: 1600px;
    display: block; }
    @media screen and (max-width: 576px) {
      .abg-hero img.desktop {
        display: none; } }
  .abg-hero img.mobile {
    display: none; }
    @media screen and (max-width: 576px) {
      .abg-hero img.mobile {
        display: block;
        width: 100%; } }

.abg-cta {
  background-color: #38b6ff;
  border-radius: 25px; }
  .abg-cta img {
    max-width: 500px; }
  .abg-cta h3 {
    color: #fff;
    font-weight: bold; }
  .abg-cta .button-plain {
    background-color: #e14f66;
    font-family: 'Roboto Condensed', sans-serif;
    padding: 10px 25px; }

.circle {
  border-radius: 50%; }

.abg img {
  box-shadow: none; }

@media screen and (max-width: 576px) {
  .omni-phone {
    width: 100% !important; } }

#ot-sdk-btn.ot-sdk-show-settings {
  background-color: #1B43F5 !important;
  color: white !important;
  border-radius: 24px !important;
  border: 1px solid #1B43F5 !important; }
  #ot-sdk-btn.ot-sdk-show-settings:hover {
    background-color: #000182 !important; }

/* Backyard Escape colors */
/* Optimum Colors */
footer {
  color: #333;
  margin-top: 5vh; }
  footer a {
    color: #1B43F5; }
    footer a:hover {
      color: #1B43F5; }
  footer ul li {
    list-style: none; }
    footer ul li a {
      color: #333;
      padding: 3px 0;
      display: block; }
  footer #footer-top {
    background-color: #eef2f6;
    padding: 5vh 0; }
    @media screen and (max-width: 575px) {
      footer #footer-top {
        padding: 3vh 0; } }
    footer #footer-top h4 {
      text-transform: uppercase;
      font-size: 1.25rem;
      letter-spacing: 2px;
      font-weight: 700;
      margin-bottom: 1rem;
      padding-top: 1.5rem;
      padding-bottom: .5rem;
      display: inline-block; }
      @media screen and (max-width: 767px) {
        footer #footer-top h4 {
          margin-top: 1rem; } }
    footer #footer-top ul.priority li a {
      text-transform: uppercase;
      letter-spacing: 1px; }
    footer #footer-top .footer-logo img {
      padding: 1rem 1rem 1rem 0;
      max-width: 200px;
      width: 100%;
      box-shadow: none; }
    footer #footer-top .footer-logo p {
      font-size: 1rem;
      line-height: 1.4; }
    footer #footer-top .footer-logo a {
      font-size: 1rem; }
    footer #footer-top .footer-links .footer-links-flex {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-between; }
      footer #footer-top .footer-links .footer-links-flex > div {
        width: 47%;
        border-right: 1px solid #D9E1EB; }
        @media screen and (max-width: 992px) {
          footer #footer-top .footer-links .footer-links-flex > div:nth-child(2) {
            border-right: none; } }
        footer #footer-top .footer-links .footer-links-flex > div ul {
          padding-left: 0; }
          footer #footer-top .footer-links .footer-links-flex > div ul li a {
            letter-spacing: 1px; }
    footer #footer-top .footer-social ul {
      display: flex;
      flex-direction: row;
      padding-left: 0; }
      footer #footer-top .footer-social ul li a {
        padding-right: 1rem;
        font-size: 1.5rem; }
    @media screen and (max-width: 992px) {
      footer #footer-top .footer-social h4 {
        display: none; }
      footer #footer-top .footer-social ul {
        justify-content: space-around; } }
  footer #footer-legal {
    border-top: 1px solid #D9E1EB;
    background-color: #fff;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    font-size: .875rem;
    background-color: #F6F9F9; }
    footer #footer-legal .ot-sdk-show-settings:hover {
      text-decoration: underline;
      color: #1B43F5;
      cursor: pointer; }
    footer #footer-legal ul {
      display: flex;
      flex-wrap: wrap;
      margin-bottom: 0;
      padding-left: 0; }
      @media screen and (max-width: 575px) {
        footer #footer-legal ul {
          justify-content: space-evenly; } }
      footer #footer-legal ul li {
        padding-right: 0.5rem;
        padding-left: 0.5rem;
        border-right: 1px solid #ddd;
        margin-top: 3px; }
        @media screen and (max-width: 575px) {
          footer #footer-legal ul li {
            padding: .25rem; } }
        footer #footer-legal ul li:last-child {
          border-right: none; }
        footer #footer-legal ul li:first-child {
          padding-left: 0.5rem; }
    footer #footer-legal .copy {
      text-align: right; }
      @media screen and (max-width: 575px) {
        footer #footer-legal .copy {
          text-align: center;
          padding-top: .5rem;
          padding-bottom: .5rem; } }

/* Backyard Escape colors */
/* Optimum Colors */
img.hamburger {
  width: 30px;
  height: 30px; }

.mm-wrapper .mm-menu_offcanvas {
  width: 80vw; }

@media (max-width: 991px) {
  #mm-mobile-menu {
    display: none !important; }

  #hamburger {
    display: block !important; } }
@media (min-width: 992px) {
  #mobile-menu {
    display: none !important; }

  #hamburger {
    display: none !important; } }
nav#mobile-menu:not(.mm-menu) {
  display: none; }

@keyframes menu {
  from {
    transform: translate(-25%, 0);
    opacity: 0; }
  to {
    transform: translate(0, 0);
    opacity: 1; } }
ol.breadcrumb li.breadcrumb-item.active a {
  position: relative;
  right: 0.22rem; }

header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1030;
  transition: all 0.3s ease-in-out;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.6), transparent);
  /* BG COLOR START*/
  /* BG COLOR END*/
  /* GENERAL STYLING */
  /* HEADER MEDIA QUERIES START */ }
  header img.swp-logo {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 30px;
    margin-top: 8px;
    transition: 0.3s ease-in-out; }
    header img.swp-logo.full-white {
      opacity: 1; }
  header.scroll-down {
    top: -30px;
    transition: 0.4s ease-in-out; }
    @media screen and (max-width: 991px) {
      header.scroll-down {
        top: -60px; } }
  header.scroll-up {
    top: 0;
    transition: 0.4s ease-in-out; }
  header.home-nav {
    position: absolute; }
  header.background-white {
    transition: all 0.3s ease-in-out;
    background-color: transparent;
    /* BG WHITE HOVER*/
    /* BG WHITE HOVER END*/ }
    header.background-white .navbar.top-nav .navbar-nav .nav-item .nav-link {
      color: #fff; }
    header.background-white .navbar.bottom-nav .navbar-nav .nav-item {
      position: relative; }
      header.background-white .navbar.bottom-nav .navbar-nav .nav-item:hover::after {
        width: 100%;
        content: '';
        height: 3px;
        background-image: linear-gradient(to right, #FF585D, #FFAC04);
        position: absolute;
        bottom: -8px;
        left: 0; }
      header.background-white .navbar.bottom-nav .navbar-nav .nav-item.search-wrapper {
        position: static; }
        header.background-white .navbar.bottom-nav .navbar-nav .nav-item.search-wrapper:hover button i {
          color: #1B43F5; }
        header.background-white .navbar.bottom-nav .navbar-nav .nav-item.search-wrapper:hover::after {
          height: 0;
          width: 0;
          display: none; }
    header.background-white .navbar-brand img.swp-logo {
      position: absolute;
      top: 0;
      left: 30px;
      margin-top: 8px;
      opacity: 0;
      transition: 0.3s ease-in-out; }
      header.background-white .navbar-brand img.swp-logo.full-white {
        opacity: 1;
        transition: 0.3s ease-in-out; }
      @media screen and (max-width: 1250px) {
        header.background-white .navbar-brand img.swp-logo.full-white {
          opacity: 0;
          transition: 0.3s ease-in-out; }
        header.background-white .navbar-brand img.swp-logo.stacked-white {
          opacity: 1;
          transition: 0.3s ease-in-out; } }
      @media screen and (max-width: 1130px) {
        header.background-white .navbar-brand img.swp-logo.full-white {
          opacity: 0;
          transition: 0.3s ease-in-out; }
        header.background-white .navbar-brand img.swp-logo.stacked-white {
          opacity: 0;
          transition: 0.3s ease-in-out; }
        header.background-white .navbar-brand img.swp-logo.icon-white {
          opacity: 1;
          transition: 0.3s ease-in-out; } }
    header.background-white.hovered {
      transition: all 0.3s ease-in-out;
      background-color: #fff;
      background-image: none; }
      header.background-white.hovered .navbar-brand img.swp-logo.full-white {
        opacity: 0;
        transition: 0.3s ease-in-out; }
      header.background-white.hovered .navbar-brand img.swp-logo.full-blue {
        opacity: 1;
        transition: 0.3s ease-in-out; }
      @media screen and (max-width: 1250px) {
        header.background-white.hovered .navbar-brand img.swp-logo.full-white {
          opacity: 0;
          transition: 0.3s ease-in-out; }
        header.background-white.hovered .navbar-brand img.swp-logo.full-blue {
          opacity: 0;
          transition: 0.3s ease-in-out; }
        header.background-white.hovered .navbar-brand img.swp-logo.stacked-blue {
          opacity: 1;
          transition: 0.3s ease-in-out; } }
      @media screen and (max-width: 1130px) {
        header.background-white.hovered .navbar-brand img.swp-logo.full-white {
          opacity: 0;
          transition: 0.3s ease-in-out; }
        header.background-white.hovered .navbar-brand img.swp-logo.full-blue {
          opacity: 0;
          transition: 0.3s ease-in-out; }
        header.background-white.hovered .navbar-brand img.swp-logo.stacked-white {
          opacity: 0;
          transition: 0.3s ease-in-out; }
        header.background-white.hovered .navbar-brand img.swp-logo.stacked-blue {
          opacity: 0;
          transition: 0.3s ease-in-out; }
        header.background-white.hovered .navbar-brand img.swp-logo.icon-blue {
          opacity: 1;
          transition: 0.3s ease-in-out; } }
      header.background-white.hovered hr {
        margin: 0;
        border-top: 1px solid rgba(0, 0, 0, 0.15); }
      header.background-white.hovered .navbar.top-nav .navbar-nav .nav-item .nav-link {
        color: #333; }
      header.background-white.hovered .navbar.bottom-nav .navbar-nav .nav-item #desktop-search-icon {
        color: black;
        transition: 0.3s ease-in-out; }
        header.background-white.hovered .navbar.bottom-nav .navbar-nav .nav-item #desktop-search-icon:focus {
          outline: none; }
      header.background-white.hovered .navbar.bottom-nav .navbar-nav .nav-item .nav-link {
        color: #333; }
  header.bg-color {
    background-image: linear-gradient(to right, #1B43F5, #000182); }
    header.bg-color .navbar.top-nav {
      background-color: rgba(0, 0, 0, 0.2); }
      header.bg-color .navbar.top-nav .navbar-nav .nav-item .nav-link {
        color: #fff; }
    header.bg-color .bottom-nav {
      box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); }
      header.bg-color .bottom-nav .navbar-collapse .navbar-nav .nav-item {
        position: relative; }
        header.bg-color .bottom-nav .navbar-collapse .navbar-nav .nav-item:hover::after {
          width: 100%;
          content: '';
          height: 3px;
          background-image: linear-gradient(to right, #FF585D, #FFAC04);
          position: absolute;
          bottom: -8px;
          left: 0; }
        header.bg-color .bottom-nav .navbar-collapse .navbar-nav .nav-item.search-wrapper {
          position: static;
          border-radius: 100px;
          padding: 0;
          margin: 0 7px;
          transition: background-color 0.3s ease-in-out; }
          header.bg-color .bottom-nav .navbar-collapse .navbar-nav .nav-item.search-wrapper:hover {
            background-color: #1B43F5;
            transition: background-color 0.3s ease-in-out;
            box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2); }
            header.bg-color .bottom-nav .navbar-collapse .navbar-nav .nav-item.search-wrapper:hover::after {
              display: none; }
  header hr {
    margin: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.15); }
  header .navbar.top-nav {
    padding-top: 0;
    padding-bottom: 0;
    transition: 0.3s-ease-in-out; }
    header .navbar.top-nav .navbar-nav {
      width: 100%;
      justify-content: space-between; }
      header .navbar.top-nav .navbar-nav .nav-items-right {
        display: flex;
        flex-direction: row; }
      header .navbar.top-nav .navbar-nav .nav-item .nav-link {
        font-size: 0.85rem;
        font-weight: 400;
        color: #333;
        padding-top: 5px;
        padding-bottom: 5px;
        margin: 0 15px; }
  @media screen and (max-width: 991px) {
    header .navbar.bottom-nav {
      display: none; } }
  header .navbar.bottom-nav a.navbar-brand {
    padding-top: 0; }
    header .navbar.bottom-nav a.navbar-brand img {
      height: 40px; }
  header .navbar.bottom-nav .navbar-nav .nav-item {
    padding-left: 7px;
    padding-right: 7px; }
    header .navbar.bottom-nav .navbar-nav .nav-item:hover {
      transition: all 0.3s ease-in-out; }
    header .navbar.bottom-nav .navbar-nav .nav-item.dealer-item:hover::after {
      display: none; }
    header .navbar.bottom-nav .navbar-nav .nav-item #desktop-search-icon {
      border: none;
      color: #fff;
      background-color: transparent;
      font-size: 0.95rem;
      padding-top: 8px;
      transition: 0.3s ease-in-out; }
      header .navbar.bottom-nav .navbar-nav .nav-item #desktop-search-icon:focus {
        outline: none; }
    header .navbar.bottom-nav .navbar-nav .nav-item .dropdown-menu.show {
      border-radius: 0 0 5px 5px;
      top: 115%;
      animation: 0.3s ease-in-out menu;
      border-top: 0;
      margin-top: 2px; }
    header .navbar.bottom-nav .navbar-nav .nav-item .nav-link {
      color: #fff;
      text-transform: uppercase;
      font-weight: 400;
      transition: all 0.3s ease-in-out;
      font-size: 0.95rem;
      letter-spacing: 1px; }
    header .navbar.bottom-nav .navbar-nav .nav-item .nav-link.dropdown-toggle::after {
      display: none; }
  header i {
    padding-left: 5px;
    padding-right: 5px; }
  header hr {
    margin: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.15); }
  @media screen and (max-width: 1300px) {
    header img.swp-logo.full-white {
      opacity: 0;
      transition: 0.3s ease-in-out; }
    header img.swp-logo.stacked-white {
      opacity: 1;
      transition: 0.3s ease-in-out; } }
  @media screen and (max-width: 1200px) {
    header img.swp-logo.full-white {
      opacity: 0;
      transition: 0.3s ease-in-out; }
    header img.swp-logo.stacked-white {
      opacity: 0;
      transition: 0.3s ease-in-out; }
    header img.swp-logo.icon-white {
      opacity: 1;
      transition: 0.3s ease-in-out; }
    header .navbar.bottom-nav .navbar-nav .nav-item .container.container-two {
      padding-left: 5px;
      padding-right: 0; }
      header .navbar.bottom-nav .navbar-nav .nav-item .container.container-two .gradient-button {
        padding: 10px 15px; }
    header .navbar.bottom-nav .navbar-nav .nav-item .nav-link {
      text-transform: initial;
      font-size: 1rem; } }
  @media screen and (max-width: 991px) {
    header.desktop {
      display: none; }
    header.mobile {
      display: block; }
    header nav.desktop {
      display: none; } }

/* HEADER MEDIA QUERIES END */
/* FIND A BUILDER BUTTON START */
.gradient-button {
  position: relative;
  padding: 10px 20px;
  border-radius: 25px;
  overflow: hidden;
  z-index: 1;
  color: #fff;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 0.85rem;
  letter-spacing: 1px; }
  .gradient-button:hover {
    color: #fff;
    text-decoration: none;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }

.fill-two {
  position: absolute;
  background-image: linear-gradient(to right, #FF585D, #FFAC04);
  background-size: 150% 150%;
  height: 70px;
  width: 350px;
  border-radius: 5px;
  margin: -40px 0 0 -140px;
  z-index: -1;
  transition: all 0.4s ease; }

.container-two:hover .fill-two {
  -webkit-animation: gradient 3s ease infinite;
  -moz-animation: gradient 3s ease infinite;
  animation: gradient 3s ease infinite; }

/* FIND A BUILDER BUTTON END */
#desktop-search-form {
  border-top: 1px solid #D9E1EB; }

#mobile-search-form, #desktop-search-form {
  opacity: 0;
  visibility: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 100%;
  bottom: -38px;
  left: 0;
  border-radius: 0;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
  transition: 0.3s ease-in-out; }
  #mobile-search-form.active, #desktop-search-form.active {
    opacity: 1;
    transition: 0.3s ease-in-out;
    visibility: visible; }
  #mobile-search-form .search-button, #desktop-search-form .search-button {
    font-size: 1.1rem;
    color: #fff;
    font-weight: bold;
    background-image: linear-gradient(to right, #FF585D, #FFAC04);
    display: block;
    position: relative;
    width: 15vw;
    border: none;
    padding: 6px 0; }

#desktop-search-input, #mobile-search-input {
  width: 85vw;
  border-radius: 0;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1);
  border: none; }

#mobile-nav {
  display: none;
  position: relative;
  z-index: 100; }
  @media screen and (max-width: 991px) {
    #mobile-nav {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background-color: #1B43F5;
      padding: 5px;
      position: relative; }
      #mobile-nav #hamburger .ham {
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        transition: transform 400ms;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none; }
      #mobile-nav #hamburger .hamRotate.active {
        transform: rotate(45deg); }
      #mobile-nav #hamburger .hamRotate180.active {
        transform: rotate(180deg); }
      #mobile-nav #hamburger .line {
        fill: none;
        transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
        stroke: #fff;
        stroke-width: 5.5;
        stroke-linecap: round; }
      #mobile-nav #hamburger .ham8 .top {
        stroke-dasharray: 40 160; }
      #mobile-nav #hamburger .ham8 .middle {
        stroke-dasharray: 40 142;
        transform-origin: 50%;
        transition: transform 400ms; }
      #mobile-nav #hamburger .ham8 .bottom {
        stroke-dasharray: 40 85;
        transform-origin: 50%;
        transition: transform 400ms, stroke-dashoffset 400ms; }
      #mobile-nav #hamburger .ham8.active .top {
        stroke-dashoffset: -64px; }
      #mobile-nav #hamburger .ham8.active .middle {
        transform: rotate(90deg); }
      #mobile-nav #hamburger .ham8.active .bottom {
        stroke-dashoffset: -64px; }
      #mobile-nav #mobile-logo .mobile-swp-logo {
        height: 40px; }
      #mobile-nav #mobile-search-icon {
        background-color: transparent;
        color: #fff;
        border: none;
        padding: 10px;
        transition: 0.3s ease-in-out;
        background-color: #1B43F5;
        margin-right: 10px;
        border-radius: 100px; }
        #mobile-nav #mobile-search-icon:focus {
          outline: 0; }
        #mobile-nav #mobile-search-icon.active {
          transition: 0.3s ease-in-out;
          box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); } }

.dropdown-item.active, .dropdown-item:active {
  background-color: #1B43F5; }

.mm-navbar .mm-navbar__title {
  color: #333 !important;
  font-weight: 700; }

.mm-listitem {
  border: none !important;
  border-color: transparent !important; }
  .mm-listitem .mm-listitem__text {
    padding-left: 15px;
    border-bottom: 1px solid;
    border-color: rgba(0, 0, 0, 0.1);
    font-size: .95rem; }
  .mm-listitem .mm-listitem__btn {
    border-bottom: 1px solid;
    border-color: rgba(0, 0, 0, 0.1); }

/* Backyard Escape colors */
/* Optimum Colors */
/* Backyard Escape colors */
/* Optimum Colors */
ul.social-icons {
  list-style-type: none;
  padding: 0;
  margin: 0; }
  ul.social-icons li {
    display: inline-block;
    margin-right: 0.5rem; }
    ul.social-icons li:last-of-type {
      margin-right: 0; }
    ul.social-icons li a {
      font-size: 1.2rem; }
      ul.social-icons li a:hover {
        color: #000182; }

.vimeo-iframe {
  padding: 56.25% 0 0 0;
  position: relative;
  width: 100%; }
  .vimeo-iframe iframe {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0; }

.vendor.banner-ad {
  position: relative;
  width: 100%;
  max-width: 1080px;
  height: auto;
  padding-top: 13.8888%;
  margin: 0 auto;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }
  .vendor.banner-ad a {
    display: block;
    text-decoration: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2; }
    .vendor.banner-ad a img {
      display: block;
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1;
      box-shadow: none;
      margin-top: 0;
      margin-bottom: 0; }

.premier-flex {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  max-width: 1280px;
  margin: 0 auto;
  margin-bottom: 10px;
  width: 100%; }
  .premier-flex:hover .premier-logo {
    transform: translateY(-5px);
    transition: 0.3s ease-in-out; }
  @media screen and (max-width: 991px) {
    .premier-flex {
      flex-wrap: wrap;
      padding-bottom: 20px;
      border-bottom: 1px solid #D9E1EB; } }
  .premier-flex a {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 100; }
  .premier-flex .premier-logo {
    width: calc(25% - 5px);
    margin-right: 20px;
    max-width: 250px;
    transition: 0.3s ease-in-out; }
    .premier-flex .premier-logo .logo {
      margin: 0; }
    @media screen and (max-width: 1080px) {
      .premier-flex .premier-logo {
        width: auto; } }
  .premier-flex .premier-content {
    width: 75%; }
    @media screen and (max-width: 767px) {
      .premier-flex .premier-content {
        width: 90vw; } }
    .premier-flex .premier-content h2 {
      margin-top: 0; }
    .premier-flex .premier-content .angle-link a {
      position: relative;
      margin: 0 auto;
      padding: 0; }

.premier-logo {
  border: 1px solid rgba(4, 119, 191, 0.3); }

.vendor-carousel .slick-prev:before, .vendor-carousel .slick-next:before, .product-carousel .slick-prev:before, .product-carousel .slick-next:before {
  color: #1B43F5;
  font-size: 24px; }
.vendor-carousel .slick-prev:hover:before, .vendor-carousel .slick-next:hover:before, .product-carousel .slick-prev:hover:before, .product-carousel .slick-next:hover:before {
  color: #000182; }
@media all and (max-width: 600px) {
  .vendor-carousel .slick-prev, .product-carousel .slick-prev {
    left: -10px; }
  .vendor-carousel .slick-next, .product-carousel .slick-next {
    right: -10px; } }
.vendor-carousel .slick-dots, .product-carousel .slick-dots {
  bottom: -65px; }
.vendor-carousel .vendor-slide, .vendor-carousel .product-slide, .product-carousel .vendor-slide, .product-carousel .product-slide {
  position: relative; }
  .vendor-carousel .vendor-slide .slide-media, .vendor-carousel .product-slide .slide-media, .product-carousel .vendor-slide .slide-media, .product-carousel .product-slide .slide-media {
    max-width: 600px;
    margin: 0 auto;
    position: relative;
    overflow: hidden; }
    .vendor-carousel .vendor-slide .slide-media a.video-link, .vendor-carousel .product-slide .slide-media a.video-link, .product-carousel .vendor-slide .slide-media a.video-link, .product-carousel .product-slide .slide-media a.video-link {
      position: absolute;
      z-index: 1010;
      display: block;
      transition: 0.3s ease-in-out;
      background-color: #fff;
      border-radius: 25px; }
      .vendor-carousel .vendor-slide .slide-media a.video-link:hover, .vendor-carousel .product-slide .slide-media a.video-link:hover, .product-carousel .vendor-slide .slide-media a.video-link:hover, .product-carousel .product-slide .slide-media a.video-link:hover {
        text-decoration: none;
        color: #000182;
        transition: 0.3s ease-in-out; }
        .vendor-carousel .vendor-slide .slide-media a.video-link:hover i::after, .vendor-carousel .product-slide .slide-media a.video-link:hover i::after, .product-carousel .vendor-slide .slide-media a.video-link:hover i::after, .product-carousel .product-slide .slide-media a.video-link:hover i::after {
          left: 24px;
          transition: 0.3s ease-in-out; }
      .vendor-carousel .vendor-slide .slide-media a.video-link:focus, .vendor-carousel .product-slide .slide-media a.video-link:focus, .product-carousel .vendor-slide .slide-media a.video-link:focus, .product-carousel .product-slide .slide-media a.video-link:focus {
        outline: none; }
      .vendor-carousel .vendor-slide .slide-media a.video-link i, .vendor-carousel .product-slide .slide-media a.video-link i, .product-carousel .vendor-slide .slide-media a.video-link i, .product-carousel .product-slide .slide-media a.video-link i {
        font-size: 2.7rem;
        display: block;
        z-index: 1010;
        overflow: hidden;
        height: 43px; }
        .vendor-carousel .vendor-slide .slide-media a.video-link i::before, .vendor-carousel .product-slide .slide-media a.video-link i::before, .product-carousel .vendor-slide .slide-media a.video-link i::before, .product-carousel .product-slide .slide-media a.video-link i::before {
          z-index: 1010;
          position: absolute;
          top: 0;
          left: 0;
          background-color: #fff;
          border-radius: 25px; }
        .vendor-carousel .vendor-slide .slide-media a.video-link i:after, .vendor-carousel .product-slide .slide-media a.video-link i:after, .product-carousel .vendor-slide .slide-media a.video-link i:after, .product-carousel .product-slide .slide-media a.video-link i:after {
          content: 'Watch Video';
          background-color: #fff;
          font-size: 1rem;
          color: #000182;
          padding: 10px 15px 10px 25px;
          border-radius: 0 25px 25px 0;
          position: absolute;
          left: -200px;
          top: 2px;
          transition: 0.3s ease-in-out;
          font-family: 'Lato', sans-serif;
          width: 144px;
          font-weight: bold; }
        @media screen and (max-width: 991px) {
          .vendor-carousel .vendor-slide .slide-media a.video-link i, .vendor-carousel .product-slide .slide-media a.video-link i, .product-carousel .vendor-slide .slide-media a.video-link i, .product-carousel .product-slide .slide-media a.video-link i {
            font-size: 3.2rem; }
            .vendor-carousel .vendor-slide .slide-media a.video-link i:hover:after, .vendor-carousel .product-slide .slide-media a.video-link i:hover:after, .product-carousel .vendor-slide .slide-media a.video-link i:hover:after, .product-carousel .product-slide .slide-media a.video-link i:hover:after {
              top: 7px;
              left: 34px; } }
    .vendor-carousel .vendor-slide .slide-media a.link, .vendor-carousel .product-slide .slide-media a.link, .product-carousel .vendor-slide .slide-media a.link, .product-carousel .product-slide .slide-media a.link {
      width: 100%;
      display: block;
      height: 100%;
      position: absolute;
      z-index: 1000;
      transition: 0.4s ease-in-out; }
      .vendor-carousel .vendor-slide .slide-media a.link:focus, .vendor-carousel .product-slide .slide-media a.link:focus, .product-carousel .vendor-slide .slide-media a.link:focus, .product-carousel .product-slide .slide-media a.link:focus {
        outline-width: 0; }
      .vendor-carousel .vendor-slide .slide-media a.link::before, .vendor-carousel .product-slide .slide-media a.link::before, .product-carousel .vendor-slide .slide-media a.link::before, .product-carousel .product-slide .slide-media a.link::before {
        content: 'Learn More';
        position: absolute;
        width: 100%;
        height: 40%;
        background-image: linear-gradient(to top, rgba(27, 67, 245, 0.9), rgba(0, 1, 130, 0.9));
        top: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        transition: 0.4s ease-in-out;
        border-radius: 100% 100% 0 0;
        font-size: 1.125rem;
        letter-spacing: 1px;
        text-transform: uppercase; }
      .vendor-carousel .vendor-slide .slide-media a.link:hover::before, .vendor-carousel .product-slide .slide-media a.link:hover::before, .product-carousel .vendor-slide .slide-media a.link:hover::before, .product-carousel .product-slide .slide-media a.link:hover::before {
        top: 60%; }
    .vendor-carousel .vendor-slide .slide-media img, .vendor-carousel .product-slide .slide-media img, .product-carousel .vendor-slide .slide-media img, .product-carousel .product-slide .slide-media img {
      display: block;
      box-shadow: none;
      margin: 0 auto;
      padding: 20px;
      width: 100%; }
      @media screen and (max-width: 991px) {
        .vendor-carousel .vendor-slide .slide-media img, .vendor-carousel .product-slide .slide-media img, .product-carousel .vendor-slide .slide-media img, .product-carousel .product-slide .slide-media img {
          width: 90%; } }
  .vendor-carousel .vendor-slide .slide-content, .vendor-carousel .product-slide .slide-content, .product-carousel .vendor-slide .slide-content, .product-carousel .product-slide .slide-content {
    box-shadow: none;
    text-align: center;
    width: 100%;
    max-width: 100%;
    background: #fff;
    padding-top: 20px; }
    .vendor-carousel .vendor-slide .slide-content p, .vendor-carousel .product-slide .slide-content p, .product-carousel .vendor-slide .slide-content p, .product-carousel .product-slide .slide-content p {
      margin-bottom: 0; }
      .vendor-carousel .vendor-slide .slide-content p.energy, .vendor-carousel .product-slide .slide-content p.energy, .product-carousel .vendor-slide .slide-content p.energy, .product-carousel .product-slide .slide-content p.energy {
        color: #28a745;
        font-size: 15px;
        margin-top: 5px; }
    .vendor-carousel .vendor-slide .slide-content h3, .vendor-carousel .product-slide .slide-content h3, .product-carousel .vendor-slide .slide-content h3, .product-carousel .product-slide .slide-content h3 {
      color: #1B43F5;
      letter-spacing: 2px;
      text-transform: uppercase;
      margin: 0;
      font-size: 1.1em; }

.products-flex {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  max-width: 1280px;
  margin: 0 auto; }
  .products-flex .unit {
    margin: 5px auto;
    width: calc(25% - 10px);
    max-width: 250px;
    transition: 0.3s ease-in-out; }
    .products-flex .unit:hover {
      transform: translateY(-5px);
      transition: 0.3s ease-in-out; }
    .products-flex .unit img {
      margin: 0; }
    @media screen and (max-width: 991px) {
      .products-flex .unit {
        width: calc(33% - 10px); } }
    @media screen and (max-width: 767px) {
      .products-flex .unit {
        width: calc(50% - 10px); } }

a.rebate {
  border: 1px solid #1B43F5;
  border-radius: 25px;
  padding: 7px 20px;
  display: inline-block;
  transition: 0.3s ease-in-out;
  max-width: 90%;
  margin-top: .75rem; }
  a.rebate:hover {
    background-color: #FF585D;
    border: 1px solid #FF585D;
    color: #fff;
    text-decoration: none;
    transition: 0.3s ease-in-out; }

img.logo {
  margin: 0; }
  @media screen and (max-width: 767px) {
    img.logo {
      width: 60%;
      margin: 0 auto;
      display: block; } }

/* Backyard Escape colors */
/* Optimum Colors */
.pool-wars h1 {
  font-family: 'Oswald', sans-serif;
  color: #15133F;
  font-weight: 700 !important;
  text-transform: uppercase;
  transform: skew(-7deg) scaleX(0.9); }
.pool-wars h2 {
  font-family: 'Oswald', sans-serif;
  color: #15133F;
  font-weight: 700 !important;
  text-transform: uppercase; }
.pool-wars h3 {
  font-family: 'Oswald', sans-serif;
  color: #15133F;
  font-weight: 700 !important;
  text-transform: uppercase;
  transform: skew(-7deg) scaleX(0.9);
  font-size: 2rem; }
.pool-wars h4 {
  font-family: 'Oswald', sans-serif;
  color: #15133F;
  font-weight: 700 !important;
  text-transform: uppercase;
  transform: skew(-7deg) scaleX(0.9);
  font-size: 1.5rem; }
.pool-wars a {
  color: #15133F;
  font-weight: bold;
  transition: all 0.25s ease-in-out;
  text-decoration: underline; }
  .pool-wars a:hover {
    color: #ff0a6c;
    transition: all 0.25s ease-in-out; }
.pool-wars.entry {
  background-image: url("/images/pool-wars/form-bg.jpg");
  background-size: cover;
  background-position: bottom;
  margin-top: 0;
  padding-top: 7vh;
  z-index: -10; }
  .pool-wars.entry h1.entry-header {
    margin: 0;
    padding-bottom: 5vh; }
.pool-wars.contest-terms {
  margin-bottom: 7vh; }

header.poolwars.scroll-down, header.poolwars.scroll-up {
  top: 0; }
header.poolwars .navbar {
  overflow: hidden;
  width: 100%;
  box-shadow: 0px 5px 20px #e5e5e5;
  z-index: 10;
  background-color: #fff; }
  @media screen and (max-width: 767px) {
    header.poolwars .navbar {
      background-color: #D9E1EB; } }
  header.poolwars .navbar:before {
    content: '';
    position: absolute;
    top: -400px;
    left: 0;
    background-image: url("/images/pool-wars/top-left-pink.png");
    height: 761px;
    width: 425px;
    z-index: -1; }
    @media screen and (max-width: 767px) {
      header.poolwars .navbar:before {
        display: none; } }
  header.poolwars .navbar:after {
    content: '';
    position: absolute;
    top: -400px;
    right: 0;
    background-image: url("/images/pool-wars/top-right-yellow.png");
    height: 741px;
    width: 550px;
    z-index: -1; }
    @media screen and (max-width: 767px) {
      header.poolwars .navbar:after {
        display: none; } }
  header.poolwars .navbar .navbar-brand {
    margin-right: auto;
    margin-left: auto; }
    header.poolwars .navbar .navbar-brand > img {
      max-width: 100%;
      width: 180px; }
    @media screen and (max-width: 767px) {
      header.poolwars .navbar .navbar-brand {
        padding-bottom: 20px; } }
  header.poolwars .navbar .powered-by {
    display: block;
    text-align: right;
    position: absolute;
    right: 10px;
    font-size: small; }
    @media screen and (max-width: 767px) {
      header.poolwars .navbar .powered-by {
        display: block;
        text-align: center;
        bottom: 5px;
        width: 100%; } }
    header.poolwars .navbar .powered-by a {
      display: block; }
      @media screen and (max-width: 767px) {
        header.poolwars .navbar .powered-by a {
          display: inline-block; } }
      header.poolwars .navbar .powered-by a img {
        height: 20px;
        position: relative;
        top: -5px; }
        @media screen and (max-width: 767px) {
          header.poolwars .navbar .powered-by a img {
            margin-left: 3px;
            top: -2px;
            height: 17px; } }

.footer-logos img {
  max-height: 80px;
  height: 80px;
  display: block;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto; }

.winner-images img {
  border: 2px solid #15133F;
  width: 100%;
  max-width: 255px; }

.container-fluid.lines-bg {
  background-image: url("/images/pool-wars/wave-lines-bg.png");
  background-size: cover; }

.btw-bg {
  background-color: #fc9512;
  background-image: linear-gradient(45deg, #ff0a6c 0%, #fc9512 100%);
  transform: skew(-7deg); }
  .btw-bg h1 {
    color: #fff;
    transform: scaleX(0.9);
    padding: 0 0 5px 0;
    font-size: 3.5rem;
    margin: 0; }
    .btw-bg h1 a {
      color: #fff;
      text-decoration: none;
      display: block;
      transition: all .25s ease-in-out; }
      .btw-bg h1 a:hover {
        color: inherit;
        letter-spacing: 1px;
        transform: scale(1.07);
        transition: all .25s ease-in-out; }

.pool-wars-footer {
  background-color: #15133F;
  padding-top: 7vh;
  padding-bottom: 7vh;
  text-align: center; }
  .pool-wars-footer a {
    color: #fff; }
  .pool-wars-footer p {
    color: #fff; }

.footer-logos img {
  height: 80px;
  display: block;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto; }

.winner-images img {
  border: 2px solid #15133F;
  width: 100%;
  max-width: 255px; }

.container-fluid.lines-bg {
  background-image: url("/images/pool-wars/wave-lines-bg.png");
  background-size: cover; }

a.highlight-button {
  display: inline-block;
  color: #fff;
  padding: 15px 25px;
  font-size: 2rem;
  margin: 0;
  background-color: #fc9512;
  background-image: linear-gradient(45deg, #ff0a6c 0%, #fc9512 100%);
  transform: skew(-7deg);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 5px;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1); }
  a.highlight-button:hover {
    color: #fff;
    transform: scale(1.1);
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); }

.poolwars-footer {
  background-color: #15133F;
  padding-top: 7vh;
  padding-bottom: 7vh;
  text-align: center; }
  .poolwars-footer a {
    color: #fff; }
  .poolwars-footer p {
    color: #fff; }

.buffer {
  margin: 76px; }

img.adobe-pdf-icon {
  display: inline;
  width: auto;
  box-shadow: none; }

.privacy-wrapper ul li, .privacy-wrapper p, .privacy-wrapper table {
  font-size: 1rem;
  color: #555; }
.privacy-wrapper .otnotice-menu,
.privacy-wrapper .otnotice-menu-mobile,
.privacy-wrapper .otnotice-version,
.privacy-wrapper .otnotice__version {
  display: none !important; }
.privacy-wrapper .otnotice-content {
  padding-inline: 0; }
  .privacy-wrapper .otnotice-content .otnotice-sections {
    margin-inline: 0; }
    .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content {
      margin-inline: 0 !important; }
      .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content table tr {
        border: 0; }
        .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content table tr:nth-of-type(2n) {
          background-color: #f8f8f8; }
        .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content table tr td {
          border-bottom: 0;
          border-inline: 0;
          border-top: 1px solid #dee2e6; }
          .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content table tr td ul {
            margin-bottom: 0 !important; }
            .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content table tr td ul li:last-child {
              margin-bottom: 0; }
      @media (max-width: 600px) {
        .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content table th {
          display: none; }
        .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content table td {
          display: block; }
          .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content table td:before {
            content: attr(data-cell) ": ";
            font-weight: 700;
            display: block; } }
      .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content ul {
        padding-inline: 2rem 0; }
        .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content ul.list-unstyled.pl-0 {
          padding-left: 0; }
        .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content ul li {
          position: relative; }
        .privacy-wrapper .otnotice-content .otnotice-sections .otnotice-section .otnotice-section-content ul span {
          padding-right: .75rem;
          position: absolute;
          left: -20px; }
