.elementor-576 .elementor-element.elementor-element-299e278{--display:flex;--min-height:300px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:flex-start;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--overflow:hidden;--padding-top:100px;--padding-bottom:100px;--padding-left:0px;--padding-right:0px;}.elementor-576 .elementor-element.elementor-element-299e278:not(.elementor-motion-effects-element-type-background), .elementor-576 .elementor-element.elementor-element-299e278 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rebelroofingus.com/wp-content/uploads/2026/02/banner_areas.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-widget-breadcrumbs{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );text-transform:var( --e-global-typography-secondary-text-transform );}.elementor-576 .elementor-element.elementor-element-b34f151{width:100%;max-width:100%;font-family:"Manrope", Sans-serif;font-size:19px;font-weight:500;line-height:25px;color:#FFFFFF;}.elementor-576 .elementor-element.elementor-element-b34f151.elementor-element{--align-self:center;}.elementor-576 .elementor-element.elementor-element-b34f151 a{color:#FFFFFFD9;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );text-transform:var( --e-global-typography-primary-text-transform );color:var( --e-global-color-primary );}.elementor-576 .elementor-element.elementor-element-49af244{width:var( --container-widget-width, 50% );max-width:50%;--container-widget-width:50%;--container-widget-flex-grow:0;text-align:start;}.elementor-576 .elementor-element.elementor-element-49af244 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:60px;font-weight:bold;line-height:70px;color:#FFFFFF;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-576 .elementor-element.elementor-element-d37d61b{width:var( --container-widget-width, 40% );max-width:40%;--container-widget-width:40%;--container-widget-flex-grow:0;font-family:"Manrope", Sans-serif;font-size:16px;font-weight:500;line-height:24px;color:var( --e-global-color-e0be29b );}.elementor-576 .elementor-element.elementor-element-bb3916b{--display:flex;--padding-top:60px;--padding-bottom:120px;--padding-left:0px;--padding-right:0px;}.elementor-576 .elementor-element.elementor-element-0e928e4{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}@media(min-width:1201px){.elementor-576 .elementor-element.elementor-element-299e278:not(.elementor-motion-effects-element-type-background), .elementor-576 .elementor-element.elementor-element-299e278 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:scroll;}}@media(max-width:1200px){.elementor-576 .elementor-element.elementor-element-49af244{width:var( --container-widget-width, 80% );max-width:80%;--container-widget-width:80%;--container-widget-flex-grow:0;}.elementor-576 .elementor-element.elementor-element-d37d61b{--container-widget-width:60%;--container-widget-flex-grow:0;width:var( --container-widget-width, 60% );max-width:60%;}}@media(max-width:1024px){.elementor-576 .elementor-element.elementor-element-49af244 .elementor-heading-title{font-size:40px;line-height:50px;}.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}}@media(max-width:880px){.elementor-576 .elementor-element.elementor-element-b34f151{font-size:16px;}}@media(max-width:767px){.elementor-576 .elementor-element.elementor-element-299e278{--min-height:220px;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:50px;--padding-bottom:50px;--padding-left:20px;--padding-right:20px;}.elementor-576 .elementor-element.elementor-element-49af244{width:100%;max-width:100%;}.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-576 .elementor-element.elementor-element-d37d61b{width:100%;max-width:100%;}.elementor-576 .elementor-element.elementor-element-bb3916b{--padding-top:50px;--padding-bottom:50px;--padding-left:20px;--padding-right:20px;}}/* Start custom CSS for shortcode, class: .elementor-element-6993a84 *//* area Grid Wrapper */
#area_loop .area-grid-wrapper {
   width: 100%;
   margin: 0 auto;
}

#area_loop .area-swiper {
   width: 100%;
}

/* area Card */
#area_loop .area-card {
   background: #fff;
   border-radius: 10px;
   overflow: hidden;
   box-shadow: 0px 2px 40px 0px #0F0F0F0D;
   transition: transform 0.3s ease, box-shadow 0.3s ease;
   height: 100%;
}

#area_loop .area-card:hover {
   box-shadow: 0px 4px 60px 2px #0F0F0F0D;
}

#area_loop .area-card-link {
   text-decoration: none;
   color: inherit;
   display: block;
   height: 100%;
}

#area_loop .area-image {
   width: 100%;
   height: 200px;
   overflow: hidden;
}

#area_loop .area-image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.3s ease;
}

#area_loop .area-card:hover .area-image img {
   transform: scale(1.05);
}

#area_loop .area-content {
   padding: 20px;
   display: flex;
   flex-direction: column;
   align-items: center;
}

#area_loop .area-cta {
   padding-top: 24px;
   color: #C01C2D;
   font-weight: bold;
   font-size: 14px;
   line-height: 150%;
   text-align: center;
   text-transform: uppercase;
   text-decoration: underline;
   text-decoration-style: solid;
   display: flex;
   gap: 10px;
   align-items: center;
}

