/*
Theme Name: DrPipe v2
*/

/* Alignment */
.alignleft {
    display: inline;
    float: left;
    margin-right: 20px;
}
.alignright {
    display: inline;
    float: right;
    margin-left: 20px;
}
.aligncenter {
    clear: both;
    display: block;
    margin: 0 auto;
}

/* Images and wp-captions should always fit and be responsive */
img {
    display: inline-block;
    height: auto;
    max-width: 100%;
}
.wp-caption {
    border: 1px solid #ccc;
    margin-bottom: 10px;
    max-width: 100%;
    border-radius: 4px;
    padding: 0 10px;
}
.wp-caption.aligncenter {
    margin-bottom: 10px;
}
.wp-caption img[class*="wp-image-"] {
    display: block;
}
.wp-caption .wp-caption-text {
    text-align: center;
    margin-top: 10px;
}

/* WP Gallery */
.gallery {
    margin-bottom: 1.5em;
}
.gallery a img {
    border: none;
    height: auto;
    max-width: 90%;
}
.gallery dd {
    margin: 0;
}
.gallery-caption {
    display: block;
}
.wp-block-image img {
    margin-top: 0;
    margin-bottom: 0;
}

body {
    height: auto !important;
}
header.header {
    position: sticky;
    top: 0;
    z-index: 99;
}
.header .header-bottom .ubermenu ul li i {
    margin-top: 1px !important;
}
.hero-image .container .row h1 span {
    font-size: 48px;
    line-height: 60px;
    display: block;
    color: #03045e;
}
/*.ubermenu.ubermenu-disable-submenu-scroll .ubermenu-active>.ubermenu-submenu.ubermenu-submenu-type-mega {
    height: 100vh;
    overflow: auto !important;
}*/

.header-bottom .ubermenu ul li.menu-3-column .ubermenu-submenu {
    left: 0;
    width: 944px;
    max-width: 944px;
}

.page-id-317 .main-content {
    padding: 0;
}
.footer .footer-top-menu ul li {
    width: 33.333%;
}
.footer .footer-top-address .phone {
    margin-bottom: 10px;
}
.price-block .breadcrumbs {
    display: none;
}
.price-block:first-child .breadcrumbs {
    display: block;
}
.request-button a {
    background: #00B4D8 !important;
    color: #fff !important;
    padding: 8px 18px !important;
    font-weight: bold !important;
    border-radius: 20px !important;
    display: block;
}
.request-button a span {
    font-weight: bold !important;
}
.header-bottom .ubermenu-nav {
    align-items: center;
    display: flex;
}
.header__logo {
        position: relative;
    z-index: 999;
}
nav.ubermenu.show-residential, #menu-item-35 {
    position: static;
}
nav.ubermenu.show-residential li.menu-3-column .ubermenu-submenu {
    max-width: 100% !important;
    width: 100% !important;
}

@media only screen and (max-width: 768px) {
    .hero-image .container .row h1 span  {
        font-size: 25px;
        line-height: 35px;
        display: block;
    }
}
.hero-imagev2 {
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    min-height: 648px;
    padding: 46px 0
}

@media only screen and (max-width: 992px) {
    .hero-imagev2 {
        background-image:none!important;
        min-height: auto;
        padding: 0
    }

    .hero-imagev2 .container {
        max-width: 100%;
        padding: 0
    }
}

.hero-imagev2 .row {
    display: flex;
    gap: 24px
}

@media only screen and (max-width: 992px) {
    .hero-imagev2 .row {
        flex-direction:column-reverse;
        gap: 0
    }
}

.hero-imagev2 .mobile-hero {
    display: none
}

.hero-imagev2 .hero-image-right {
    align-items: flex-end;
    display: flex;
    flex: auto;
    justify-content: flex-end
}

@media only screen and (max-width: 992px) {
    .hero-imagev2 .hero-image-right {
        flex-direction:row;
        min-height: 490px;
        padding: 24px
    }
}

@media only screen and (max-width: 768px) {
    .hero-imagev2 .hero-image-right {
        align-items:flex-start;
        flex-direction: column
    }
}

@media only screen and (max-width: 576px) {
    .hero-imagev2 .hero-image-right {
        min-height:400px
    }
}

