/* 1a. Containers */




/* 1b. Colors */




/* 1c. Typography */


























/* 1d. Buttons */













/* 1e. Forms */









































/* 1f. Tables */













/* 1g. Website header */








/* 1h. Website footer */








.content-wrapper {
  max-width: 1240px;
}

.dnd-section,
.content-wrapper--vertical-spacing {
  padding: 80px 1rem;
}

.dnd-section > .row-fluid {
  max-width: 1240px;
}





html {
  font-size: 24px;
}

body {
  font-family: Lato, sans-serif; font-style: normal; font-weight: normal; text-decoration: none;
  color: #c8102e;
  font-size: 24px;
}

/* Paragraphs */

p {
  font-size: 0.8em;
}

/* Anchors */

a {
  font-weight: normal; text-decoration: none; font-family: Lato, sans-serif; font-style: normal;
}

a:hover,
a:focus {
  color: #000;
}

a:active {
  font-weight: normal; text-decoration: none; font-family: Lato, sans-serif; font-style: normal;
  color: #2a98ff;
}

/* Headings */

h1,
.h1 {
  font-weight: 700; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  color: #c8102e;
  font-size: 50px;
  text-transform: none;
}

h2,
.h2 {
  font-weight: 700; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  color: #c8102e;
  font-size: 38px;
  text-transform: none;
}

h3,
.h3 {
  font-weight: 700; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  color: #c8102e;
  font-size: 30px;
  text-transform: none;
}

h4,
.h4 {
  font-weight: normal; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  color: #c8102e;
  font-size: 24px;
  text-transform: none;
}

h5,
.h5 {
  font-weight: normal; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  color: #c8102e;
  font-size: 16px;
  text-transform: none;
}

h6,
.h6 {
  font-weight: normal; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  color: #c8102e;
  font-size: 14px;
  text-transform: none;
}

/* Blockquote */

blockquote {
  border-left-color: #696969;
}





button,
.button,
.hs-button,
.hs-blog-post-listing__post-button {
  border: 1px solid #c8102e;

  padding-top: 15px;
padding-right: 53px;
padding-bottom: 15px;
padding-left: 53px;

  font-family: Lato, sans-serif; font-style: normal; font-weight: normal; text-decoration: none;
  background-color: 

  
  
    
  


  rgba(200, 16, 46, 1.0)

;
  border-radius: 6px;
  color: #FFFFFF;
  font-size: 22px;
  text-transform: none;
}

button:hover,
button:focus,
.button:hover,
.button:focus,
.hs-button:hover,
.hs-button:focus,
.hs-blog-post-listing__post-button:hover,
.hs-blog-post-listing__post-button:focus {
  border: 1px solid #1a334e;
;
  color: 

  
  
    
  


  rgba(255, 255, 255, 1.0)

;
  background-color: 

  
  
    
  


  rgba(26, 51, 78, 1.0)

;
  border-radius: 6px;
}

button:active,
.button:active,
.hs-button:active,
.hs-blog-post-listing__post-button:active {
  font-family: Lato, sans-serif; font-style: normal; font-weight: normal; text-decoration: none;
  background-color: rgba(240, 56, 86, 1.0);
  border-color: #f03856;
}





form,
.submitted-message {
  font-family: Lato, sans-serif; font-style: normal; font-weight: normal; text-decoration: none;
  border: 1px none #696969;
;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
  background-color: 

  
  
    
  


  rgba(105, 105, 105, 1.0)

;
  padding: 0px;
;
}

/* Form title */

.form-title {
  border: 1px none #696969;
;
  padding-top: 0px;
padding-right: 0px;
padding-bottom: 30px;
padding-left: 0px;
;
  font-family: Merriweather; font-style: normal; font-weight: 700; text-decoration: none;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
  font-size: 30px;
  color: #c8102e;
  background-color: 

  
  
    
  


  rgba(105, 105, 105, 1.0)

;
}


/* Labels */

form label {
  color: #000;
}

/* Help text */

form legend {
  color: #c8102e;
}

/* Inputs */

form input[type=text],
form input[type=search],
form input[type=email],
form input[type=password],
form input[type=tel],
form input[type=number],
form input[type=file],
form select,
form textarea {
  border: 2px solid #D1D6DC;

  background-color: 

  
  
    
  


  rgba(255, 255, 255, 1.0)

;
  color: #c8102e;
  border-radius: 3px;
}

/* Form placeholder text */

::-webkit-input-placeholder {
  color: #c8102e;
}

::-moz-placeholder {
  color: #c8102e;
}

:-ms-input-placeholder {
  color: #c8102e;
}

::placeholder {
  color: #c8102e;
}

/* Inputs - date picker */

.hs-fieldtype-date .input .hs-dateinput:before {
  color: #c8102e;
}

.fn-date-picker td.is-selected .pika-button {
  background: #c8102e;
}

.fn-date-picker td .pika-button:hover {
  background-color: #c8102e !important;
}

.fn-date-picker td.is-today .pika-button {
  color: #c8102e;
}

/* Submit button */

form input[type=submit],
form .hs-button {
  border: 1px none #c8102e;
;
  padding-top: 15px;
padding-right: 53px;
padding-bottom: 15px;
padding-left: 53px;
;
  font-family: Lato, sans-serif; font-style: normal; font-weight: normal; text-decoration: none;
  color: #FFFFFF;
  font-size: 22px;
  background-color: 

  
  
    
  


  rgba(200, 16, 46, 1.0)

;
  border-radius: 6px;
  text-transform: none;
}

form input[type=submit]:hover,
form input[type=submit]:focus,
form .hs-button:hover,
form .hs-button:focus {
  background-color: 

  
  
    
  


  rgba(26, 51, 78, 1.0)

;
  color: #ffffff;
  border: 1px none #1a334e;
;
}

