/*******************************************
**** CUSTOM RE-USABLE - DBT Styles
********************************************/
.nowrap, nowrap {white-space: nowrap;}
.uwy, body .uwy {
    z-index: 9999 !important;
}
@media (max-width: 600px) {
    body .uwy.userway_p1 .userway_buttons_wrapper {
        top: 35px;
        right: 0;
    }
}


/* ADJUST ANCHOR Elementor Anchor Widget */
.elementor-menu-anchor {
    display: block;
    position: relative;
    top: -40px;
    visibility: hidden;
}

/* MAX WIDTHS FOR WIDGETS. Can specifiy Width for Sections but not Columns or Widgets in Elementor. */
.max-width-600 {max-width:600px;}
.max-width-650 {max-width:650px;}
.max-width-700 {max-width:700px;}
.max-width-750 {max-width:750px;}
.max-width-800 {max-width:800px;}
.max-width-850 {max-width:850px;}

/* RESPONSIVE COLUMN WIDTHS. Apply class to section. */
/* Tablet 25% columns & Mobile 50% columns. */
@media screen and (max-width: 768px) {.dbt-t25-m50 .elementor-column {width: 25% !important;}}
@media screen and (max-width: 480px) {.dbt-t25-m50 .elementor-column {width: 50% !important;}}




/*******************************************
**** DBT CUSTOM CREATED Styles
********************************************/

