﻿p, a, h1, h2, h3, h4, h5, h6, li {
    color: #555;
}

#content {
    position: relative;
    width: 100%;
    background: #fff;
}

.blue-gradient {
    background: #2d8bc8 url(../images/Master/gradient_bg.jpg) bottom repeat-x;
    /* Safari 4-5, Chrome 1-9 */
    background: -webkit-gradient(linear, bottom, from(#004b8d), color-stop(0.25, #004b8d), color-stop(0.5, #004b8d), color-stop(0.75, #004b8d), to(#004b8d));
    /* Safari 5.1+, Chrome 10+ */
    background: -webkit-linear-gradient(top, #004b8d, #004b8d 48%, #004b8d 52%, #004b8d);
    /* Firefox 3.6+ */
    background: -moz-linear-gradient(top, #004b8d, #004b8d 50%, #004b8d 51%, #004b8d);
    /* IE 10 */
    background: -ms-linear-gradient(top, #004b8d, #004b8d 50%, #004b8d 51%, #004b8d);
    /* Opera 11.10+ */
    background: -o-linear-gradient(top, #004b8d, #004b8d 50%, #004b8d 51%, #004b8d);
}

.position-button {
    padding: 5px 20px;
    color: #fff;
    text-decoration: none !important;
    font-size: 18px !important;
    clear: both;
    margin-right: 10px;
}

    .position-button:hover {
        color: #fff !important;
        background: #008bcd;
    }

.bold {
    padding-bottom: 0px !important;
    font-weight: bold;
    color: #555;
}

.viewmore-outer {
    padding-top: 8px;
}

.viewmore-link {
    height: 17px;
    background: #fff url(../images/Master/arrow.jpg) 0px 0px no-repeat;
    padding-left: 23px;
    padding-bottom: 3px;
    color: #555;
    font-weight: bold;
    text-decoration: underline;
    cursor: pointer;
}

    .viewmore-link:hover {
        color: #999;
    }

.textInput {
    padding: 3px;
    width: 95%;
    box-sizing: border-box;
    border: solid 1px #ccc;
    float: left;
}


.personal-info {
    float: left;
    width: 49%;
    border: none;
    padding-bottom: 10px;
}

.personal-info-inner {
    padding-right: 15px;
}

.apply-title {
    font-size: 18px !important;
    color: #004b8d;
    padding-bottom: 3px !important;
    line-height: 24px !important;
    border-bottom: solid 1px #004b8d;
    margin-bottom: 12px;
    clear: both;
}

.form-section {
    margin-bottom: 20px;
    width: 100%;
}

.personal-info-outer {
    display: inline-block;
}

.letter-resume-section {
    width: 100%;
    border: none;
}

.document-type {
    padding: 3px 0px 0px 0px;
    font-size: 11px;
    color: #888;
}

.checkbox-outer {
    width: 100%;
    display: inline-block;
}

.checkbox {
    display: inline-block;
    float: left;
    height: 35px;
    padding-right: 5px;
    padding-top: 2px;
    *padding-top: 0px;
    *margin-top: -1px;
}




textarea {
    width: 100%;
}

.form-paste-area {
    /*display: none;*/
    padding-bottom: 20px;
}

#letterForm, #resumeForm {
    display: none;
}

#legal {
    border: solid 1px #cacaca;
    display: block;
    padding: 10px 15px;
    margin-bottom: 12px;
    height: 100px;
    overflow-x: hidden;
    overflow-y: scroll;
}

.checkbox-legal {
    margin-bottom: 20px;
}


#certified_badge {
     height: auto;
    width: 58%;
}

/* MOBILE AND TABLET */

@media only screen and (max-width: 690px) {
    #main-content-outer td, #main-content-outer p, #main-content-outer a, #main-content-outer h2, #main-content-outer li {
        font-size: 15px;
        -webkit-text-size-adjust: none;
        -moz-text-size-adjust: none;
        -ms-text-size-adjust: none;
        line-height: 20px !important;
    }

    #main-content-outer h6 {
        font-size: 18px;
    }

    .apply-title {
        font-size: 23px !important;
        color: #004b8d;
        padding-bottom: 5px !important;
        line-height: 27px !important;
        border-bottom: solid 1px #004b8d;
        margin-bottom: 12px;
        clear: both;
    }

    #main-content-inner p.content-header {
        font-size: 26px !important;
        color: #004b8d;
        line-height: 28px !important;
    }
}

/* MOBILE */