form input[type=submit]:active,
form .hs-button:active {
  background-color: rgba(240, 56, 86, 1.0);
  border-color: #f03856;
}





/* Table */

table {
  border: 1px solid #c8102e;

  background-color: 

  
  
    
  


  rgba(255, 255, 255, 1.0)

;
}

/* Table cells */

td,
th {
  border: 1px solid #c8102e;

  padding: 18px;

  color: #c8102e;
}

/* Table header */

thead th {
  background-color: 

  
  
    
  


  rgba(200, 16, 46, 1.0)

;
  color: #FFFFFF;
}

/* Table footer */

tfoot td {
  background-color: 

  
  
    
  


  rgba(255, 255, 255, 1.0)

;
  color: #c8102e;
}





.header {
  background-color: 

  
  
    
  


  rgba(105, 105, 105, 1.0)

;
}

.menu__link,
.header__logo .logo-company-name,
.header__language-switcher-label-current,
.header__language-switcher .lang_list_class li a {
  color: #c8102e;
  font-family: Lato;
}

.menu__child-toggle-icon {
  border-top-color: #c8102e;
}

.menu .menu__link:hover,
.menu .menu__link:focus,
.header__language-switcher-label-current:hover,
.header__language-switcher-label-current:focus,
.header__language-switcher .lang_list_class li:hover a,
.header__language-switcher .lang_list_class li a:focus {
  color: #a00006;
}

.menu__child-toggle-icon:hover,
.menu__child-toggle-icon:focus {
  border-top-color: #a00006;
}

.menu .menu__link:active,
.header__language-switcher-label-current:active,
.header__language-switcher .lang_list_class li a:active {
  color: #f03856;
}

.menu__child-toggle-icon:active {
  border-top-color: #f03856;
}

.menu .menu__item--depth-1 > .menu__link--active-link:after {
  background-color: #c8102e;
}

@media (min-width: 767px) {
  .menu .menu__submenu,
  .header__language-switcher .lang_list_class {
    border: 2px solid #c8102e;

    background-color: 

  
  
    
  


  rgba(255, 255, 255, 1.0)

;
  }

  .menu__submenu--level-2 > .menu__item:first-child:before {
    border: 2px solid #c8102e;

    background-color: 

  
  
    
  


  rgba(255, 255, 255, 1.0)

;
  }
}

.menu__submenu .menu__link,
.menu__submenu .menu__link:hover,
.menu__submenu .menu__link:focus {
  color: #c8102e;
  background-color: 

  
  
    
  


  rgba(255, 255, 255, 1.0)

;
}

.header__language-switcher .lang_list_class:before {
  border-bottom-color: #c8102e;
}

.menu__submenu .menu__link:hover,
.menu__submenu .menu__link:focus,
.header__language-switcher .lang_list_class li:hover,
.menu__submenu--level-2 > .menu__item:first-child:hover:before,
.menu__submenu--level-2 > .menu__item:first-child.focus:before {
  background-color: 

  
  
    
  


  rgba(105, 105, 105, 1.0)

;
}

.header__language-switcher .lang_list_class.first-active::after {
  border-bottom-color: 

  
  
    
  


  rgba(105, 105, 105, 1.0)

;
}

.header__language-switcher-label-current,
.header__language-switcher .lang_list_class li a {
  font-family: Lato;
}

.header__language-switcher-label-current:after {
  border-top-color: #c8102e;
}

@media(max-width: 767px) {
  .header__navigation {
    background-color: 

  
  
    
  


  rgba(105, 105, 105, 1.0)

;
  }

  .header__navigation-toggle svg,
  .menu-arrow svg {
    fill: #c8102e;
  }
}

/* DDL */
.heroBannerContainer {
  z-index: 100; 
}






/* Footer content */
#click-to-chat {
    display: none; 
  }





.blog-post,
.blog-header__inner,
.blog-related-posts {
  padding: 80px 0;
}

/* Blog post */

.blog-post__meta a {
  color: #c8102e; 
}

.blog-post__tag-link {
  color: #c8102e;
}

.blog-post__tag-link:hover,
.blog-post__tag-link:focus {
  color: #a00006;
}

.blog-post__tag-link:active {
  color: #f03856;
}

/* Blog related posts */

.blog-related-posts__title-link,
.blog-related-posts__title-link:hover,
.blog-related-posts__title-link:focus,
.blog-related-posts__title-link:active {
  font-weight: 700; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  text-transform: none;
}

.blog-related-posts__title-link {
  color: #c8102e;
}

.blog-related-posts__title-link:hover,
.blog-related-posts__title-link:focus {
  color: #a00006;
}

.blog-related-posts__title-link:active {
  color: #f03856;
}

/* Blog comments */

.blog-comments {
  margin-bottom: 80px;
}

#comments-listing .comment-reply-to {
  color: #0270E0;
}

#comments-listing .comment-reply-to:hover,
#comments-listing .comment-reply-to:focus {
  color: #0048b8;
}

#comments-listing .comment-reply-to:active {
  color: #2a98ff;
}





.hs-search-results__title {
  font-weight: 700; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  color: #c8102e;
}





/* Blog listing */

.hs-blog-post-listing__post-title-link,
.hs-blog-post-listing__post-title-link:hover,
.hs-blog-post-listing__post-title-link:focus,
.hs-blog-post-listing__post-title-link:active {
  font-weight: 700; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  text-transform: none;
}

.hs-blog-post-listing__post-title-link {
  color: #c8102e;
}

.hs-blog-post-listing__post-title-link:hover,
.hs-blog-post-listing__post-title-link:focus {
  color: #a00006;
}

.hs-blog-post-listing__post-title-link:active {
  color: #f03856;
}


.hs-blog-post-listing__post-tag,
.hs-blog-post-listing__post-author-name {
  color: #c8102e;
}

/* Blog pagination */

.hs-pagination__link-text,
.hs-pagination__link--number {
  color: #c8102e;
}

