/* PAGE ESSENTIALS */ 
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
.form-inline { 
    float: right; 
    text-align: right; 
    margin: 0;
}
.btn { 
    color: white; 
}
.navbar-brand { 
    padding-top: 0px; 
}
.navbar { 
    margin: 0; 
    padding-top: 20px; 
    font-family: Poppins; 
}
.mb-4, .my-4 { 
    margin:0; 
    margin-bottom: 0; 
} 
.b-text { 
    padding-left: 10px; 
}
.btn-primary { 
    padding-bottom: 1px; 
}
footer { 
    padding-bottom: 100px;  
    background-color: rgb(35, 47, 61);
    display: flex; 
    flex-direction: row; 
    flex-wrap: wrap; 
    font-family: Poppins; 
    justify-content: center; 
}
.sitelogo {
    padding-left: 0px;
    padding-top: 120px;  
}
.footlinks { 
    display: flex; 
    flex-direction: column; 
    padding-top: 50px; 
    padding-left: 50px; 
    color: white; 
    font-size: 17px; 
}
.footlink.footlink-header { 
    padding-top: 5px; 
}
.footlink-header { 
    font-size: 25px;
    border-bottom-style: solid; 
    margin-bottom: 40px; 
    margin-top: 40px; 
    border-width: 2px; 
    border-color: #e9911d; 
}
.servicelink-header { 
    font-size: 25px; 
    border-bottom-style: solid; 
    margin-bottom: 40px; 
    margin-top: 40px; 
    border-width: 2px; 
    border-color: #e9911d; 
}
.location-header { 
    font-size: 25px; 
    border-bottom-style: solid; 
    margin-bottom: 40px; 
    margin-top: 40px;
    border-width: 2px; 
    border-color: #e9911d; 
}
.servicelinks { 
    display: flex; 
    flex-direction: column; 
    padding-top: 50px; 
    padding-left: 50px; 
    color: white; 
    font-size: 17px; 
}
.footerimage { 
    padding-top: 50px;
    padding-left: 5em; 
    color: white; 
}
.footerimage { 
    display: flex; 
    flex-direction: column; 
}
.footlink { 
    margin-bottom: 5px; 
}
.servicelink { 
    margin-bottom: 5px; 
}
.lastlink { 
    color: white; 
}
body { 
    background-color: #021b29; 
}
/* - - - PAGE ESSENTIALS END - - - */ 

/* - - - - - HOME PAGE START - - - - - */ 
/* - - - MAIN HEADER - - - */ 
.main-header { 
    background-image: url('https://fischerrestore.com/wp-content/uploads/2022/02/general-contractor-for-remodeling-projects.jpg');
    background-size: cover; 
    background-color: rgb(0, 0, 0, .4); 
    background-blend-mode: multiply; 
    padding-top: 0; 
    display: flex; 
    flex-direction: column; 
    max-width: 100%; 
    height: 90vh; 
}
.quotebtn {
    color: white; 
    border: 2px solid orange; 
    background-color: rgb(255, 255, 255, 0.1);
    border-radius: 0; 
    font-size: 1.5em; 
    font-weight: lighter;
    padding-left: 2em; 
    padding-right: 2em; 
    padding-top: 0.5em; 
    padding-bottom: 0.5em; 
    margin-top: 40px; 
    margin-left: 8em; 

    &:hover { 
     background-color: rgba(255, 255, 255, .3);
    }
}