@media only screen and (max-width: 480px) {

    #reference-outer {
        clear: both;
        width: 100% !important;
    }

    .personal-info {
        float: none;
        width: 100%;
        border: none;
        padding-bottom: 10px;
    }

    .personal-info-inner {
        padding-right: 0px;
    }

    #lglchkboxwrap .checkbox {
        height: 55px;
    }
}

/* MOBILE */

@media only screen and (max-width: 350px) {
    #lglchkboxwrap .checkbox {
        height: 75px;
    }
}


/*--------------------------------------------- IMAGE PLACEMENT --------------------------------------*/


/* SECTIONS EXTENDED */

#section-image {
    width: 100%;
    height: 275px;
}

.home-image {
    background: url(../images/MainImages/HomePage.jpg) 0px 0px no-repeat;
}

.benefits-image {
    background: url(../images/MainImages/BenefitsPage.jpg) 0px 0px no-repeat;
}

.career-image {
    background: url(../images/MainImages/Career-extended.jpg) 0px 0px no-repeat;
}

.diversity-image {
    background: url(../images/MainImages/DiversityPage.jpg) 0px 0px no-repeat;
}

.faq-image {
    background: url(../images/MainImages/FAQ-extended.jpg) 0px 0px no-repeat;
}

.life-image {
    background: url(../images/MainImages/LifePage.jpg) 0px 0px no-repeat;
}

.locations-image {
    background: url(../images/MainImages/Locations-extended.jpg) 0px 0px no-repeat;
}

.people-image {
    background: url(../images/MainImages/PeoplePage.jpg) 0px 0px no-repeat;
}

#section-title-mobile {
    display: none;
}


/* STANDARD */

@media only screen and (min-width: 691px) and (max-width: 960px) {
    #section-image {
        width: 100%;
        height: 275px;
    }
}

/* EXTENDED, STANDARD COMBINED */

@media only screen and (min-width: 691px) {
}


/* TABLET */

@media only screen and (min-width: 481px) and (max-width: 690px) {

    .home-image {
        background: url(../images/MainImages/HomePage.jpg) 0px 0px no-repeat;
    }

    .benefits-image {
        background: url(../images/MainImages/BenefitsPage.jpg) 0px 0px no-repeat;
    }

    .career-image {
        background: url(../images/MainImages/Career-tablet.jpg) 0px 0px no-repeat;
    }

    .diversity-image {
        background: url(../images/MainImages/DiversityPage.jpg) 0px 0px no-repeat;
    }

    .faq-image {
        background: url(../images/MainImages/FAQ-tablet.jpg) 0px 0px no-repeat;
    }

    .life-image {
        background: url(../images/MainImages/LifePage.jpg) 0px 0px no-repeat;
    }

    .locations-image {
        background: url(../images/MainImages/Locations-tablet.jpg) 0px 0px no-repeat;
    }

    .people-image {
        background: url(../images/MainImages/PeoplePage.jpg) 0px 0px no-repeat;
    }

    #section-title-mobile {
        padding-top: 160px;
        display: block;
    }

    .section-title {
        padding: 10px 20px 10px 35px;
        background: rgba(0,0,0,0.6);
        background: url(../images/Master/transparent_bg.png)\9;
    }

        .section-title h1 {
            color: #fff;
            font: normal 40px/40px roboto,Arial,Sans-Serif;
        }

    #section-image {
        width: 100%;
        height: auto;
    }
}

/* MOBILE */

@media only screen and (max-width: 480px) {
    .home-image {
        background: url(../images/MainImages/HomePage.jpg) 0px 0px no-repeat;
    }

    .benefits-image {
        background: url(../images/MainImages/BenefitsPage.jpg) 0px 0px no-repeat;
    }

    .career-image {
        background: url(../images/MainImages/Career-mobile.jpg) 0px 0px no-repeat;
    }

    .diversity-image {
        background: url(../images/MainImages/DiversityPage.jpg) 0px 0px no-repeat;
    }

    .faq-image {
        background: url(../images/MainImages/FAQ-mobile.jpg) 0px 0px no-repeat;
    }

    .life-image {
        background: url(../images/MainImages/LifePage.jpg) 0px 0px no-repeat;
    }

    .locations-image {
        background: url(../images/MainImages/Locations-mobile.jpg) 0px 0px no-repeat;
    }

    .people-image {
        background: url(../images/MainImages/PeoplePage.jpg) 0px 0px no-repeat;
    }

    #section-title-mobile {
        padding-top: 160px;
        display: block;
    }

    .section-title {
        padding: 10px 20px 10px 25px;
        background: rgba(0,0,0,0.6);
        background: url(../images/Master/transparent_bg.png)\9;
    }

        .section-title h1 {
            color: #fff;
            font: normal 38px/40px roboto,Arial,Sans-Serif;
        }

    #section-image {
        width: 100%;
        height: auto;
    }

     #certified_badge {
        width: 40%;
    }
}