.hs-pagination__link:hover .hs-pagination__link-text,
.hs-pagination__link:focus .hs-pagination__link-text,
.hs-pagination__link--number:hover,
.hs-pagination__link--number:focus {
  color: #a00006;
}

.hs-pagination__link:active .hs-pagination__link-text,
.hs-pagination__link--number:active {
  color: #f03856;
}

.hs-pagination__link-icon svg {
  fill: #c8102e;
}

/* Pricing card */

.card__price {
  font-weight: 700; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  color: #c8102e;
  font-size: 30px;
}

.card__body svg {
  fill: #c8102e;
}

/* Social follow */

.social-links__icon {
  background-color: #c8102e;
}

.social-links__icon:hover,
.social-links__icon:focus {
  background-color: #a00006;
}

.social-links__icon:active {
  background-color: #f03856;
  font-weight: 700; text-decoration: none; font-family: Merriweather, serif; font-style: normal;
  color: #c8102e;
  font-size: 30px;
}

/* DDL */
/* Breadcrumbs */
.breadcrumbs {
  position: absolute;
  top: 160px;
  left: 3.2rem;
  z-index: 100;
  color: #000000;
  font-size: 15px;
}
.hs-content-id-149607679539 .breadcrumbs,
.hs-content-id-149607678383 .breadcrumbs {
  color: #ffffff; 
}
/* Flags */ 
img.flag-us, img.flag-ca {
    width: 30px;
    padding-right: 5px;
}
.lang-us img.flag-ca {
    opacity: 0.5;
}
.lang-ca img.flag-us {
    opacity: 0.5; 
}
/* Typography */
h1.h1-main-title {
  font-size: 80px; 
  font-weight: 800; 
  color: #000000;
      line-height: 85px;
    margin-bottom: 20px;
}
h2.h2-main-subtitle {
  text-transform: uppercase; 
  color: #CF152D; 
  letter-spacing: 2px; 
  font-size: 24px; 
  font-weight: 800; 
  margin-bottom: 15px;
}
h2.h2-main-subtitle span {
  color: #000000; 
}
h3.h3-video-title {
  margin: 60px 0 -30px 0;
  padding: 0;
  color: black;
  font-weight: bold;
  font-size: 20px; 
}
.hero-paragraph {
  color: #6B7280; 
  margin-bottom: 25px; 
}
.tabs h3 {
  display: none; 
}
.tabs .distributor-sub h3 {
  display: block; 
}
/* Homepage Waves */
.anim-waves {
  margin-top: -280px;
}
.waves {
  width: 100%;
  position: relative;
  z-index: 100;
  height: 860px;
  overflow: visible;
  
}
.waves > div {
  display: block;
  width: 100%;
  height: 860px;
  position: absolute;
  top: 10%;
  left: 0;
}
.waves #wave-layer1 {
  background: transparent url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/JBW%20Refresh%202024/jbwave-layer1x.svg) 0 0 no-repeat;
  background-size: 100%;
  animation: wave1 1s linear infinite;
  animation-play-state: paused;
  animation-delay: calc(var(--scroll) * -1s);
  animation-iteration-count: 1;
  animation-fill-mode: both;
}
.waves #wave-layer2 {
  background: transparent url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/JBW%20Refresh%202024/jbwave-layer2.svg) -340px 0px no-repeat;
  background-size: 130%;
  margin: -180px 0 0 0;
  bottom: 0px;
  animation: wave2 1s linear infinite;
  animation-play-state: paused;
  animation-delay: calc(var(--scroll) * -1s);
  animation-iteration-count: 1;
  animation-fill-mode: both; 
}
@keyframes wave1 {
  to {
    transform: skewY(30deg);
  }
}
@keyframes wave2  {
  to {
    transform: skewY(40deg);
  }
}
.anim-points {
  /*margin-top: 50px;*/
  position: relative;
  
}
.anim-points > div:last-of-type {
  /*width: 50%;
  height: 800px;
  position: relative;
  padding: 0;
  margin: 0;*/
}
.anim-points > div {
  z-index: 150;
  
  width: 500px;
  display: block;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  
}
.anim-points #point1 {
  background: transparent url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/JBW%20Refresh%202024/jbwavepoint-layer1.svg) 0 0 no-repeat;
  background-size: contain;
  height: 700px;
  width: 1200px;

  transform: rotate(250deg) translate(0px, 0px) scale(1);

  animation: skew3 1s linear infinite;
  animation-play-state: paused;
  animation-delay: calc(var(--scroll) * -2s);
  animation-iteration-count: 1;
  animation-fill-mode: both;

  margin-top: 0px;
  margin-right: -700px;
}
.anim-points #point2 {
  background: transparent url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/JBW%20Refresh%202024/jbwavepoint-layer2.svg) 0 0 no-repeat;
  background-size: contain;
  height: 700px;
  width: 1200px;

  transform: rotate(250deg) translate(0px, 0px) scale(1);

  animation: skew4 1s linear infinite;
  animation-play-state: paused;
  animation-delay: calc(var(--scroll) * -2s);
  animation-iteration-count: 1;
  animation-fill-mode: both;

  margin-top: 0px;
  margin-right: -700px;
}

@keyframes skew3  {
  to {
    transform: rotate(390deg) translate(170px, 20%) scale(1.0);
    transform-origin: top right;
    margin-right: -400px;
  }
}
@keyframes skew4  {
  to {
    transform: rotate(390deg) translate(170px, 20%) scale(1.0);
    transform-origin: top right;
    margin-right: -400px;
  }
}
.mobile-chat {
  display: none; 
}
/**************************************
 * HERO SECTIONS
 * **********************************/
.hero-title-container {
  width: 50%; 
  margin-top: 70px;  
}