#area_loop .area-title {
   font-weight: 700 !important;
   font-size: 20px !important;
   line-height: 150%;
   text-transform: capitalize !important;
   margin: 0!important;
   color: #052847;
}

#area_loop .area-description {
   font-size: 14px;
   color: #52677A;
   line-height: 1.5;
   margin: 0;
   font-weight: 500;
}

/* Rating Card */
#area_loop .raging__flex {
   display: flex;
   gap: 16px;
   align-items: center;
   justify-content: center;
}

#area_loop .rating-card {
   background: transparent;
   display: flex;
   align-items: center;
   justify-content: center;
   box-shadow: none;
}

#area_loop .rating-card:hover {
   box-shadow: none;
}

#area_loop .rating-content {
   text-align: center;
   display: flex;
   flex-direction: column;
   gap: 40px;
   justify-content: center;
   align-items: center;
}

#area_loop .rating-logo {
   display: flex;
   justify-content: center;
}

#area_loop .rating-stars {
   display: flex;
   justify-content: center;
   gap: 4px;
   flex-direction: column;
}

#area_loop .rating-text {
   font-size: 16px;
   font-weight: bold;
   color: #094377;
}

#area_loop .rating-button {
   display: inline-flex;
   align-items: center;
   gap: 10px;
   background: #C01C2D;
   color: #fff !important;
   padding: 14px 20px;
   border-radius: 8px;
   text-decoration: none;
   font-weight: bold;
   font-size: 16px;
   text-transform: uppercase;
   transition: background 0.3s ease;
   font-family: "Plus Jakarta Sans", Sans-serif !important;
}

#area_loop .rating-button:hover {
   background: #094377;
}

/* MOBILE */
@media (max-width: 767px) {
   
   #area_loop .swiper-button-next, 
   #area_loop .swiper-button-prev {
       bottom: 15px!important;
       top: auto!important;
   }
   
   #area_loop .swiper-button-next, 
   #area_loop .swiper-rtl .swiper-button-prev {
       right: 20px!important;
   }
   
   #area_loop .swiper-button-prev, 
   #area_loop .swiper-rtl .swiper-button-next {
       left: 20px!important;
   }
   
   #area_loop .area-swiper {
       padding-bottom: 80px;
   }
   
   #area_loop .swiper-button-prev,
   #area_loop .swiper-button-next {
       width: 40px !important;
       height: 40px !important;
       background: #fff !important;
       border-radius: 50% !important;
       color: #fff !important;
       box-shadow: 0px 2px 10px 0px #0943770D;
   }
   
   #area_loop .swiper-button-prev:after {
       font-size: 20px !important;
       background-image: url(https://rebelroofingus.com/wp-content/uploads/2026/01/arrow__blue.svg);
       object-fit: contain;
       background-repeat: no-repeat;
       color: transparent;
       width: 20px;
       height: auto;
       transform: rotate(180deg);
   }

   #area_loop .swiper-button-next:after {
       font-size: 20px !important;
       background-image: url(https://rebelroofingus.com/wp-content/uploads/2026/01/arrow__blue.svg);
       object-fit: contain;
       background-repeat: no-repeat;
       color: transparent;
       width: 20px;
       height: auto;
   }
   
   #area_loop .swiper-pagination {
       bottom: 20px !important;
       z-index: 7!important;
   }
   
   #area_loop .swiper-pagination-bullet {
       width: 20px;
       height: 20px;
       background: #C9D9E8;
       opacity: 1;
   }
   
   #area_loop .swiper-pagination-bullet-active {
       background: #094377;
       width: 20px;
       height: 20px;
       box-shadow: 1px 1px 5px 4px #C9D9E8;
   }
   
   #area_loop .desktop-only-slide {
       display: none;
   }
}

/* TABLET */
@media (min-width: 768px) {
   #area_loop .swiper-wrapper {
       display: grid !important;
       grid-template-columns: repeat(2, 1fr);
       gap: 24px;
       transform: none !important;
   }
   
   #area_loop .swiper-slide {
       width: auto !important;
       margin: 0 !important;
   }
   
   #area_loop .area-cta {
       display: none;
   }
   
   #area_loop .area-image {
       height: 220px;
   }
   
   #area_loop .desktop-only-slide {
       display: block;
   }
   
   #area_loop .swiper-button-prev,
   #area_loop .swiper-button-next,
   #area_loop .swiper-pagination {
       display: none !important;
   }
}

/* DESKTOP */
@media (min-width: 1024px) {
   #area_loop .swiper-wrapper {
       grid-template-columns: repeat(3, 1fr);
       padding: 20px 0;
   }
}/* End custom CSS */
/* Start custom CSS */body.elementor-page-576 .swiper-wrapper {
    gap: 24px;
    display: flex;
    flex-direction: column;
}/* End custom CSS */