/* Used on leadership page */
.bold-is-blue b, .bold-is-blue strong {color:#283d98;}
.bold-is-blue a:hover b, .bold-is-blue a:hover strong {color:#5ea53b;}

/* Used on News page */
.h3-hover-green h3 a:hover,
.h4-hover-green h4 a:hover,
.h5-hover-green h5 a:hover,
.h6-hover-green h6 a:hover {color:#5EA53B !important;}

.img-border-radius-4 img {border-radius:4px;}

/* Google Translate */
.svcw-google-translate {line-height:33.5px;} /* custom class created in menu */
.goog-te-gadget-simple {border-radius:8px;padding-left:6px;border: 1px solid #cecece !important;padding-top:4px !important;padding-bottom:4px !important;} /* GT added via code in menu and code via Custom Layout */
a.goog-te-menu-value {padding-right: .5em !important;padding-left: .3em !important;}
.goog-te-gadget-simple .goog-te-menu-value span{padding-right:1px;}

/* Used on HR Documents page and can be used elsewhere */
.bullet-points-custom-design ul {margin:0;list-style-type:none;font-weight:600;}
.bullet-points-custom-design ul li {margin-bottom:4px;}

/* Used on Bids & RFP page and can be used elsewhere */
@media screen and (max-width: 480px) {
    .list-mobile-flush-left ul, .list-mobile-flush-left ol {margin-left:1.5em;}
}

/* Used on Mandatory Wastewater Permit Form Instructions */
.li-extra-space li:not(:last-child) {margin-bottom:13px;}
.li-extra-space2 li:not(:last-child) {margin-bottom:30px;}
.li-extra-space2 ul {margin-top:2em;}
.nobullet ul {list-style:none;margin-left:2.5em;}

.site-footer #mtg-dates li {margin-top:0;}
.site-footer #mtg-dates li .elementor-icon-list-text {padding-left:0;}






/*******************************************
**** WP DEFAULTS - DBT Adjustments
********************************************/
blockquote {border-left:none;}
#secondary li {
    margin-bottom: .9em;
    line-height: 1.8;
}

#footer-icon-address img {margin-right:10px;}
#footer-icon-address p {font-weight:600;}
#footer-icon-address a:hover {color:#FFEF20;}
#footer-image-box-address .elementor-image-box-img {width:40px !important;}
#footer-image-box-address a {color:#FFFFFF !important;}
#footer-image-box-address .elementor-image-box-description a:hover {color:#FFEF20 !important;}

@media (min-width: 992px){
    .site-footer .ast-row .ast-col-lg-6:first-child {width: 40%;}
    .site-footer .ast-row .ast-col-lg-6:last-child {width: 60%;}
    .site-footer .ast-row .ast-row .ast-col-lg-6:first-child {width: 60%;}
    .site-footer .ast-row .ast-row .ast-col-lg-6:last-child {width: 40%;}

}


/*******************************************
**** ASTRA DEFAULTS - DBT Adjustments
********************************************/
/* Correct style that makes a header link "normal" which changes the font weight from what I might set it to. */
.entry-content h1 a, .entry-content h2 a, .entry-content h3 a, .entry-content h4 a, .entry-content h5 a, .entry-content h6 a {font-weight:inherit;} /* DBT STARTER TEMPLATE STARTER RULE */

.main-header-bar.ast-sticky-shrunk {padding: .2em 0;} /* DBT STARTER TEMPLATE STARTER RULE: Adjust sticky header height */

/***** ASTRA HEADER STYLING *****/

/* Search Bar in Header */
.search-custom-menu-item .ast-search-menu-icon .search-form {border: 1px solid #ccc9c9;border-radius:8px;position:relative;top:-1px;}
.site-header .ast-inline-search.ast-search-menu-icon .search-field {padding:.5em;font-size:16px;color:#353535;font-weight:600;}
.astra-search-icon::before {font-size:20px;}
input[type=search]:focus {background-color:transparent;outline:none;}

/* MENU STYLING */
.ast-below-header .menu-item-has-children>a:after {display: none;} /* remove sub-menu link icon */
.header-main-layout-1 .main-navigation {vertical-align: middle;} /* google translate and search icon */
.astra-widget-social-profiles-inner.inline li {vertical-align: middle;} /* astra social widget */
.ast-header-break-point.ast-header-custom-item-inside .main-header-bar .main-header-bar-navigation .ast-search-icon {display:block;} /* search widget is display none for some reason at some point */
.ast-search-icon .astra-search-icon {font-size:25px !important;} /* search widget size */
.main-navigation ul {top:3px;}
.ast-header-break-point .ast-below-header-actual-nav .sub-menu .menu-item .menu-link {padding-bottom:0;}
@media (min-width: 769px) {
    .ast-header-break-point .ast-below-header-menu .sub-menu .menu-item.focus>.sub-menu, .ast-header-break-point .ast-below-header-menu .sub-menu .menu-item:hover>.sub-menu {left: 0%;}
}
.ast-header-break-point .ast-below-header-menu .menu-link {padding-top:15px !important;padding-bottom: 15px !important;line-height:1.3em;}

/* Mega Menu */
.ast-below-header-menu .astra-megamenu {padding:25px 40px 25px !important;}
.ast-header-break-point .ast-below-header-menu .astra-megamenu {padding:0 !important;}

.ast-below-header-menu .astra-megamenu .menu-link {padding:6px 0 6px 1em;line-height:1.3em;}
.ast-header-break-point .ast-below-header-menu .astra-megamenu .menu-link {padding:15px 0 15px 30px !important;line-height:1.3em;}

.ast-below-header-menu .astra-megamenu .menu-link:hover {background-color:transparent !important;text-decoration: underline;}
.ast-header-break-point .ast-below-header-menu .astra-megamenu .menu-link:hover {background-color:#75c8f0 !important;text-decoration: none;}
i.fa-home:hover {color:#75C8F0;}

/* BELOW HEADER SECTION */
/* Adjust search icon right padding to align with above menu */
.ast-below-header-1 .ast-justify-content-flex-end .user-select {padding-right:8px;}
.ast-below-header-menu ul {width:210px;} /* adjust width of Primary Menu sub-menu */
.ast-desktop .ast-below-header-menu.submenu-with-border .sub-menu {border-radius: 3px;}

.ast-desktop .ast-below-header-menu li.menu-item-home:hover > a {
    background-color: #75c8f0;
}

.ast-header-break-point .ast-below-header {padding: 0.4em 0;}

.ast-desktop .ast-below-header-menu .sub-menu a:hover, .ast-below-header-menu .sub-menu li.current-menu-item > a {text-shadow:0px 1px 1px #12658e;}

.ast-desktop .ast-below-header-menu li.menu-item-home:hover > a {border-radius: 0 0 8px 8px;}

/* ASTRA HEADER MOBILE STYLES */
.ast-below-header-menu .menu-link:last-child {padding-right:3px;}
.ast-header-break-point li.ast-masthead-custom-menu-items {padding-left:0;padding-right:0;}
.ast-header-break-point.ast-header-custom-item-inside .main-header-bar .ast-search-menu-icon.ast-inline-search .search-field {padding-right:3.5em;}
.ast-header-break-point .site-header .main-header-bar-wrap .site-branding {min-width:200px;} /* pushes menu under logo */
.ast-header-break-point.ast-no-toggle-menu-enable .main-navigation ul li {margin-left:auto;margin-right:auto;} /* centers menu items on mobile */
.ast-header-break-point .ast-masthead-custom-menu-items .ast-inline-search form {border-color:#ccc9c9;}

@media screen and (max-width: 544px) {
    .ast-header-break-point.ast-no-toggle-menu-enable .header-main-layout-1 .site-branding {padding-bottom:0px;} /* padding under logo on mobile */
    .ast-header-break-point .site-branding img, .ast-header-break-point #masthead .site-logo-img .custom-logo-link img {position: relative;left: -14px;}
}

@media screen and (max-width: 768px) {
    .ast-header-break-point ul li.ast-masthead-custom-menu-items a {padding:0;}
    .ast-header-break-point li.ast-masthead-custom-menu-items, li.ast-masthead-custom-menu-items {padding-left:0;padding-right:0;}
}
@media screen and (max-width: 550px) {
    .ast-header-break-point .site-header .main-header-bar-wrap .site-branding {margin-top:6px;text-align:center;}
    .ast-header-break-point.ast-no-toggle-menu-enable .ast-main-header-bar-alignment {margin-top:12px;text-align:center;width:100%;}
    .main-navigation ul {top:0;}
}
/***** END ---- ASTRA HEADER STYLING *****/

/***** WAVE UNDER NAVIGATION BAR *****/
#content {margin-top:-10px;margin-bottom:-30px;} /* Adjust for waves under nav bar and above footer */

.site-footer .widget {margin-bottom:10px;}

@media (min-width: 1201px) {
    .ast-separate-container .ast-archive-description {padding-bottom: 0;}
}
@media (max-width: 1200px) {
    .ast-separate-container .ast-archive-description {padding-bottom: 0;}
}



/*******************************************
**** ELEMENTOR DEFAULTS - DBT Adjustments
********************************************/
.elementor-widget-heading .elementor-heading-title {line-height: 1.4;} /* DBT STARTER TEMPLATE STARTER RULE */

/* UAE Team Widget */
.uael-team-member .uael-separator-wrapper {padding-bottom: 10px;}
.uael-team-member .uael-team-desc {margin-bottom: 11px;}

.elementor-button-icon svg {height:auto;}

/* Navigation Menu Widget */
.elementor-nav-menu--dropdown a {justify-content: flex-start;}

.elementor-widget-nav-menu a {justify-content: space-between !important}

.elementor-widget-video .elementor-video:focus {background-color:transparent;outline:none;}

/*******************************************
**** PAGES
********************************************/

/* HOME PAGE
********************************************/

/***** HOME PAGE SLIDER ***/
/***** NOTE - This is a mind bender for coding to make it work. There are three elements, the heading, the description and the button. Sometimes the description is not there (if none used) and sometimes the button is coded as an "a" element (if specified for only the button to be the link in the slide) and sometimes as a div (when the whole slide is specified to be the link). Reference for some css related tricks: css-tricks.com/useful-nth-child-recipies/  END NOTE *****/
#home-slider .swiper-slide-contents div.elementor-slide-heading,
#home-slider .swiper-slide-contents div.elementor-slide-description {
    border: 6px solid white;
    border-width: 6px 0px;
    background: #e8e8e8e3;
    padding: 40px 50px 40px 50px;
}
#home-slider .swiper-slide-contents div.elementor-slide-heading {
    border-radius: 5px;
}
#home-slider .swiper-slide-contents div.elementor-slide-description {
    border-top: none;
    padding-top: 0px;
    border-radius: 0 0 5px 5px;
}
#home-slider .swiper-slide-contents div:nth-last-of-type(3):not(.elementor-slide-description),
#home-slider .swiper-slide-contents div:nth-last-child(3) { /* applies to heading ONLY when with a description AND button */
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 18px;
    border-radius: 5px 5px 0 0;
}
#home-slider .swiper-slide-contents a.elementor-slide-button {}
#home-slider .swiper-slide-contents gray {color:#2b2b2b;}
#home-slider .swiper-slide-contents div:nth-child(2):not(.elementor-slide-description) {margin-top:18px;} /* this is for the button ONLY when there is NO description */

/* These are here for reference and explanation of how the code works */
#home-slider .swiper-slide-contents div:nth-last-of-type(3):not(.elementor-slide-description) {} /* Should apply to the heading ONLY when there is a description and the button is styled as an "a" element when the button only is the link in the slide */

#home-slider .swiper-slide-contents div:nth-last-child(3) {} /* Should ONLY apply to heading when there is a description AND a button styled as a div for the whole slide to be a link */


@media screen and (max-width: 1050px) and (min-width: 881px) {
    #home-slider .swiper-slide-contents div.elementor-slide-heading {font-size: 45px;}
    #home-slider .swiper-slide-contents div.elementor-slide-description {font-size: 23px;}
}
@media screen and (max-width: 880px) and (min-width: 769px) {
    #home-slider .swiper-slide-contents div.elementor-slide-heading {font-size: 40px;}
    #home-slider .swiper-slide-contents div.elementor-slide-description {font-size: 21px;}
}
@media screen and (max-width: 768px) {
    #home-slider .swiper-slide-contents div.elementor-slide-heading,
    #home-slider .swiper-slide-contents div.elementor-slide-description {
        padding: 30px 35px 30px 35px;
    }
    #home-slider .swiper-slide-contents div.elementor-slide-description {
        padding-top: 0px;
    }
    #home-slider .swiper-slide-contents div:nth-last-of-type(3):not(.elementor-slide-description),
    #home-slider .swiper-slide-contents div:nth-last-child(3) { /* applies to heading ONLY when with a description */
        padding-bottom: 18px;
    }
}


/* landing page hero  */

#home-slider.hero-slider .swiper-slide-contents{
    line-height: 0 !important;
    border-top: 6px solid white;
    border-bottom: 6px solid white;
    background: #e8e8e8e3;
    border-radius: 5px 5px  ;
}
#home-slider.hero-slider .swiper-slide-contents .elementor-slide-heading {
    margin-bottom: 0;
    border-bottom: 0;
    color: #2b2b2b;
    background: transparent !important;
    padding: 40px 50px 20px 50px;
}
#home-slider.hero-slider .swiper-slide-contents div.elementor-slide-description{
    background: transparent !important;
    margin-bottom: 0;
    border-bottom: 0;
}

