/*
Theme Name: Roofex
Theme URI: http://roofex.casethemes.net/
Author: Case-Themes
Author URI: https://themeforest.net/user/case-themes/
Description: Roofex is a WordPress theme perfect for metal roofexg, industrial roofexg, construction, exterior, maintenance, painting, remodelling, renovation, repair service, roof repair, roofers, roofexg, roofexg company, roofexg service, siding websites. The theme comes with creative 05 homepage design layouts for more websites. WordPress theme is made by Elementor page builder which is very easy to customize and it has a lot of features and a very strong admin panel for any client to make a good website. Get Roofex Theme now!
Version: 1.0.7
License: ThemeForest
License URI: https://themeforest.net/licenses
Text Domain: roofex
Tags: construction, exterior, maintenance, painting, remodelling, renovation, repair service, roof repair, roofers, roofexg, roofexg company, roofexg service, siding
*/

@import url('https://fonts.googleapis.com/css2?family=Funnel+Display:wght@300..800&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');
/* Load Noto Sans for Hawaiian characters */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap');


/* Specific heading fix */
.elementor-486 .elementor-element-dccbd5e .pxl-item--title {
    font-family: "Funnel Display", "Noto Sans", 
    "Arial Unicode MS", sans-serif !important;
}
selector .pxl-item--title {
    font-family: "Funnel Display", "Noto Sans", 
    "Arial Unicode MS", sans-serif !important;
}
selector .pxl-item--title::after {
    content: none;
}
body{
    font-family: "Nunito Sans", sans-serif !important;
}
h1, h2, h3, h4, h5, h6{
font-family: "Funnel Display", sans-serif;
    
}
.bafg-twentytwenty-container img {
    margin: 0;
    width: 100%;
    height: 300px !important;
}
.process-sec h3 {
    pointer-events: all;
    pointer-events: none;
    cursor: default;
}
.wrap-ctf1 .input-wrap {
  display: flex;
  align-items: center;
  gap: 10px; /* space between input and button */
}

.wrap-ctf1 input[type="text"] {
  flex: 1; /* input takes available space */
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
}

.wrap-ctf1 button {
  padding: 10px 20px;
  background: #0073e6;
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}

.newsletter-sec .pxl-contact-form1 .wpcf7-form-control:not(.wpcf7-submit), .pxl-contact-form1 .pxl-select-higthlight {
    background-color: transparent;
    color: white;
    border: 2px solid;
}

.pxl-select-options li:first-child {
    color: #00585f;
    pointer-events: none;
    border-bottom: 1px solid #00585f29;
}
.twentytwenty-before-label, .twentytwenty-after-label {
    background: none !important;
    font-family: "Nunito Sans";
	    font-weight: 800;
}
/* Prevent horizontal scroll on mobile */
html, body {
  overflow-x: hidden;
  max-width: 100%;
}

/* Fix common element overflow */
img, iframe {
  max-width: 100%;
  height: auto;
}
.pxl-text-editor p {
    margin-bottom: 10px !important;
}

.why-hawaii .pxl-item--desc{
    min-height: 290px;
}
.why-hawaii .pxl-swiper-slide .pxl-item--inner{
        padding: 48px 30px 48px 30px;
        background-color:#f5fced;
}
.why-hawaii .pxl-item--icon {
    margin-bottom: 20px;
    /* background-color: aqua; */
    /* padding: 20px; */
}
.why-hawaii .pxl-item--desc{
    text-align: justify;
}
.process-sec .pxl-item--icon {
    display: flex;
    justify-content: center; /* horizontally */
    align-items: center;     /* vertically */
    /* height: 150px; */           /* set container height */
}

.process-sec .pxl-item--icon svg {
    width: 70px;
    height: 70px;
}

.process-sec-1 h3 {
    margin-bottom: 0px;
    background-color: #6d9d46;
    width: max-content;
    padding: 10px 20px;
    color: #ffffff !important;
    border-radius: 5px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    margin-left: -8px;
    text-transform: uppercase;
}
.process-sec-1 .elementor-widget-wrap {
    border: 1px solid #f0f0f0;
    padding: 23px !important;
    border-bottom: 5px solid #055960;
    background-color: #f5f5f5;
    border-radius: 10px;
}
.process-sec-1 .pxl-icon-box9 {
    text-align: left;
}
.problem-roof .pxl-item--inner{
        justify-content: left;
}
.problem-roof .btn-video{
    display: none;
}
.families-across .pxl-item--title span{
    color: #6d9d46 !important;
}
.why-choose .pxl-item--desc {
    min-height: 80px;
}
.why-choose .pxl-item--icon{
    margin-top: 20px;
}
.process-sec .pxl-item--title a {
    cursor: context-menu;
}
.service-list .pxl-image-box4 .pxl-item--inner .pxl-item-image{
    flex-shrink: 0;
}
.problem-roof .pxl-item--inner .pxl-item-image{
    flex-shrink: 0;
}
.we-promise h3 a {
    font-size: 19px;
    cursor: default;
}
.we-promise svg {
    width: 60px;
    height: 60px;
}
.process-sec-2 .elementor-widget-wrap {
    border: 1px solid #f0f0f0;
    padding: 23px !important;
    border-bottom: 5px solid #055960;
    background-color: #f5f5f5;
    border-radius: 10px;
}
.smart-plan .pxl-item--title{
    font-size: 20px;
}
.smart-plan .pxl-icon-box6 {
    box-shadow: none;
    padding: 26px 10px 28px 10px;
    border: 3px solid #00585f;
    border-radius: 5px;
    background-color: #00585f;
}
.smart-plan .bg-image{
    display: none;
}
.smart-plan .pxl-icon-box .pxl-item--title {
    background-color: #6d9d46;
    /* color: #555; */
    padding-bottom: 10px;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 5px;
    padding-top: 10px !important;
    font-size: 17px;
}
.we-offer .elementor-image-box-wrapper {
    background-color: #055960;
    padding: 10px;
    color: white;
    /* border-radius: 10px; */
}
.we-offer .elementor-image-box-img{
    border: 5px solid #fff;
}
.we-offer .elementor-image-box-description {
    color: white;
}
.menu-item-13761{
    display: none !important;
}
.monier-we-offer-sec h3{
    height: 83px;
}
.monier-we-offer-sec p{
    height: 77px !important;
}
.we-offer wood-shake-we-offer-sec{
    height: 130px !important;
}
.why-choose .pxl-item--meta .pxl-item--title {
    height: 70px;
}