/* MOBILE AND TABLET */

@media only screen and (max-width: 690px) {
}

/*--------------------------------------------- CALL TO ACTIONS --------------------------------------*/

.button-outer {
    display: block;
    width: 100%;
    text-align: center;
    border: solid 2px #fff;
}

.button-inner {
    padding: 6px 20px;
    color: #fff;
    font: bold 16px/18px roboto,Arial,Sans-Serif;
}

.button-outer:hover {
    background: #008bcd;
}


/* CALL TO ACTION EXTENDED */

#actions-outer {
    position: absolute;
    width: 30%;
    height: 275px;
    background: rgba(0,0,0,0.6);
    background: url(../images/Master/transparent_bg.png)\9;
    top: 0;
    right: 0;
}

#actions-inner {
    width: 100%;
    position: absolute;
    bottom: 25px;
}

#actions-buttons {
    position: relative;
    padding: 0px 40px 0px 25px;
}

.button-outer {
    margin-top: 12px;
    box-shadow: 2px 2px 5px #000;
}


/* STANDARD */

@media only screen and (min-width: 691px) and (max-width: 960px) {
    #actions-outer {
        position: absolute;
        width: 35%;
        height: 275px;
        background: rgba(0,0,0,0.6);
        background: url(../images/Master/transparent_bg.png)\9;
        top: 0;
        right: 0;
    }

    #actions-inner {
        width: 100%;
        position: absolute;
        bottom: 25px;
        left: 0px;
    }

    #actions-buttons {
        padding: 0px 35px 0px 20px;
    }
}


/* MOBILE AND TABLET */

@media only screen and (max-width: 690px) {

    #actions-outer {
        background: none;
        background: #004b8d;
        width: 100%;
        display: inline-block;
        position: relative;
        height: auto;
        top: auto;
        right: auto;
    }

    .button-outer {
        margin-bottom: 12px;
        box-shadow: 2px 2px 5px #000;
    }

    #actions-buttons {
        position: relative;
        padding: 0px;
    }
}

/* TABLET */

@media only screen and (min-width: 481px) and (max-width: 690px) {

    #actions-inner {
        /*padding: 20px 55px;*/
        width: 100%;
        position: relative;
        bottom: auto;
    }

    #actions-buttons {
        padding: 12px 55px 20px 55px;
        *padding: 20px 55px 20px 55px;
    }
}

/* MOBILE */

@media only screen and (max-width: 480px) {
    #actions-inner {
        width: 100%;
        position: relative;
        bottom: auto;
    }

    #actions-buttons {
        padding: 12px 25px 20px 25px;
        *padding: 20px 25px 20px 25px;
    }
}


/*--------------------------------------------- MAIN CONTENT --------------------------------------*/

#main-content-outer h1 {
    color: #40af49 ;
    font: normal 22px/25px roboto,Arial,Sans-Serif;
    padding-bottom: 12px;
}

.home-title {
    color: #777;
    font-size: 28px;
    line-height: 30px;
}

#tab-2-content, #tab-3-content {
    display: none;
}


.border-bottom {
    margin-bottom: 20px;
    padding-bottom: 40px !important;
    background: url(../images/Master/divider.jpg) bottom center no-repeat;
}

#main-content-outer li {
    margin-left: 35px;
    padding-right: 35px;
    list-style-type: disc;
    padding-bottom: 8px;
}

#main-content-outer ul {
    padding-bottom: 10px;
}

#main-content-outer a {
    text-decoration: underline;
}

    #main-content-outer a:hover {
        color: #999;
    }

#main-content-outer p {
    line-height: 18px;
    padding-bottom: 10px;
}

#main-content-outer h6 {
    font-size: 15px;
    padding: 0px 0px 7px 0px;
}

.content-header {
    color: #0048bd;
    font-size: 20px !important;
    color: #004b8d;
    line-height: 22px !important;
}

.top-margin {
    margin-top: 20px;
}




/* SECTIONS EXTENDED */


#main-content-outer {
    float: left;
    /*width: 70%;*/
    _width: 69%;
}

#main-content-inner {
    padding: 18px 40px 50px 50px;
}