@media(max-width:767px){

    #home-slider.hero-slider .swiper-slide-contents .elementor-slide-heading {
        padding: 20px;
    }

    #home-slider.hero-slider .swiper-slide-contents div.elementor-slide-description {
        padding: 0 15px 20px;
    }
}
/* landing page hero  */

/***** END ---- HOME PAGE SLIDER *****/


/***** Newsletter Sign-up Modal & News Page Button *****/
#home-news-modal .elementor-button .elementor-button-icon {font-size:2.2em;position:relative;top:7px;}
#home-news-page-button .elementor-button .elementor-button-icon {font-size:2.3em;position:relative;top:0px;}

#home-news-modal .elementor-button .elementor-button-text,
#home-news-page-button .elementor-button .elementor-button-text {position:relative;top:11px;text-shadow:0px 0px 1px #27272799;}



/* COMMISSION MEETINGS PAGE
********************************************/
/* Accordian Widget Current Year Commission Meetings */
.commission-mtg-assets .elementor-accordion .elementor-tab-title {
    border-bottom: 1px dotted #d4d4d4;
}
.commission-mtg-assets .elementor-accordion ul {
    list-style: none;
}
.commission-mtg-assets .elementor-accordion-title:focus {outline:none;}

/* Toggle Widget Archives */
#commission-mtg-archive-toggle .elementor-tab-content p:first-child {display:none;}
#commission-mtg-archive-toggle .elementor-toggle-title:focus {outline:none;}