.hero-video-container {
     width: 50%;
    display: flex;
    /* text-align: center; */
    vertical-align: top;
    align-items: start;
    margin: 80px 0 0 40px; 
}
#homepage-dealer-video.hero-video-container {
    width: 100%;
    
    /* text-align: center; */
    vertical-align: top;
    align-items: center;
    justify-content: center;
    margin: 80px 0; 
}
.hero-video-container .video-play {
    max-width: 800px;
    width: 70%;
    vertical-align: top;
} 
.benefits-hero .video-play.show-mobile,
#homepage-dealer-video .video-play.show-mobile,
.video-play-container .video-play.show-mobile {
    display: none; 
}
.benefits-hero .video-play.show-desktop,
#homepage-dealer-video .video-play.show-desktop,
.video-play-container .video-play.show-desktop {
    display: block; 
}
.benefits-hero .video-play img,
#homepage-dealer-video .video-play img,
.video-play-container .video-play img {
    width: 100%;
    border-radius: 25px;
    border: 5px solid white;
    box-shadow: 2px 2px 10px #999999;
}
.hero-video-container.video-play.hideplaybutton:after {
    display:none; 
}
#video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: none;
  z-index: 10000;
  box-shadow: 0 0 500px black;
  border-radius: 25px;
  border: 5px solid white;
}
#video video {
  border-radius: 25px;
}
#close{
  font-size: 20px;
  width: 50px;
  height: 50px;
  text-align: center;
  line-height: 50px;
  background-color: #ffffff;
  border-radius: 100%;
  font-weight: bold;
  color: #000000;
  position: absolute;
  top: -25px;
  right: -25px;
  display: none
    z-index: 10001;
}
/* Red Arch */
.redarch {
  margin-top: -230px; 
  z-index: 101; 
  position: relative; 
}
/* Benefits */
.benefits-hero {
  background-image: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Website%20Images/jbwarranties-benefits-contractors-homeowners.jpg);
  background-size: 60%; 
  height: 30rem; 
  background-position: 100% 20%;
}
.benefits-hero .redarch {
  margin-top: -270px; 
}
/* Dealer & Homeowner Benefits */
.dealer-hero,
.homeowner-hero {
  clip-path: polygon(100% 0, 100% 100%, 50% 76%, 0 80%, 0 0); 
  z-index: 99; 
  height: 26rem;
}
.distributor-sub {
  padding: 25px 50px;
}
.distributor-sub h3 {
  text-align: center;
}
.distributor-sub img {
  width: 80%;
  margin: auto;
}
/* Plans */
.plans-hero {
  background-image: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/jb-plans-price-book-2025.png); 
  background-size: 80%; 
  height: 35rem; 
  background-position: 100% -130px; 
}
/* Finance */
.finance-hero {
  background-image: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Website%20Images/jbfin-hero.jpg); 
  background-size: cover; 
  height: 30rem; 
  background-position: 50% 50%; 
  clip-path: polygon(100% 0, 100% 91%, 50% 70%, 0 80%, 0 0); 
  z-index: 99; 
}
.hs-content-id-149607679890 .redarch {
  margin-top: -250px; 
}
.finance-content {
  margin-top: -80px; 
}
.finance-hero img {
    height: 180px;
    width: auto;
    
}
.finance-hero .h-full .logofin:first-of-type img {
    /*float: left;
    margin-left: 55% !important;*/
}
.finance-hero .h-full .logofin:last-of-type img {
    /*float: right;
    margin-right: 50% !important;*/
}
/* Careers */
.careers-hero {
  background-image: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Website%20Images/jbwarranties-careers.jpg); 
  background-size: 75%; 
  height: 30rem; 
  background-position: 100% 0; 
  clip-path: polygon(100% 0, 100% 100%, 50% 76%, 0 80%, 0 0); 
  z-index: 99; 
}
/* FAQs */
.faqs-hero {
  background-image: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Website%20Images/jbwarranties-faqs.jpg); 
  background-size: 100%; 
  height: 25rem; 
  background-position: 100% 0; 
  clip-path: polygon(100% 0,100% 95%,70% 76%,0 80%,0 0);
}
.faqs-content {
  margin-top: -120px; 
}
/* Contact */
.contact-hero {
  background-image: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Website%20Images/jbwarranties-contactus.jpg); 
  background-size: 100%; 
  height: 30rem; 
  background-position: 100% 0; 
  clip-path: polygon(100% 0, 100% 100%, 50% 76%, 0 80%, 0 0); 
  z-index: 99; 
}
/* Contact Homeowners */
.contact-homeowners-hero {
  background-image: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Website%20Images/jbwarranties-contactus-homeowners.jpg); 
  background-size: 100%; 
  height: 30rem; 
  background-position: 100% 0; 
  clip-path: polygon(100% 0, 100% 100%, 50% 76%, 0 80%, 0 0); 
  z-index: 99;
}
/* HVAC */
.hvac-hero {
  background-image: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Website%20Images/jbwarranties-hvac-warranty.jpg); 
  background-size: 100%; 
  height: 30rem; 
  background-position: 100% 0; 
  clip-path: polygon(100% 0, 100% 100%, 50% 76%, 0 80%, 0 0); 
  z-index: 99; 
}
/* Plumbing */
.plumbing-hero {
  background-image: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Website%20Images/jbwarranties-plumbing-warranty.jpg); 
  background-size: 100%; 
  height: 30rem; 
  background-position: 100% 0; 
  clip-path: polygon(100% 0, 100% 100%, 50% 76%, 0 80%, 0 0); 
  z-index: 99; 
}


/*********************************************************
 * 
 * 
 *  RESPONSIVE 
 * 
 * 
 * *****************************************************/

/****************************** 
 * EXTRA LARGE - 1700px+
 *****************************/