.benefits-tab {
    padding: 6px 10px !important;
    margin-right: 3px !important;
}


/* EXTENDED, STANDARD, TABLET COMBINED */


#content-tabs-outer {
    display: inline-block;
    display: -moz-inline-block;
    vertical-align: top;
    font-size: 0px;
    position: relative;
    margin-top: 20px;
}

#main-content-outer #content-tabs-outer {
    padding-bottom: 0px;
}

#main-content-outer li.content-tabs {
    list-style-type: none;
    margin: 0px;
    margin-right: 5px;
    text-align: center;
}

#main-content-outer li.content-tabs {
    float: left;
    display: inline-block;
    padding: 6px 20px;
    font: normal 18px/21px roboto,Arial,Sans-Serif;
    color: #fff;
    cursor: pointer;
    border-bottom: solid 1px #cacaca;
}


#main-tab-box-outer {
    width: 100%;
    margin-top: -1px;
}

#main-tab-box-inner {
    border: solid 1px #cacaca;
    padding: 15px 20px;
}

#main-content-outer li.content-tab-select {
    background: #fff;
    color: #004b8d;
    border: solid 1px #cacaca;
    border-bottom: none;
}

.content-tab-hover:hover {
    background: #008bcd;
}

.main-tab-header-mobile {
    display: none;
}

.benefits-extended {
    margin-top: 8px !important;
    padding-top: 0px !important;
}

/* STANDARD */

@media only screen and (min-width: 691px) and (max-width: 960px) {
    #main-content-outer {
        float: left;
        width: 64.98%;
        _width: 64%;
    }

    #main-content-inner {
        padding: 18px 20px 50px 35px;
    }

    .benefits-tab {
        padding: 3px 6px !important;
        margin-right: 4px !important;
        width: 110px;
        line-height: 20px !important;
    }
}




/* TABLET */

@media only screen and (min-width: 481px) and (max-width: 690px) {
    li.content-tabs {
        float: left;
        padding: 6px 20px;
        color: #fff;
        cursor: pointer;
        border-bottom: solid 1px #cacaca;
    }

    .content-tab-select {
        background: #fff;
        color: #9b8850;
        border: solid 1px #cacaca;
        border-bottom: none;
    }

    .content-tab-hover:hover {
        background: #008bcd;
    }

    #main-content-outer {
        clear: both;
        width: 100%;
        float: none;
    }

    #main-content-inner {
        padding: 18px 35px 10px 35px;
    }

        #main-content-inner h1 {
            display: none;
        }

            #main-content-inner h1.terms-title {
                display: block !important;
            }

    #main-content-outer li.content-tabs {
        font: normal 21px/23px roboto,Arial,Sans-Serif;
        padding: 6px 14px;
    }

    .benefits-tab {
        padding: 5px 3px !important;
        width: 115px;
        font: normal 21px/20px roboto,Arial,Sans-Serif;
        margin-right: 5px !important;
    }
}

/* MOBILE */

@media only screen and (max-width: 480px) {

    #main-tab-box-outer {
        width: 100%;
        margin-top: 0px;
    }

    #main-tab-box-inner {
        border: none;
        padding: 0px;
    }

    #main-content-outer {
        width: 100%;
        float: none;
    }

    #main-content-inner h1, .content-tabs, #tab-2-content, #tab-3-content, #content-tabs-outer {
        display: none;
    }

        #main-content-inner h1.terms-title {
            display: block !important;
        }

    #main-content-inner {
        padding: 20px 0px 22px 0px;
        margin: 0px 25px;
      }


    .main-tab-header-mobile {
        font: normal 28px/31px roboto,Arial,Sans-Serif;
        padding: 12px 0px 8px 0px;
        width: 100%;
        cursor: pointer;
        background: url(../images/Master/mobile_expand.png) right no-repeat;
        display: block;
    }

    .main-tab-header-mobile-select {
        background: url(../images/Master/mobile_contract.png) right no-repeat;
    }

    .tab-container {
        background: url(../images/Master/divider.jpg) bottom center no-repeat;
        padding: 0px 0px 15px 0px;
    }

    .last-position {
        padding-bottom: 0px !important;
        background: none !important;
        margin-bottom: 0px !important;
    }

    .content-divider {
        background: url(../images/Master/divider.jpg) bottom center no-repeat;
        padding-bottom: 25px !important;
    }

    .benefits-mobile-tab-inner {
        font: normal 28px/31px roboto,Arial,Sans-Serif;
        padding-right: 35px;
        display: inline;
    }

    .content-image-left {
        float: left;
        padding: 5px 15px 5px 0px;
    }

    .content-image-right {
        float: right;
        padding: 5px 15px 7px 15px;
    }

    .global-image {
        width: 100%;
        float: none;
        padding: 0px;
        padding-bottom: 15px;
    }

    .unfcu-image {
        width: 115px;
    }
}