/* OPEN POSITIONS PAGE
********************************************/
/* there is an Open Position that says Do Not Delete which I have in there to present the No positions by CSS below if it is the only one. To edit go to Elementor>Theme Templates>find Open Positions one. */
/*#open-positions-posts-widget .elementor-post:last-child {display:none;}*/
#open-positions-posts-widget .elementor-post:only-of-type {display:block;}
/*#open-positions-posts-widget .elementor-post:last-child .job-title,
#open-positions-posts-widget .elementor-post:last-child .job-closing-date,
#open-positions-posts-widget .elementor-post:last-child .job-buttons {display:none;}*/
#open-positions-posts-widget.elementor-widget-posts .elementor-posts-nothing-found:empty::after {
    content: "We're not hiring at the moment, but we're always interested in connecting with talented people. Please check back for future opportunities.";
    display: block;
    text-align: left;
    padding: 20px 20px 0 0;
    color: var(--e-global-color-text);
    font-size: 17px;
    line-height: var(--ast-body-line-height, 1.65em);
}
#open-positions-posts-widget .elementor-post:last-child .job-description {font-size:22px;font-weight:600;}



/* HR Documents PAGE
********************************************/
/* there is a rule used on this page for the bullet lists but is in the CSS code above, look for bullet-points-custom-design. */