.mainheading { 
    padding-top: 200px; 
    font-size: clamp(2rem, 5vw, 6vw); 
    padding-left: 50px; 
    color: white; 
    font-family: Poppins; 
}
/* - - - MAIN HEADER END - - - */ 
/* - - - JOB AND CONTACT BOXES START - - -*/ 
.service-header { 
    justify-self: center; 
    font-family: Poppins; 
    font-size: 50px;  
    color: white; 
    border-bottom-style: solid; 
    border-width: 4px; 
    border-color: #e9911d; 
    padding-bottom: 15px; 
    padding-top: 60px; 
    width: 6.3em; 
}
.siteboxes { 
    display: flex; 
    flex-wrap: wrap;
    flex-direction: row;  
    justify-self: center; 
    justify-items: center; 
    justify-content: center; 
    max-width: 86em;  
    margin-top: 50px; 

}
.job { 
    width: 25em; 
    height: 25em; 
    background-color: rgb(50, 41, 41); 
    margin-right: 20px; 
    margin-left: 20px; 
    margin-bottom: 20px; 
    flex-wrap: wrap; 
    display: flex; 
    flex-direction: column; 
    cursor: pointer; 
    overflow: hidden; 

    &:hover { 
     opacity: 0.4; 
     transform: scale(1.1); 
     transition: all 0.5s; 
    }
}
.painting { 
    background-image: url("https://franklinpainting.com/wp-content/uploads/2020/05/DSC6346.jpg");
}
.tilework { 
    background-image: url("https://battlecreektile.com/wp-content/uploads/2023/06/DuringTileInstallation.jpg");
}
.gutterwork { 
    background-image: url("https://masseyroofingservices.com/wp-content/uploads/2023/10/gutter-cleaning-services-407310393-3.png");
}
.snowplowing { 
    background-image: url("https://s3-media0.fl.yelpcdn.com/bphoto/fpsrfMTdMrWPN2yGuRn6XA/1000s.jpg");
}
.roofing { 
    background-image: url("https://crosscountryconstruction.biz/wp-content/uploads/2023/05/What-To-Look-For-In-A-Roofing-Estimate.png");
}
.bathroom-ren { 
    background-image: url("https://redhousecustombuilding.com/wp-content/uploads/2020/05/master_bathroom_renovation_providence_ri.jpg");
}
.caption { 
    margin-top: 22em; 
    width: 25em; 
    height: 4em; 
    background-color: #101414
}
.caption-text { 
    color: white; 
    Font-Family: Poppins; 
    font-size: 20px; 
    text-align: center; 
    justify-self: center; 
    align-self: center; 
    padding-top: 6px; 
    font-weight: 500; 
}
.all-service-butt { 
   border-style: none;
   border-radius: 10px;  
   color: white; 
   background-color: #e9911d; 
   font-size: 15px;
   padding-top: 15px; 
   padding-bottom: 15px; 
   padding-left: 32px; 
   padding-right: 32px; 
   display: block; 
   text-align: center; 
   letter-spacing:0.5px; 
   width: 14em;    
   justify-content: flex-end; 
   font-family: Poppins; 
}
/* - - - JOB AND CONTACT BOX END - - - */
/* - - - REVIEW BOXES START - - - */ 
.reviews { 
    background-color: #01141f; 
}
.review-header {
    color: white; 
    Font-Family: Poppins; 
    Font-size: 50px; 
    text-align: center; 
    justify-self: center; 
    border-bottom-style: solid; 
    border-width: 4px; 
    border-color: #e9911d; 
    padding-bottom: 15px;
    width: 6.5em; 
    margin-top: 1.5em; 
    padding-top: 3em; 

}
.review-boxes { 
    display: flex; 
    flex-direction: row; 
    flex-wrap: wrap; 
    margin-top: 6em; 
    justify-self: center; 
    max-width: 100em; 
    padding-bottom: 9em; 
    justify-self: center; 
    justify-content: center; 
    justify-items: center; 
}
.review-box { 
    flex-basis: 40em; 
    max-width: 70%; 
    height: 22em; 
    background-color: #021b29;
    margin-right: 40px; 
    margin-left: 40px; 
    margin-bottom: 20px; 
    border-radius: 10px 10px 10px 10px; 
    padding-left: 32px; 
    padding-right: 32px; 
    padding-bottom: 32px; 
    padding-top: 32px; 
    justify-content: center; 
    justify-self: center; 
    justify-items: center; 
}
.review-text { 
    color: #90A1AB;
    Font-Family: Poppins; 
    Font-size: 16px; 
}
.review-name { 
    Font-Family: Poppins; 
    color: white; 
    Font-Size: 25px; 
    Font-weight: 500; 
    margin-right: 20px; 
    margin-bottom: 30px; 
}
.review-name-rate { 
    display: flex; 
    flex-direction: row; 
    flex-wrap: wrap; 
}
.review-star { 
    margin-top: 10px; 
}
/* CONTACT ROW */ 
.contact { 
    background-color: #021b29; 
}
.contact-row { 
    display: flex; 
    flex-direction: row; 
    flex-wrap: wrap; 
    max-width: 99em; 
    padding-bottom: 10em; 
    justify-self: center; 
    justify-content: center; 
    justify-items: center;
}
.ci { 
    padding-top: 30px; 
    padding-bottom: 30px; 
    padding-left: 10px; 
    padding-left: 10px; 
    height: 23em; 
    margin-right: 15px; 
    margin-left: 15px; 
    margin-bottom: 15px; 
}
.contact-desc { 
    width: 30em; 
    border-radius: 10px 10px 10px 10px; 
    background-color: #01141f; 
} 
.desc-list { 
    color: white; 
    Font-Family: Poppins; 
    Font-size: 16px; 
    margin-bottom: 8px; 
}
.desc-text { 
    color: white; 
    Font-Family: Poppins; 
    Font-weight: 500; 
    Font-size: 25px; 
    margin-left: 30px; 
    margin-bottom: 20px; 
}
.contact-loc { 
    width: 30em; 
    background-color: #01141f; 
    border-radius: 10px 10px 10px 10px; 
    display: flex; 
    flex-direction: column; 
    flex-wrap: wrap; 
}
.location-h1 { 
    Font-Family: Poppins; 
    margin-left: 30px; 
    Color: white; 
    Font-size: 25px; 
}
.location-img { 
    margin-left: 30px; 
}
.contact-box { 
    width: 30em; 
    color: white; 
    background-color: #01141f; 
    border-radius: 10px 10px 10px 10px; 
    Font-Family: Poppins; 
}
.contact-box h1,h5{ 
    text-align:center; 
    justify-self: center; 
}
.logo-image { 
    height: 100px; 
    width: 100px; 
    border-radius: 50%; 
    margin-top: 20px; 
    border-style: solid; 
    border-color: white; 
    border-width: 3px; 
}
.logo { 
    justify-self: center; 
}
.c-content { 
    justify-self: center; 
    justify-items: center; 
} 
.contact-head { 
    display: flex; 
    flex-direction: column; 
    justify-self: center; 
    justify-items: center; 
    justify-content: center; 
}
.contact-header { 
    font-size: 45px; 
    margin-top: 4em; 
    margin-bottom: 1em;
    margin-left: 30px; 
    color: white;  
    border-bottom-style: solid; 
    border-width: 3px; 
    border-color: #e9911d; 
    padding-bottom: 15px; 
    width: 4em; 
}
/* CONTACT ROW END */ 
/* HERO ROW */ 
.home-main { 
    background-color: #01141f; 
}
.hero { 
    display: flex; 
    flex-direction: row; 
    flex-wrap: wrap; 
    max-width: 95em; 
    padding-top: 8em; 
    padding-bottom: 8em;
    justify-self: center; 
    justify-content: center; 
    justify-items: center;  
}
.hero-image { 
    flex-basis: 40em; 
    max-width: 60%; 
    max-height: 38em; 
}
.hero-desc { 
    flex-basis: 55em; 
    max-width: 50%; 
    max-height: 40em; 
}
.h-image { 
    max-width: 100%;  
    height: auto;  
    border-right-style: solid; 
    border-width: 15px; 
    border-color: #e9911d; 
    padding-right: 25px; 
    margin-left: 15px; 
    margin-bottom: 5px; 
}
.h-header, .h-par { 
    color: white; 
}
.h-text { 
    Font-Family: Poppins; 
}
.h-header { 
    font-size: 50px; 
}
.h-subhead { 
    color: #e9911d; 
    font-size: 40px; 
    padding-bottom: 50px; 
}
.h-par { 
    font-size: 17px; 
}
/* - - - - - HOME PAGE END - - - - - */
/* - - - - - ABOUT PAGE START - - - */ 
/* - - - ABOUT PAGE CONTAINER - - - */ 
.about-container { 
    display: flex; 
    flex-direction: row;
    margin-top: 5em; 
    justify-content: center; 
    flex-wrap: wrap; 
    background-color: rgb(35, 47, 61);
    padding-top: 20px; 
    padding-bottom: 20px; 
    width: 95%; 
    justify-self: center; 
    margin-bottom: 7em; 
}
.about-image { 
    max-width: 30%; 
    height: 32em; 
    display: block; 
    display: flex; 
    flex-direction: column; 
    flex-wrap: wrap;
}
.about-info { 
    max-width: 60%; 
    height: 32em; 
    display: flex; 
    flex-direction: column; 
    margin-left: 10px;
    display: flex; 
    flex-direction: column;  
    flex-wrap: wrap; 
}
.about-text { 
    color: white; 
    font-family: Poppins; 
    margin-left: 25px; 
    margin-top: 10px; 
}
.about-heading { 
    font-size: 20px; 
}
.about-highlight { 
    font-size: 30px; 
    font-weight: bold; 
    margin-top: 20px; 
}
.about-content { 
    margin-top: 15px; 
    font-size: 15px; 
}
.image { 
    margin-top: 20px; 
    margin-left: 0px; 
    width: 100%; 
    height: 80%;
}
/* - - - ABOUT PAGE CONTAINER END - - - */ 
/* - - - - - ABOUT PAGE END - - - - - */ 