/* MOBILE AND TABLET */

@media only screen and (max-width: 690px) {
    .home-title {
        color: #fff;
        font-size: 28px;
        line-height: 30px;
    }
}

/*--------------------------------------------------------CONTENT IMAGES -------------------------------------------------------------------------*/


.content-image-left {
    float: left;
    padding: 3px 15px 5px 0px;
}

.content-image-right {
    float: right;
    padding: 3px 10px 5px 15px;
}

.unfcu-image {
    width: 135px;
}

.global-image {
    width: 275px;
}


/* MOBILE */

@media only screen and (max-width: 480px) {

    .content-image-left {
        float: left;
        padding: 5px 15px 5px 0px;
    }

    .content-image-right {
        float: right;
        padding: 5px 15px 7px 15px;
    }

    .global-image {
        width: 100%;
        float: none;
        padding: 0px;
        padding-bottom: 15px;
    }

    .unfcu-image {
        width: 115px;
    }

    .diversity-profile-image {
        width: 115px;
    }
}



/*--------------------------------------------- SECONDARY CONTENT --------------------------------------*/



/* SECTIONS EXTENDED */

#secondary-content {
    width: 30%;
    float: right;
}


/* STANDARD */

@media only screen and (min-width: 691px) and (max-width: 960px) {
    #secondary-content {
        width: 35%;
        float: right;
    }
}


/* EXTENDED AND STANDARD */


#secondary-outer {
    width: 100%;
}

#secondary-inner {
    padding: 25px 35px 20px 20px;
}

.secondary-border {
    border: solid 1px #cacaca;
    padding: 15px 17px 30px 20px;
    margin-bottom: 10px;
}

#secondary-inner h2 {
    font: normal 24px/27px roboto,Arial,Sans-Serif;
    padding-bottom: 8px;
    color: #004b8d;
}

#secondary-inner p {
    padding-bottom: 8px;
    line-height: 17px;
}

#people-side .secondary-quote {
    font-style: italic;
}

#people-side .secondary-name {
    color: #40af49;
    text-align: right;
    padding-right: 15px;
}



/*TABLET */

@media only screen and (min-width: 481px) and (max-width: 690px) {
    #secondary-content {
        width: 100%;
    }

    #secondary-outer {
        width: 100%;
        background: #fff;
    }

    #secondary-inner {
        padding: 10px 35px 10px 35px;
    }

    .secondary-border {
        border: solid 1px #cacaca;
        padding: 15px 17px 30px 20px;
        margin-bottom: 10px;
    }

    #secondary-inner h2 {
        font: normal 24px/27px roboto,Arial,Sans-Serif;
        padding-bottom: 8px;
        color: #004b8d;
    }

    .secondary-border p {
        font-size: 15px !important;
        line-height: 18px !important;
        padding-bottom: 10px;
    }

    #people-side .secondary-quote {
        font-style: italic;
        font-size: 16px;
    }

    #people-side .secondary-name {
        color: #40af49;
        text-align: right;
        padding-right: 15px;
    }
}


/* MOBILE */

@media only screen and (max-width: 480px) {

    #secondary-content {
        width: 100%;
    }

    #secondary-outer {
        background: #fff;
        padding: 0px;
    }

    #secondary-inner {
        padding: 0px;
    }

    .secondary-border {
        background: url(../images/Master/divider.jpg) bottom center no-repeat;
        padding: 20px 25px;
        padding-bottom: 40px;
        border: none;
    }

    #section-nav-content {
        padding: 10px;
        display: block;
    }

    #secondary-inner h2 {
        font: normal 24px/27px roboto,Arial,Sans-Serif;
        padding-bottom: 8px;
        color: #004b8d;
    }

    .secondary-border p {
        font-size: 15px !important;
        line-height: 20px !important;
        padding-bottom: 10px;
    }

    #people-side .secondary-quote {
        font-style: italic;
        font-size: 15px;
    }

    #people-side .secondary-name {
        color: #40af49;
        text-align: right;
        padding-right: 15px;
    }

    .position-button {
        padding: 5px 20px;
        color: #fff;
        text-decoration: none !important;
        font-size: 20px !important;
    }
}