@media only screen and (min-width: 1500px) {
  .redarch img {
    width: 100% !important; 
  }
  .bgSharpGrayLx {
    margin-top: -250px !important; 
    overflow: visible !important;
  }
  .bgSharpGrayLx img.lg\:w-2\/4 {
    width: 80%;
  }
  .bgSharpGrayLx img.sm\:left-36 {
    left: 5rem; 
  }
  img.businesscard {
    position: absolute;
    right: 20%;
    width: 40%;
    top: 160px;
    z-index: 102;
  }
}
@media only screen and (max-width: 2000px) and (min-width: 1700px) {
  .anim-points #point1,
  .anim-points #point2 {
    margin-right: -970px;
  }
  .bgSharpGrayLx {
    margin-top: -450px !important; 
    overflow: visible !important;
  }
  .plans-hero {
    background-size: 73%; 
  }
  .finance-hero {
    clip-path: polygon(100% 0,100% 98%,50% 70%,0 80%,0 0); 
  }
  .faqs-hero {
    clip-path: polygon(100% 0,100% 100%,70% 76%,0 80%,0 0); 
  }
  .contact-homeowners-hero {
    background-position: 100% 50%; 
  }
}

@media only screen and (min-width: 2500px) {
  .contact-hero,
  .hvac-hero,
  .plumbing-hero {
    background-size: 60% !important; 
  }
  
  img.businesscard {
    width: 30%; 
  }
 
}
@media only screen and (min-width: 2500px) {
  .h1-main-title {
    font-size: 140px !important;
    line-height: 140px !important;
  }
  .bgWhiteOpx h2 {
    font-size: 50px; 
  }
  .bgWhiteOpx p {
    font-size: 35px;
  }
  .benefits-hero,
  .plans-hero,
  .contact-hero,
  .contact-homeowners-hero,
  .faqs-hero,
  .hvac-hero,
  .plumbing-hero {
    height: 48rem !important;  
  }
  .benefits-hero {
    background-position: 100% -150px; 
  }
  .contact-homeowners-hero {
    background-position: 100% 50%;
  }
  .dealer-hero,
  .homeowner-hero {
    height: 32rem !important; 
    clip-path: polygon(100% 0, 100% 100%, 50% 66%, 0 80%, 0 0) !important;
  }
  .plans-hero {
    background-size: 60% !important; 
  }
  .redarch {
    margin-top: -420px; 
  }
  .hs-content-id-149607679770 .redarch {
    margin-top: -360px !important; 
  }
  .hs-content-id-149607679539 main .redarch,
  .hs-content-id-149607678383 main .redarch {
    margin-top: -400px !important; 
  }
  .dealer-content {
    margin-top: -150px;
  }
  .homeowner-content {
    margin-top: -100px; 
  }
  .finance-hero {
    height: 55rem; 
    clip-path: polygon(100% 0, 100% 91%, 50% 70%, 0 75%, 0 0); 
  }
  .finance-content {
    margin-top: -180px; 
  }
  .hs-content-id-149607679890 .redarch {
    margin-top: -580px; 
  }
  .careers-hero {
    height: 50rem; 
  }
  .careers-content {
    margin-top: -150px !important; 
  }
  .home-hero.h-96 {
    height: 45rem !important; 
  }
  .home-hero.bg-right {
    background-position: 100% 20% !important; 
  }
  .home-hero.bg-contain {
    background-size: 75% !important; 
  }
  .home-hero .max-w-md {
    width: 58rem !important;
    max-width: 58rem !important;
  }
  .home-hero .md\:text-2xl {
    font-size: 4.5rem !important;
    line-height: 4rem !important;
  }
  .home-hero .xl\:ml-10 {
    margin-left: -6rem !important; 
  }
  .home-hero .textRed {
    margin-bottom: 20px !important; 
  }
  .anim-waves {
    margin-top: -600px !important; 
  }
  .waves, .waves>div {
    height: 1660px !important; 
  }
  .waves #wave-layer2 {
    margin-top: -380px !important;  
  }
  .bgSharpGrayLx {
    margin-top: -350px !important; 
  }
  .anim-points #point1, 
  .anim-points #point2 {
    margin-top: 500px !important; 
  }
  .dealer-hero, 
  .homeowner-hero {
    height: 37rem !important; 
  }
  .hs-content-id-149607678383 main .redarch, 
  .hs-content-id-149607679539 main .redarch {
    margin-top: -470px !important;
  }
}
@media only screen and (max-width: 3000px) and (min-width: 2500px) {
  .home-hero-content {
    margin-top: -150px !important; 
  }
  .bgSharpGrayLx {
    margin-top: -600px !important; 
  }
  .bgSharpGrayLx img.lg\:w-2\/4 {
    width: 100% !important; 
  }
  .bgSharpGrayLx img.sm\:left-36 {
    left: 0.5rem !important; 
  }
  .benefits-hero {
    height: 40rem !important;
    background-position: 100% 0;
    background-size: 70%;
  }
  .dealer-hero,
  .homeowner-hero {
    clip-path: polygon(100% 0,100% 82%,40% 56%,0 70%,0 0) !important; 
  }
  .plans-hero {
    background-size: 70% !important; 
  }
  .plans-hero .redarch {
    margin-top: -320px; 
  }
  .finance-hero {
    clip-path: polygon(100% 0,100% 81%,50% 60%,0 75%,0 0);
    background-position: 50% -180px !important;
  }
  .careers-hero {
    background-size: 90%; 
  }
  .hs-content-id-151873272921 .redarch {
    margin-top: -520px; 
  }
  img.businesscard {
    right: 25%; 
    top: 300px;
  }
  .contact-hero,
  .hvac-hero,
  .plumbing-hero {
    background-size: 90% !important; 
    clip-path: polygon(100% 0,100% 90%,55% 70%,0 80%,0 0);
  }
  .contact-homeowners-hero {
    clip-path: polygon(100% 0,100% 90%,55% 70%,0 80%,0 0);
  }
  .about-hero {
    background-size: 120% !important;
  }
  .hs-content-id-149602103604 .redarch {
    margin-top: -320px !important; 
  }
}
@media only screen and (min-width: 3600px) {
  .bgSharpGrayLx img.lg\:w-2\/4 {
    width: 100%; 
  }
  .bgSharpGrayLx img.sm\:left-36 {
    left: 0.5rem; 
  }
  .plans-hero {
    background-position: 100% -440px !important; 
  }
  .faqs-hero,
  .contact-hero,
  .hvac-hero,
  .plumbing-hero {
    clip-path: polygon(100% 0,100% 100%,70% 76%,0 80%,0 0); 
  }
  .benefits-hero .redarch, 
  .dealer-hero .redarch, 
  
  .hs-content-id-153291253373 .redarch,
  .hs-content-id-149607678222 .redarch,
  .hs-content-id-149607679833 .redarch
   {
    margin-top: -460px !important; 
  }
  .hs-content-id-149607679770 .redarch,
  
  .hs-content-id-149607679833 .redarch {
    margin-top: -480px !important; 
  }
  .hs-content-id-149602103689 .redarch {
    margin-top: -555px !important; 
  }
    .about-hero {
    background-size: 100% !important;
      height: 65rem !important;
      background-position: 50% 80% !important;
  }
  .hs-content-id-149602103604 .redarch {
      margin-top: -470px !important;
  }
}
@media only screen and (max-width: 2499px) and (min-width: 2181px) {
  .dealer-hero,
  .homeowner-hero {
    height: 28rem !important;
    clip-path: polygon(100% 0,100% 100%,50% 66%,0 80%,0 0);
  }
  .hs-content-id-149607679539 .redarch,
  .hs-content-id-149607678383 .redarch {
    margin-top: -290px;
  }
  .plans-hero {
    background-size: 63%; 
    background-position: 100% -125px;
  }
}
@media only screen and (max-width: 2180px) and (min-width: 1921px) {
  .dealer-hero,
  .homeowner-hero {
    height: 26rem !important;
    clip-path: polygon(100% 0,100% 100%,50% 66%,0 80%,0 0);
  }
  .hs-content-id-149607679539 .redarch,
  .hs-content-id-149607678383 .redarch {
    margin-top: -260px;
  }

}
@media only screen and (min-width: 2160px) {
  .waves, .waves>div {
    height: 1160px; 
  }
  .contact-hero .redarch,
  .hvac-hero .redarch,
  .plumbing-hero .redarch {
    margin-top: -290px;
  }
}
@media only screen and (max-width: 2135px) {
  .waves, .waves>div {
    height: 1160px; 
  }

}
@media only screen and (min-width: 1920px) {
  @-ms-viewport{
    width: 1920px;
  }
  .about-hero {
    background-position: 50% 70%!important;
  }
}
@media only screen and (max-width: 1850px) {
  .plans-hero {
    background-size: 79%;
  }
    .finance-hero {
    clip-path: polygon(100% 0,100% 98%,50% 70%,0 80%,0 0); 
  }
  .dealer-hero,
  .homeowner-hero {
    clip-path: polygon(100% 0,100% 100%,50% 66%,0 80%,0 0); 
  }
  .about-hero {
    background-position: 0 80% !important; 
  }
}
@media only screen and (max-width: 2135px) {
  .about-hero {
    background-position: 50% 63%!important; 
  }
}
@media only screen and (max-width: 1700px) {
  .dealer-hero,
  .homeowner-hero {
    clip-path: polygon(100% 0,100% 100%,50% 76%,0 80%,0 0); 
  }
  .finance-hero {
    clip-path: polygon(100% 0,100% 98%,50% 80%,0 80%,0 0); 
  }
  .faqs-hero {
    clip-path: polygon(100% 0,100% 95%,70% 80%,0 80%,0 0);
  } 
  
}
@media only screen and (min-width: 1930px) {
  .plans-hero {
    background-size: 65%;
  }
  
  .contact-hero .redarch,
  .hvac-hero .redarch,
  .plumbing-hero .redarch {
    margin-top: -290px;
  }
  
  .faqs-hero,
  .contact-homeowners-hero,
  .hvac-hero {
    clip-path: polygon(100% 0,100% 100%,60% 70%,0 80%,0 0); 
  }
  .finance-hero {
    clip-path: polygon(100% 0,100% 100%,50% 70%, 0% 75%,0 0); 
  }
  .contact-hero {
    clip-path: polygon(100% 0,100% 91%,60% 70%,0 80%,0 0); 
  }
  
  .hs-content-id-149607678222 .redarch,
  
  .hs-content-id-153291253373 .redarch {    
    margin-top: -290px;
  }
  .benefits-hero {
    background-size: 50%; 
  }
}
@media only screen and (min-width: 2500px) {
  .finance-hero {
    clip-path: polygon(100% 0,100% 80%,70% 65%,0 65%,0 0); 
  }
}
@media only screen and (max-width: 2400px) and (min-width: 2200px) {
  .plans-hero {
    background-size: 59%; 
  }
  
}
/****************************** 
 * LARGE - 1200px - 1699px
 *****************************/