/* - - - - - QUOTE INFO PAGE START - - - - - */ 
/* - - - QUOTE CONTACT FORM - - - */ 
.quotebox-quotepage { 
    margin: auto; 
    width: 80%;
    border: 1px; 
    border-style: none; 
    padding: 12px;  
    background-color: white; 
    margin-bottom: 100px; 
    border-radius: 7px; 
 }
 .content-flex-container { 
     display: flex; 
     flex-direction: row; 
     flex-wrap: wrap; 
     padding: 15px; 
 }
 .job-info { 
     width: 60%; 
     display: flex; 
     flex-direction: column; 
     
 }
 .contact-info { 
     width: 40%; 
     display: flex; 
     flex-direction: column; 
 }
 .textfield { 
     width: 90%; 
     margin-top: 10px; 
     padding-top: 12px; 
     padding-bottom: 12px; 
     border-radius: 0.9; 
 }
 .textfield-description { 
     width: 90%; 
     margin-top: 10px; 
     padding-top: 12px; 
     padding-bottom: 12em; 
     border-radius: 0.9; 
 }
 .submit-button { 
     margin-top: 10px; 
     padding-left: 10px; 
     padding-right: 10px; 
     padding-top: 10px; 
     padding-bottom: 10px; 
     background-color: #e9911d; 
     color: white; 
     border-style: none; 
 }
 .quote-header { 
     font-size: 25px; 
     font-weight: bold; 
 }
 .contact-item { 
     display: flex; 
     flex-direction: row; 
     flex-wrap: wrap; 
     margin-bottom: 30px; 
 }
 .address { 
     margin-top: 50px; 
 }
 .icon-image { 
     margin-right: 10px; 
 }
 .contact-header-quote { 
     font-size: 15px; 
     font-weight: bold; 
     margin-top: 5px; 
 }
 .contact-content { 
     display: flex; 
     flex-direction: column; 
 }
 /* - - - QUOTE CONTACT FORM END - - - */ 
 /* - - - - - QUOTE INFO PAGE END - - - - - */ 