.hero-imagev2 .hero-image-right h1 {
    display: none
}

@media only screen and (max-width: 992px) {
    .hero-imagev2 .hero-image-right h1 {
        display:block;
        font-size: 50px;
        margin-bottom: 16px!important;
        text-align: left
    }
}

@media only screen and (max-width: 768px) {
    .hero-imagev2 .hero-image-right h1 {
        font-size:34px!important;
        line-height: 105%!important
    }
}

@media screen and (max-width: 420px) {
    .hero-imagev2 .hero-image-right h1 {
        font-size:28px!important
    }
}

@media screen and (max-width: 360px) {
    .hero-imagev2 .hero-image-right h1 {
        font-size:24px!important
    }
}

.hero-imagev2 .hero-image-right .d-flex {
    align-items: center;
    gap: 24px
}

@media only screen and (max-width: 992px) {
    .hero-imagev2 .hero-image-right .d-flex {
        flex-direction:column
    }
}

@media only screen and (max-width: 768px) {
    .hero-imagev2 .hero-image-right .d-flex {
        flex-direction:row
    }
}

@media only screen and (max-width: 576px) {
    .hero-imagev2 .hero-image-right .d-flex {
        zoom:.52
    }
}

.hero-imagev2 .hero-image-right .d-flex .rpi {
    border-radius: 10px;
    overflow: hidden
}

.hero-imagev2 .hero-image-right .d-flex img {
    display: block
}

.hero-imagev2 .hero-image-left {
    display: flex;
    flex-direction: column;
    gap: 48px;
    max-width: 580px;
    width: 50%
}

@media only screen and (max-width: 1200px) {
    .hero-imagev2 .hero-image-left {
        max-width:100%;
        width: 60%
    }
}

@media only screen and (max-width: 992px) {
    .hero-imagev2 .hero-image-left {
        width:100%
    }

    .hero-imagev2 .hero-image-left h1 {
        display: none
    }
}

.hero-imagev2 h1 {
    color: #fff;
    font-size: 58px;
    line-height: 110%;
    margin-bottom: 0
}

.hero-imagev2 .hero-image-form {
    background: rgba(142,163,183,.9);
    border-radius: 20px;
    box-shadow: -5px 5px 30px 0 rgba(0,0,0,.251);
    overflow: hidden;
    padding: 16px 24px 22px
}

@media only screen and (max-width: 992px) {
    .hero-imagev2 .hero-image-form {
        border-radius:0
    }
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_heading {
    margin-bottom: 24px
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_heading .gform_title {
    color: #fff;
    font-family: Montserrat-Bold;
    font-size: 18px;
    line-height: 140%;
    margin: 0
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_heading .gform_description {
    display: none
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield {
    flex: auto;
    margin: 0!important;
    width: 49%
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield.gfield_error {
    background: 0 0;
    border: 0
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield.gfield_error input,.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield.gfield_error textarea {
    border-color: red!important
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield .validation_message {
    display: none!important
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield input {
    background: hsla(0,0%,100%,.9);
    border: 1px solid #8ea3b7;
    border-radius: 10px;
    color: #8ea3b7;
    font-size: 14px!important;
    height: 40px;
    line-height: 40px;
    outline: 0!important
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield textarea {
    background: hsla(0,0%,100%,.9);
    border: 1px solid #8ea3b7;
    border-radius: 10px;
    color: #8ea3b7;
    font-size: 14px;
    min-height: 80px
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield .gform_fileupload_multifile .gform_drop_area {
    background: 0 0;
    border: 2px dashed #fff;
    height: 80px;
    padding: 4px 0
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield .gform_fileupload_multifile .gform_drop_area button {
    background: #fff;
    border: 1px solid #fff;
    color: #8ea3b7;
    height: 26px;
    line-height: 26px
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield .gform_fileupload_multifile .gform_drop_instructions {
    color: #fff;
    font-size: 14px;
    opacity: 1
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform_fields .gfield .gform_fileupload_rules {
    display: none
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform-footer {
    margin: 24px 0 0;
    padding: 0
}

.hero-imagev2 .hero-image-form .gform_wrapper .gform-footer input[type=image].button {
    height: 50px;
    line-height: 50px
}