@media only screen and (max-width: 1699px) {
  /*.benefits-hero .redarch,*/
  .plans-hero {
    /*background-position: 100% -100px !important; */
  }
  .plans-hero .redarch {
    margin-top: -300px !important; 
  }
  .plans-list {
    margin-top: 0px !important; 
  }
  .redarch {
    margin-top: -200px !important; 
  }
  .hs-content-id-151873272921 .redarch {
    
  }
  img.businesscard {
    position: absolute;
    right: 20%;
    width: 40%;
    top: 160px;
    z-index: 102;
  }
  .home-hero-content {
    
  }
  .bgSharpGrayLx {
    margin-top: -650px !important; 
    overflow: visible !important;
  }
  .hvac-hero .hero-title-container {
     width: 70%;
  }
  .hs-content-id-149607679770 .redarch {
    margin-top: -245px !important; 
  }
  /*.anim-waves {
    margin-top: -180px !important; 
  }
  .waves, .waves>div {
    height: 560px !important; 
  }
  #wave-layer2 {
    background-size: 160% !important; 
  }
  .bgSharpGrayLx {
    margin-top: -250px !important; 
    overflow: visible !important;
  }
  .bgSharpGrayLx img.lg\:w-2\/4 {
    width: 100%;
  }
  .bgSharpGrayLx img.sm\:left-36 {
    left: .5rem; 
  }*/
}
@media only screen and (max-width: 1500px) {
  .bgSharpGrayLx { 
    overflow: visible !important; 
  }
  .bgSharpGrayLx img.lg\:w-2\/4 {
    width: 90%;
  }
  .bgSharpGrayLx img.sm\:left-36 {
    left: .5rem; 
  }
  .anim-points #point1,
  .anim-points #point2 {
    margin-right: -970px;
  }
  .benefits-hero {
    height: 27rem; 
  }
  .dealer-hero, .homeowner-hero {
    clip-path: polygon(100% 0,100% 100%,50% 72%,0 80%,0 0); 
  }
  .plans-hero {
    background-size: 85%; 
  }
  .hs-content-id-149607679890 .redarch {
    margin-top: -200px !important;
  }
  .finance-hero .h-full .logofin:first-of-type img {
    margin-left: 45% !important; 
  }
  .finance-hero .h-full .logofin:last-of-type img {
    margin-right: 40% !important; 
  }
  .careers-hero {
    height: 27rem !important;
    background-size: 98%;
  }
  img.businesscard {
    top: 180px; 
  }
}
@media only screen and (max-width: 1380px) {
  .benefits-hero {
    background-size: 75%; 
  }
  .plans-hero {
    background-size: 70%;
  }
  .dealer-hero, .homeowner-hero {
    clip-path: polygon(100% 0,100% 100%,67% 75%,0 80%,0 0); 
  }
  .careers-hero {
    background-size: 100%; 
  }
  img.businesscard {
    top: 220px; 
  }
  .hs-content-id-149602103689 .redarch,
  .hs-content-id-153291253373 .redarch,
  .hs-content-id-149607679833 .redarch {  
    margin-top: -250px !important;
  }
  .contact-hero,
  .contact-homeowners-hero,
  .hvac-hero,
  .plumbing-hero {
    clip-path: polygon(100% 0,100% 90%,50% 70%,0 80%,0 0);  
  }
}
@media only screen and (max-width: 1290px) {
  .plans-hero {
    background-size: 92%;
  }
  .finance-hero {
    clip-path: polygon(100% 0,100% 90%,50% 70%,0 80%,0 0); 
  }
}