/* - - - SERVICE PAGE START - - - */ 
.servicepage-main-header { 
   background-image: url("https://hpminsurance.com/hs-fs/hubfs/Assets/Commercial/snowplow72.jpg?width=1781&name=snowplow72.jpg");  
   height: 60vh; 
   padding-bottom: 100px; 
   max-width: 100%; 
   background-size: cover;
   background-blend-mode: multiply;
   background-color: rgb(0, 0, 0, .4); 
}
.servicepage-main-h1 { 
   font-size: clamp(6rem, 7vw, 7vw);
   font-family: Poppins; 
   text-align: center; 
   color: white;  
   margin-top: 0; 
   padding-top: 15rem; 
}
.service-column-section { 
   background-color: #01141f; 
}
.servicepage-service-column { 
   margin-top: 100px; 
   padding-bottom: 100px; 
   display: flex; 
   flex-direction: column; 
   flex-wrap: nowrap; 
   justify-content: center; 
   justify-self: center; 
   justify-items: center; 
}
.servicepage-service-box { 
   height: 16rem; 
   max-width: 85em; 
   background-color: #021b29; 
   display: flex; 
   flex-wrap: wrap; 
   justify-content: center; 
   justify-items: center; 
   justify-self: center; 
   margin-top: 30px; 
   margin-bottom: 5px; 
   margin-left: 20px; 
   margin-right: 20px; 
   border-radius: 10px; 

   &:hover { 
     transform: scale(1.1); 
     transition: all 0.2s; 
    }

}
.service-label-text { 
   font-Family: Poppins; 
   font-Weight: 500; 
   font-size: 4rem; 
   color: white;
   text-align: center;  
}
.servicepage-box-icon { 
   width: 20em;
   align-self: center; 
   align-content: center; 
   align-items: center; 
}  
.servicepage-box-label { 
   width: 25em; 
   align-items: center; 
   align-self: center; 
   align-content: center; 
}
.servicepage-box-butt { 
   width: 20em; 
   align-self: center; 
   align-content: center; 
   align-items: center; 
}
.servicepage-box-button { 
   width: 8rem; 
   height: 5rem; 
   border-radius: 15px;
   border-style: none;
   color: white; 
   background-color: #e9911d; 
   font-size: 15px;
   font-family: Poppins; 
   padding-top: 15px; 
   padding-bottom: 15px; 
   padding-left: 1em; 
   padding-right: 1em; 
   display: block; 
   text-align: center; 
   margin: auto; 
}
.servicepage-button-alignment { 
   justify-self: center; 
   justify-content: center; 
   justify-items: center; 
}
.servicepage-image-alignment {
   justify-self: center; 
   justify-content: center; 
   justify-items: center; 
}
/* - - - - SERVICE PAGE END - - - - */ 

/* CAROUSEL STYLES END */