/* Site-specific styles: hero, careers form layout, map, small fixes.
   Loaded last, after the theme stylesheets. */

/* ---------- Homepage hero ---------- */
#rev_slider_1_1_wrapper { height: 600px; overflow: visible; }
.hero-static {
    position: relative;
    width: 100%;
    height: 600px;
    background: #e9e9e9 url("../images/slide1.jpg") no-repeat center top;
    background-size: cover;
    overflow: hidden;
}
.hero-layers {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1170px;
    height: 100%;
}
.hero-layers .banner-text.slider-one {
    position: absolute;
    left: 35px;
    top: 67px;
    max-width: 737px;
}
.hero-layers .banner-text.slider-one h2 {
    font-size: 33px;
    line-height: 37px;
    font-weight: 900;
    letter-spacing: -1px;
    margin: 0;
    color: #0085b3;
    text-transform: uppercase;
}
.hero-layers .slider-one-bttn {
    position: absolute;
    left: 39px;
    top: 251px;
}
.hero-layers .slider-one-bttn .services-link {
    background: #fa5439;
    color: #fff !important;
}
.hero-layers .slider-one-bttn .services-link:hover {
    background: #50b9ce;
}
@media (max-width: 1199px) {
    #rev_slider_1_1_wrapper, .hero-static { height: 50vw; min-height: 240px; }
    .hero-layers .banner-text.slider-one { left: 20px; top: 15%; max-width: 55%; }
    .hero-layers .banner-text.slider-one h2 { font-size: 24px; line-height: 1.2; }
    .hero-layers .slider-one-bttn { left: 20px; top: 60%; }
}
@media (max-width: 767px) {
    .hero-layers .banner-text.slider-one h2 { font-size: 14px; }
    .hero-layers .slider-one-bttn .services-link {
        font-size: 12px;
        width: 130px;
        padding: 10px 0;
    }
}

/* ---------- Forms: required markers + inline validation ---------- */
.req { color: #e04622; font-weight: 700; }
.opt { color: #6e7b86; font-weight: 400; font-size: 12px; }
.form-legend { color: #6e7b86; font-size: 13px; margin: 0 0 16px; }
.field-error {
    display: block;
    clear: both;
    color: #e04622;
    font-size: 13px;
    margin-top: 4px;
}

/* ---------- Contact form ---------- */
.br-hp { position: absolute !important; left: -9999px; height: 0; width: 0; opacity: 0; }
.form-status { display: none; margin: 1em 0; padding: 0.5em 1em; border: 2px solid #e04622; color: #2c3740; }
.form-status.visible { display: block; }
.contact-form-box .form-status { border: 0; padding: 0.2em 0; }

/* ---------- Careers application form, consistent with the theme ---------- */
.carrer-form-rebuilt { padding-bottom: 40px; }
.carrer-form-rebuilt .carrersTitle {
    text-transform: uppercase;
    font-weight: 800;
    color: #2c3740;
    margin: 30px 0 20px;
}
.carrer-form-rebuilt .field {
    margin-bottom: 18px;
    overflow: hidden;
    clear: both;
}
.carrer-form-rebuilt .field > div { min-height: 1px; }
.carrer-form-rebuilt label {
    font-weight: 700;
    color: #2c3740;
    padding-top: 9px;
    margin-bottom: 5px;
    display: inline-block;
}
.carrer-form-rebuilt input[type="text"],
.carrer-form-rebuilt input[type="date"],
.carrer-form-rebuilt input[type="tel"],
.carrer-form-rebuilt input[type="email"],
.carrer-form-rebuilt textarea,
.carrer-form-rebuilt select {
    width: 100%;
    border: 1px solid #d5dde3;
    background: #fff;
    color: #60707d;
    padding: 9px 12px;
    font-size: 14px;
    outline: none;
}
.carrer-form-rebuilt input:focus,
.carrer-form-rebuilt textarea:focus,
.carrer-form-rebuilt select:focus { border-color: #50b9ce; }
.carrer-form-rebuilt .dateSelects .padSelect { padding: 0 10px 10px 0; }
.carrer-form-rebuilt .radioContainer { padding-top: 9px; }
.carrer-form-rebuilt .radio-opt { font-weight: 400; padding-top: 0; cursor: pointer; }
.carrer-form-rebuilt .radio-opt input { margin-right: 6px; }
.carrer-form-rebuilt input[type="radio"] {
    -webkit-appearance: radio !important;
    appearance: radio !important;
    width: 14px !important;
    height: 14px !important;
    display: inline-block;
    vertical-align: middle;
    accent-color: #50b9ce;
}
.carrer-form-rebuilt .browse-wrap { margin-top: 5px; }
.carrer-form-rebuilt input[type="file"] { padding: 6px 0; width: 100%; }
.carrer-form-rebuilt .upload-path { color: #6e7b86; font-size: 13px; }
.carrer-form-rebuilt input[type="submit"] {
    background: #e04622;
    color: #fff;
    border: 0;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 14px;
    padding: 15px 0;
    width: 174px;
    margin-top: 10px;
    cursor: pointer;
    transition: 0.5s all ease;
}
.carrer-form-rebuilt input[type="submit"]:hover { background: #50b9ce; }
.carrer-form-rebuilt input.invalid, .carrer-form-rebuilt textarea.invalid { border-color: #e04622; }

/* ---------- Map ---------- */
#map-box iframe { min-height: 560px; }

/* ---------- Misc ---------- */
.wpcf7-form input.invalid, .wpcf7-form textarea.invalid { border-color: #e04622 !important; }

/* ---------- Mobile navigation ----------
   dropdown.css hides #menu-button at every width; show it on small screens.
   The menumaker script handles the open/close toggling. */
@media (max-width: 767px) {
    #cssmenu #menu-button {
        display: block !important;
        position: relative;
        color: #fff;
        background: #2c3740;
        padding: 13px 20px;
        text-transform: uppercase;
        font-weight: 700;
        font-size: 14px;
        cursor: pointer;
        user-select: none;
    }
    #cssmenu > ul.open > li { display: block; width: 100%; }
}

/* ---------- Careers: opening buttons ----------
   The theme leaves these links display:inline, so their vertical padding
   paints outside the layout box; with wrapped text on small screens the
   buttons overlap. inline-block makes the padding count. */
a.position {
    display: inline-block;
    margin: 8px 0;
}

/* ---------- Interior banners on small screens ----------
   The fixed 298px height forces heavy zoom on a wide banner image at phone
   widths; a shorter banner needs less scaling, showing more of the image. */
@media (max-width: 767px) {
    .banner-image-plane {
        height: 190px;
    }
}