/****************************** 
 * MEDIUM - 500px - 1199px
 *****************************/
@media only screen and (max-width: 1030px) and (min-width: 780px) {
  .heroBannerContainer {
    margin-top: 100px !important;
  }
  .breadcrumbs {
    top: 140px; 
  }
  h1.h1-main-title {
    font-size: 70px;
    line-height: 75px;
  }
  .hero-title-container {
    margin-top: 90px; 
  }
  .contact-homeowners-hero,
  .contact-hero,
  .hvac-hero,
  .plumbing-hero {
     background-size: 130%;
    clip-path: polygon(100% 0,100% 83%,50% 70%,0 80%,0 0);
  }
  .contact-hero,
  .hvac-hero,
  .plumbing-hero {
    background-position: 70% 50%; 
  }
}


/****************************** 
 * SMALL - <500px
 *****************************/
@media only screen and (max-width: 500px) {

}
@media only screen and (max-width: 450px) {
  .hero-video-container .video-play {
    width: 100%; 
  }
  .benefits-hero .video-play.show-mobile {
      display: block; 
      margin-bottom: 30px;
  }
  .benefits-hero .video-play.show-desktop {
      display: none; 
  }
  .benefits-hero .bgWhiteOpx .h-full.flex.w-full {
    flex-direction: column;  
  }
  .benefits-hero .bgWhiteOpx .video-play {
    width: 100%; 
  }
  #click-to-chat {
    display: block; 
    text-align: center;
    margin: 0 30px 60px 30px;
  }
  .WidgetWrapper__Wrapper-sc-1bv4zy4-0.ctHpde,
  #hubspot-messages-iframe-container iframe#hubspot-conversations-iframe {
    height: 0px !important; 
  }
  #hubspot-messages-iframe-container iframe#hubspot-conversations-iframe.displaynow {
    height: auto !important;
    min-height: 400px !important;
  }
  .mobile-chat {
    
  }
  .mobile-chat a {
    font-size: 0px;
  }
  h1.h1-main-title {
     font-size: 62px;
     line-height: 70px;
     padding-bottom: 15px;
  }
  .contact-hero .hero-title-container,
  .contact-homeowners-hero .hero-title-container,
  .plans-hero .hero-title-container,
  .faqs-hero .hero-title-container,
  .hvac-hero .hero-title-container,
  .plumbing-hero .hero-title-container {
     margin-top: 70px !important;
  }
  .plans-hero {
    background-position: 100% 81%;  
    background-size: 85% !important;
  }

  .heroBannerContainer {
    margin-top: 95px !important;  
  }
  .home-hero {
    background-image: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Website%20Images/jbw-contractors-homeowners-mobile.jpg) !important;
    background-position: bottom center !important;
    background-size: contain;
    position: relative;
    padding-bottom: 200px;
    padding-top: 100px;
    height: 35rem !important;
  }
  .home-hero-content {
    
  }
  .waves,
  .anim-points,
  .breadcrumbs,
  img.businesscard {
    display: none;
  }
  .bgSharpGrayLx {
    margin-top: 150px !important; 
    padding-top: 150px !important;
  }
  .bgSharpGrayLx > div > div:first-of-type {
    margin-top: 300px; 
  }
  .bgSharpGrayLx > div > div:nth-of-type(2) {
    margin-bottom: 210px;
  }
  .bgSharpGrayL > div > div:first-of-type img {
    width: 100%; 
  }
  .hs-content-id-149607678383 .bgSharpGrayL > div > div:nth-of-type(2) {
    margin-bottom: 500px;
  }
  .bgWhiteOpx > div > div {
    width: 90% !important;
    margin: auto;
  }
  .finance-hero .bgWhiteOpx > div > div {
    display: none; 
  }
  .bgWhiteOpx .redarch {
    margin-top: -200px !important;
  }
  .plans-hero .redarch {
    margin-top: -160px !important; 
  }
  .benefits-hero {
    background-image: none !important;
    height: auto !important;
    margin-top: 180px;
  }
  .contact-hero,
  .contact-homeowners-hero,
  .careers-hero,
  .faqs-hero,
  .hvac-hero,
  .plumbing-hero{
    background-image: none !important;
    height: 27rem !important;
  }
  .hvac-hero {
    background-image: none !important;
    height: 39rem !important;
  }
  .plumbing-hero {
    height: 33rem!important; 
  }
  .contact-hero {
    height: 30rem!important; 
  }
  .contact-homeowners-hero {
    height: 22rem !important;
    clip-path: none; 
  }
  .about-hero {
    background-image: url('https://40090477.fs1.hubspotusercontent-na1.net/hubfs/40090477/jbw-images/jbw-about-us-team.jpg') !important;
    background-position: top center !important;
    height: 14rem !important;
    clip-path: none !important;
  }
  .hs-content-id-149602103604 .redarch {
    display: none; 
  }
  .faqs-hero {
    height: 23rem !important; 
  }
  .faqs-content {
    margin-top: -50px; 
  }
  .benefits-hero .redarch {
    margin: 50px 0 !important; 
  }
  
  .dealer-hero{
    clip-path: polygon(100% 0,100% 100%,47% 91%,0 100%,0 0);
    height: 21rem !important;
  }
  .benefitsCars {
    width: 80%;
    margin-top: 30px;
  }
  .homeowner-hero {
    clip-path: polygon(100% 0,100% 100%,47% 92%,0 100%,0 0);
    height: 24rem !important;
  }
  .hs-content-id-149607679539 .redarch,
  .hs-content-id-149607678383 .redarch {
    /*display: none; */
    margin-top: -50px !important;
  }
  .hs-content-id-149607679539 .h1-main-title,
  .hs-content-id-149607678383 .h1-main-title,
  .hs-content-id-149607679833 .h1-main-title {
    padding-top: 20px;
    font-size: 55px;
    line-height: 65px;
  }
  .hs-content-id-149607679539 main > section:nth-of-type(2) .h-14,
  .hs-content-id-149607678383 main > section:nth-of-type(2) .h-14 {
    height: auto;
  }
  .hs-content-id-149607678383 main > section:nth-of-type(3) {
    padding-top: 0px !important; 
  }
  .hs-content-id-149607678383 .bgSharpGrayR {
    padding-top: 0px; 
  }
  .hs-content-id-149607679770 section:nth-of-type(2),
  .hs-content-id-149607679770 section:nth-of-type(4),
  .hs-content-id-149607679770 .bgSharpGrayL,
  .hs-content-id-149607679833 section:nth-of-type(2) {
    padding: 30px 20px 0 20px !important;  
  }
  .homeowner-content {
    padding-bottom: 2rem !important; 
  }
  .finance-hero {
    height: 13rem !important; 
    background-size: 130%;
    clip-path: none;
  }
  .finance-hero h1 img {
    width: 60%;
  }
  .hs-content-id-149607679890 #main-content > section.py-24 {
    padding-bottom: 0; 
  }
  .hs-content-id-149607679890 .redarch,
  .hs-content-id-153291253373 .redarch {
    display: none !important; 
  }
  .plans-list {
    margin-top: 0px !important; 
  }

  /* Dealer Benefits */
  .tabs h3 {
    display: block;
    font-size: 45px;
    font-weight: bold;
    color: #000000;
    margin-bottom: 20px;
  }
  .tabs .vertLine,
  .tabs .grid img,
  .tabs .jbBtnTab {
    display: none; 
  }
  .tabs .content-drop {
    display: block; 
  }
  .tabs .panel {
    border: 0px; 
  }
  .tabs .shadow-lg {
    box-shadow: none; 
  }
  .tab-contractors h3:before {
    content: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Icons/own-the-home.svg); 
    text-align: center;
    width: 100%;
    display: block;
  }
  .tab-distributors h3:before {
    content: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Icons/differentiators.svg); 
    text-align: center;
    width: 100%;
    display: block;
  }
  .tab-oems h3:before {
    content: url(https://6444610.fs1.hubspotusercontent-na1.net/hubfs/6444610/Icons/valuation.svg); 
    text-align: center;
    width: 100%;
    display: block;
  }
  
  .distributor-sub {
    padding: 20px 0 !important;
  }
  .distributor-sub h3 {
    font-size: 20px; 
  }
  .distributor-sub img {
    width: 100% !important; 
  }
  .finance-2col > div,
  .homeowner-content > div {
    flex-direction: column; 
  }
  .finance-2col > div > div,
  .homeowner-content > div > div {
    width: 100% !important; 
  }
}
@media only screen and (max-width: 400px) {
  .dealer-hero{
    clip-path: polygon(100% 0,100% 100%,47% 91%,0 93%,0 0); 
  }
  .homeowner-hero {
    clip-path: polygon(100% 0,100% 100%,47% 94%,0 94%,0 0); 
  }
}

/* Blog / info.jbwarranties.com */
.custom-blog-content .post-body p {
  color: #000000; 
}