/*******************************************
**** PLUGINS
********************************************/


/* GRAVITY FORMS
********************************************/
/* Section titles - used on Permit forms and maybe others. */
.gform_wrapper .gform_body h2.gsection_title {
    font-size: 2em;
    padding-top: 50px !important;
    color:#283D98;
}
.gform_wrapper .gform_body .gform_fields .gsection {
    border-bottom-color: #283D98 !important;
}

/* DBT created - add padding to top of field via CSS to create spacing. Used on Mandatory Permit and maybe others. */
li.gf_field_top_margin {margin-top:70px !important;}
li.gf_field_top_margin-small {margin-top:35px !important;}
li.gf_sub-header h3 {font-weight:bold;}
.gform_wrapper d {display:inline;font-size:.5em;position:relative;top:3px;}
.gform_wrapper u {display:inline;font-size:.5em;position:relative;bottom:7px;text-decoration:none;}

@media only screen and (min-width: 641px) {
    .gform_wrapper .top_label li.gfield.gf_inline {
        margin-top:16px !important;
    }
}

.gform_wrapper table.gfield_list {line-height:1.4em !important;}
/*Font Awesome to SVG icon*/
.elementor-nav-menu .sub-arrow .e-font-icon-svg.e-fas-caret-down{
    position: relative;
    right: -3px;
}
span.elementor-accordion-icon-closed .e-fas-plus{
    position: relative;
    left: -2px;
}
span.elementor-accordion-icon-closed .e-fas-angle-right{
    position: relative;
    left: -3px;
    left: -4px;
}
.uael-post__date .e-fa-calendar {
    width: 12px;
    height: 14px;
    vertical-align: baseline;
    margin-right: 2px;
}
.uael-post__read-more.elementor-button:not(:hover) .elementor-align-icon-left .e-fas-thumbtack path{
    fill: #58a63d;
}
.uael-post__read-more.elementor-button:not(:hover) .elementor-align-icon-left .e-fas-book-reader path{
    fill: #0274BE;
}
.elementor-button-linkelementor-size-sm .elementor-button-icon{
    width: 19px;
}.elementor-button-icon svg{
     width: auto;
 }
/*Font Awesome to SVG icon*/