:root {
    /*  Talk to team about 70-20-10  */
    /*--primary: #fff;*/
    /*--secondary: #06548A;*/
    /*--accent: #4581B9;*/

    --primary-color: #00677F;
    --primary-teal: #00A2BC;
    --primary-gold: #FFB500;
    --primary-grey: #747679;
    --secondary-blue: #001A70;
    --secondary-red: #D3451E;
    --secondary-teal: #68D2DF;
    --secondary-olive: #B5BD00;
    --secondary-tan: #EED484;
    --secondary-green: #319B42;

    /* Default Font Colors */
    --main-text-dk: #494949;
    --header-text-dk: #00566B;
    --alt-text-dk: #707070;
    --main-text-lt: #ffffff;
    --alt-text-lt: #ececec;

    /* Default background color */
    --background-gray: #F1F4F6;

    /* Other Default */
    --box-shadow: 0 3px 6px -4px rgba(0, 0, 0, .35);
    --border-radius: 5px;
}


/************************/
/*      Over-rides      */
/************************/

/*:focus {*/
/*    outline-color: #FF0000 !important;*/
/*    outline-style: solid !important;*/
/*    outline-width: 2px !important;*/
/*}*/

.gold-border {
    border: 2px solid var(--primary-gold);
}
.gold-txt {
    color: var(--primary-gold);
}
.gold-background {
    background: var(--primary-gold);
}


/* Font Family Override */
body { font-family: 'Open Sans', 'Helvetica', 'Arial', 'sans-serif'; }

h1, h2, h3, h4, h5 {
    font-family: 'Arimo', 'Helvetica', 'Arial', 'sans-serif';
    color: var(--header-text-dk);
}

p {
    color: var(--main-text-dk);
    margin: 0;
    font-size: 18px;
}

li {
    font-size: 18px;
}

:focus {
    outline-color: unset !important;
    outline-style: unset !important;
    outline-width: unset !important;
}

:focus-visible,
div[password]:focus-within {
    outline-color: var(--alt-text-dk) !important;
    outline-style: solid !important;
    outline-width: 2px !important;
    outline-offset: 2px !important;
}

a { color: var(--primary-color) }

#erec_main_container[esar-layout] recruiter-header #layout-header-container {
    padding: 1rem 0;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr auto;
    grid-template-areas:
            'logo custom'
            'nav nav'
}

/* Primary button */
/*Note: #field_selection is a class on the admin panel*/
.btn-primary:not(#field_selection .btn-primary) {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    /*color: ;*/
}

.btn-primary:hover:not(#field_selection .btn-primary) {

}

.btn-primary:active:focus:not(#field_selection .btn-primary) {

}

.btn-primary:focus:not(#field_selection .btn-primary)  {

}


/* Button Link */
.btn-link:not(#field_selection .btn-link) {
    color: var(--primary-color);
}

.btn-link:hover:not(#field_selection .btn-link) {

}

.btn-link:active:focus:not(#field_selection .btn-link) {

}

.btn-link:focus:not(#field_selection .btn-link)  {

}

/*  Custom Buttons  */
.btn-hero {
    background: transparent;
    color: #fff;
    font-weight: 600;
    border: 1px solid #fff;
    border-radius: 30px;
    padding: 0.5rem 1.5rem;
    transition: all ease-out 200ms;
}

.btn-hero:hover {
    background-color: #fff;
    color: var(--primary-color);
}


.btn-login {
    border: 2px solid var(--primary-color);
    padding: 0.5rem 1.5rem;
    border-radius: 30px;
    font-weight: 700;
    text-decoration: none;
    transition: all ease-out 200ms;
}

.btn-login:hover {
    background-color: var(--primary-color);
    color: #fff;
}

/************************/
/*    Utility Classes   */
/************************/

.text-main { color: var(--main-text-dk)}
.text-main { color: var(--main-text-dk)}
.text-alt { color: var(--alt-text-dk)}
.text-primary { color: var(--primary-color)}
.bg-grey { background-color: var(--background-gray) }
.bg-white { background-color: #fff }