@media only screen and (min-width: 700px) and (max-width: 767px) {
	.why-choose .pxl-item--desc {
    	min-height: 140px;
	}
}

@media only screen and (min-width: 768px) and (max-width: 821px) {
	.why-choose .pxl-item--desc {
    	min-height: 180px;
	}
}

@media only screen and (min-width: 992px) and (max-width: 1024px) {
	.why-choose .pxl-item--desc {
    	min-height: 200px;
	}
}



@media (max-width: 1199px) {
    .menu-item-13761{
    display: block !important;
}
}
@media (max-width: 767px) {
	.wrap-ctf1 .input-wrap {
		display: block;
	}
	
.monier-we-offer-sec h3{
    height: auto;
}
.monier-we-offer-sec p{
    height: auto !important;
}
	.why-choose .pxl-item--meta .pxl-item--title {
    height: auto !important;
}
.we-offer wood-shake-we-offer-sec{
    height: auto !important;
}
.elementor-widget-icon-box.elementor-mobile-position-top .elementor-icon-box-wrapper {
        align-items: center !important;
        flex-direction: unset;
        gap: var(--icon-box-icon-margin, 15px);
        text-align: center;
    }
    .cta-sec .pxl-image-box1 .wrap-content{
            position: inherit;
    }
    .families-across .pxl-item--inner{
        text-align: center;
    }
}
.testimonial-sec .pxl-item--desc{
    min-height: 390px;
}
/*===========*/
.we-offer .elementor-image-box-wrapper {
  padding: 30px !important;  
}

.we-offer h3.elementor-image-box-title {
  position: relative;
  display: inline-block;
  padding-bottom: 10px;
  font-family: "Nunito Sans", Sans-serif !important;
  font-size: 23px !important;
  font-weight: 600 !important;
  color: #FFFFFF !important;
}
.home-before-slider .pxl-swiper-slide:nth-child(odd){
    border: none !important;
}
.we-offer h3.elementor-image-box-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 50px; /* adjust length */
  height: 3px; /* adjust thickness */
  background-color: #ffffff; /* change color if needed */
}

.alum-roof-we-offer-sec .elementor-image-box-wrapper {
    min-height: 270px !important;
}

.we-offer p.elementor-image-box-description {
    min-height: 110px;
}

.monier-we-offer-sec p.elementor-image-box-description {
    min-height: auto !important;
}

.bituminous-cap-we-offer-sec .elementor-image-box-wrapper {
    min-height: 215px !important;
}

.bituminous-cap-we-offer-sec p.elementor-image-box-description {
    min-height: auto !important;
}

.wood-shake-we-offer-sec p.elementor-image-box-description {
    min-height: 110px !important;
}

@media (max-width: 767px) {
    .alum-roof-we-offer-sec .elementor-image-box-wrapper {
    min-height: auto !important;
}

.we-offer p.elementor-image-box-description {
    min-height: auto;
}

.monier-we-offer-sec p.elementor-image-box-description {
    min-height: auto !important;
}

.bituminous-cap-we-offer-sec .elementor-image-box-wrapper {
    min-height: auto !important;
}

.bituminous-cap-we-offer-sec p.elementor-image-box-description {
    min-height: auto !important;
}

.wood-shake-we-offer-sec p.elementor-image-box-description {
    min-height: auto !important;
}
}

.why-hawaii-custom-dots-sec .pxl-swiper-dots .pxl-swiper-pagination-bullet:hover, 
.why-hawaii-custom-dots-sec .pxl-swiper-dots .pxl-swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: #6d9d46;
}

.why-hawaii-custom-dots-sec .pxl-swiper-dots .pxl-swiper-pagination-bullet {
	background: #f5fced;
}

.quote {
font-family: 'ProximaNova';
    font-weight: 400 !important;
    font-style: normal !important;
    display: inline-block !important;
    vertical-align: baseline !important;
    line-height: 1 !important;
    margin-right: 0.08em !important;
}

@font-face {
  font-family: 'ProximaNova';
  src: url('https://bbmhawaii.com/CSD/wp-content/uploads/2025/10/fonnts.com-Proxima_Nova_Semibold.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap; /* good UX: shows fallback until font loads */
  /* unicode-range: U+000-5FF;  /* optional: limit to Latin glyphs for faster load */
}