/* ==========================================================================
   15_LIBRARY THEME: GREEN;
   --------------------------------------------------------------------------
   * README

   * CSS VARIABLES

   * FALLBACK FOR --COLOR--BORDERS 

   * FALLBACK FOR --COLOR--MAIN
   * FALLBACK FOR --COLOR--MAIN--SUBTONE 1
   * FALLBACK FOR --COLOR--MAIN--SUBTONE 2

   * FALLBACK FOR --COLOR--SECONDARY
   * FALLBACK FOR --COLOR--SECONDARY--SUBTONE 1
   * FALLBACK FOR --COLOR--SECONDARY--SUBTONE 2

   * FALLBACK FOR --COLOR--TERTIARY
   * FALLBACK FOR --COLOR--TERTIARY--SUBTONE 1
   * FALLBACK FOR --COLOR--TERTIARY--SUBTONE 2

   * BACKGROUND IMAGE OVERRIDES
   ========================================================================== */

/* README
   ========================================================================== */

/*!
 * X
 */

/* CSS VARIABLES
   ========================================================================== */
:root {
    --color--borders: #FF555F;

    --color--main: #FF555F;
    --color--main--subtone1: #72D9BC;
    --color--main--subtone2: #E0F7F1;

    --color--secondary: #f75589;
    --color--secondary--subtone1: #EA447A;
    --color--secondary--subtone2: #FF74A0;

    --color--tertiary: #828282;
    --color--tertiary--subtone1: #D6D6D6;
    --color--tertiary--subtone2: #ECECEC;

    --color--buttons: #FFFFFF;

    /*
    --background--logo: url('https://obdbqa29353.xcade.net/portal/9/images/logo--default.svg');
    --background--banner--main: url('https://obdbqa29353.xcade.net/portal/9/images/banner--main.jpg');

    --background--sort--asc: url('https://obdbqa29353.xcade.net/portal/9/images/sort--asc.svg');
    --background--sort--des: url('https://obdbqa29353.xcade.net/portal/9/images/sort--des.svg');
    */
}

/* FALLBACK FOR --COLOR--BORDERS
   ========================================================================== */

/* 03_GENERALS: SITE: FOOTER
   -------------------------------------------------------------------------- */
.footer:before {
    border-top-color: #8F98A7;
    border: none;
}

.footer {
    background: #f5f4f4;
    display: block;
    height: auto;
}

.footer__wrapper {
    border-top: 1px solid #8F98A7;
}

/* 04_NAVIGATION: MAIN: DESKTOP ONLY
   -------------------------------------------------------------------------- */
@media all and (min-width:769px) {

    .nav__list--user {
        border-left-color: #8F98A7;
    }

    .subnav__item+.subnav__item {
        border-top-color: #8F98A7;
    }

}

/* 04_NAVIGATION: MAIN: MOBILE ONLY
   -------------------------------------------------------------------------- */
@media all and (max-width:768px) {

    .nav__item + .nav__item {
        border-top-color: #8F98A7;
    }

    .nav__list--user .subnav__item + .subnav__item {
        border-top-color: #8F98A7;
    }

}

/* 05_NAVIGATION: INTERNAL: TABS
   -------------------------------------------------------------------------- */
.tabs {
    border-bottom-color: #8F98A7;
}

.tabs__item {
    border-color: #8F98A7;
}

/* 07_GENERALS: SECTION: SECTION CONTENT
   -------------------------------------------------------------------------- */
@media all and (max-width:768px) {

    .section__content+.section__content {
        border-top-color: #8F98A7;
    }

}

/* 10_INFO ORGANIZATION: TABLES: DEFAULT
   -------------------------------------------------------------------------- */
.table--default {
    border-color: #8F98A7;
}

.table--default thead th {
    border-bottom-color: #8F98A7;
}

.table--default tbody tr+tr td {
    border-top-color: #8F98A7;
}

@media all and (max-width:768px) {

    .table--default tbody tr {
        border-color: #8F98A7;
    }

}

/* 10_INFO ORGANIZATION: TABLES: ACCORDION
   -------------------------------------------------------------------------- */
@media all and (max-width:768px) {

    .table--accordion tbody tr:before,
    .table--accordion tbody tr .table--accordion__toggle {
        border-left-color: #8F98A7;
    }

    .table--accordion tbody tr.table--accordion__open td.table--accordion__separator {
        border-top-color: #8F98A7;
    }

}

/* 11_FORM ELEMENTS: INPUT, SELECT & TEXTAREA
   -------------------------------------------------------------------------- */
.form input,
.form select,
.form textarea {
    border-color: #CCCCCC;
}

/* 12_FORM LAYOUT: FILE UPLOAD MODIFIERS
   -------------------------------------------------------------------------- */
div[class*="fieldSpec"].FileField.form__item--upload-with-dropbox-and-drive>div:not(.description) a {
    border-color: #8F98A7;
}

/* 12_FORM LAYOUT: SCHEDULING/TIMESLOT
   -------------------------------------------------------------------------- */
.schedulerWidget {
    border-color: #8F98A7;
}

.schedulerWidget .results {
    border-top-color: #8F98A7;
}

@media all and (min-width:769px) {

    .schedulerWidget .results {
        border-left-color: #8F98A7;
    }

}

/* 13_SNIPPETS AND HELPER CLASSES: MODIFICATOR SUFFIX: --BOXED
   -------------------------------------------------------------------------- */
[class*="--boxed"] {
    border-color: #8F98A7;
}

/* 13_SNIPPETS AND HELPER CLASSES: MODIFICATOR SUFFIX: --HR-TOP
   -------------------------------------------------------------------------- */
[class*="--hr-top"] {
    border-top-color: #8F98A7;
}

/* 13_SNIPPETS AND HELPER CLASSES: MODIFICATOR SUFFIX: --HR-BOTTOM
   -------------------------------------------------------------------------- */
[class*="--hr-bottom"] {
    border-bottom-color: #8F98A7;
}

/* 15_COMMON PAGETYPES: DETAIL: INFO ORGANIZATION LEVEL: ATTACHMENTS
   -------------------------------------------------------------------------- */
.attachement-preview.attachement-preview--show {
    border-color: #8F98A7;
}

/* 15_COMMON PAGETYPES: WIDGET: SOCIAL SHARE
   -------------------------------------------------------------------------- */
.section .social-share__popup {
    border-color: #8F98A7
}


/* FALLBACK FOR --COLOR--MAIN
   ========================================================================== */

/* 03_GENERALS: SITE: BANNER
   -------------------------------------------------------------------------- */
.banner {
    background-color: #FF555F;
}

/* 04_NAVIGATION: MAIN: DESKTOP AND MOBILE
   -------------------------------------------------------------------------- */
.nav__item__link:hover {
    color: #FF555F;
}

.nav__item--with-subnav:hover .subnav__item__link:hover {
    color: #FF555F;
}

/* 04_NAVIGATION: MAIN: DESKTOP ONLY
   -------------------------------------------------------------------------- */
@media all and (min-width:769px) {

    .nav__item--active .nav__item__link {
        color: #FF555F;
    }

    .subnav__item--active .subnav__item__link {
        color: #FF555F;
    }

}

/* 05_NAVIGATION: INTERNAL: BREADCRUMBS
   -------------------------------------------------------------------------- */
 .breadcrumbs__item {
    color: #FF555F;
}

/* 05_NAVIGATION: INTERNAL: TABS
   -------------------------------------------------------------------------- */
.tabs__item {
    color: #FF555F;
}

/* 05_NAVIGATION: INTERNAL: PAGINATION
   -------------------------------------------------------------------------- */
.currentPageLink,
.currentPageLink:hover,
.currentPageLink:active,
.currentPageLink:visited {
    border-bottom-color: #FF555F;
}

/* 10_INFO ORGANIZATION: TABLES: SORT
   -------------------------------------------------------------------------- */
.sort__item--active {
    color: #FF555F;
}

.sort__item--ASC,
.sort__item:hover,
.sort__item:focus,
.sort__item:active {
    border-bottom-color: #00AECF;
}

/* 11_FORM ELEMENTS: INPUT, SELECT & TEXTAREA
   -------------------------------------------------------------------------- */
.form input:focus,
.form select:focus,
.form textarea:focus {
    border-color: #00AECF;
}

/* 11_FORM ELEMENTS: BUTTONS
   -------------------------------------------------------------------------- */
button,
button:link,
button:visited,
.genericButton,
.genericButton:link,
.genericButton:visited,
.saveButton,
.saveButton:link,
.saveButton:visited,
.nextButton,
.nextButton:link,
.nextButton:visited,
.gotoButton,
.gotoButton:link,
.gotoButton:visited,
.button--default,
.button--default:link,
.button--default:visited {
    border-color: #FF555F;
    background-color: #FF555F;
    color: #FFFFFF;
}

.previousButton,
.previousButton:link,
.previousButton:visited,
.homeButton,
.homeButton:link,
.homeButton:visited,
.clearButton,
.clearButton:link,
.clearButton:visited,
.cancelButton,
.cancelButton:link,
.cancelButton:visited,
.button--cancel,
.button--cancel:link,
.button--cancel:visited {
    border-color: #00AECF;
    color: #00AECF;
    background-color: #FFFFFF;
}

.button--action-default,
.button--action-default:link,
.button--action-default:visited {
    color: #FF555F;
}

button:hover,
button:active,
.genericButton:hover,
.genericButton:active,
.saveButton:hover,
.saveButton:active,
.nextButton:hover,
.nextButton:active,
.gotoButton:hover,
.gotoButton:active,
.button--default:hover,
.button--default:active {
    border-color: #FF555F;
}

.previousButton:hover,
.previousButton:active,
.homeButton:hover,
.homeButton:active,
.clearButton:hover,
.clearButton:active,
.cancelButton:hover,
.cancelButton:active,
.button--cancel:hover,
.button--cancel:active {
    border-color: #00AECF;
    color: #00AECF;
}

.button--action-default:hover,
.button--action-default:active {
    color: #FF555F;
}

.redirectUrlButton:focus,
.button--secondary:focus {
    color: #00AECF;
}

.previousButton:focus,
.homeButton:focus,
.clearButton:focus,
.cancelButton:focus,
.button--cancel:focus {
    color: #00AECF;
}

.button--action-default:focus {
    color: #FFFFFF;
}

/* 12_FORM LAYOUT: CHECKBOXES LIST
   -------------------------------------------------------------------------- */
.CheckBoxListFormField_more {
    color: #FF555F;
}

/* 12_FORM LAYOUT: DATASET
   -------------------------------------------------------------------------- */
.addDatasetRow {
    color: #FF555F;
}

/* 12_FORM LAYOUT: RADIOS LIST
   -------------------------------------------------------------------------- */
.RadioButtonListFormField_more {
    color: #FF555F;
}

/* 12_FORM LAYOUT: SCHEDULING/TIMESLOT
   -------------------------------------------------------------------------- */
.datepicker-skin-scheduling .ui-datepicker .ui-datepicker-current-day,
.datepicker-skin-scheduling .ui-datepicker .ui-datepicker-current-day a,
.datepicker-skin-scheduling .ui-datepicker .ui-datepicker-current-day a.ui-state-hover {
    background-color: #FF555F;
}

/* 13_SNIPPETS AND HELPER CLASSES: TEXT: LINK LIKE
   -------------------------------------------------------------------------- */
.link {
    color: #FF555F;
}

/* 13_SNIPPETS AND HELPER CLASSES: SNIPPET: POP-UP ON HOVER
   -------------------------------------------------------------------------- */
.popup-on-hover .popup-on-hover__link {
    color: #FF555F;
}

.popup-on-hover:hover .popup-on-hover__link:hover {
    color: #FF555F;
}

/* 15_COMMON PAGETYPES: DETAIL: ARTICLE LEVEL
   -------------------------------------------------------------------------- */
.article--details .article__header__text__title__icon {
    color: #FF555F;
}

/* 15_COMMON PAGETYPES: DETAIL ASIDE: INFO ORGANIZATION LEVEL
   -------------------------------------------------------------------------- */
.list--view-more-aside .list__item:hover .list__item__text__title {
    color: #FF555F;
}

/* 15_COMMON PAGETYPES: WIDGET: SOCIAL SHARE
   -------------------------------------------------------------------------- */
.social-share__popup__icon:hover{
    color: #FF555F;
}

/* 15_COMMON PAGETYPES: SEARCH JOBS: INFO ORGANIZATION LEVEL
   -------------------------------------------------------------------------- */
.list--jobs .list__item__text__title a:hover {
    color: #FF555F;
}

/* FALLBACK FOR --COLOR--MAIN--SUBTONE 1
   ========================================================================== */

/* 04_NAVIGATION: MAIN: DESKTOP AND MOBILE
   -------------------------------------------------------------------------- */
.nav__item__link:focus {
    color: #72D9BC;
}

.nav__item--with-subnav:hover .subnav__item__link:focus {
    color: #72D9BC;
}

/* 11_FORM ELEMENTS: BUTTONS
   -------------------------------------------------------------------------- */
button:hover,
button:active,
.genericButton:hover,
.genericButton:active,
.saveButton:hover,
.saveButton:active,
.nextButton:hover,
.nextButton:active,
.gotoButton:hover,
.gotoButton:active,
.button--default:hover,
.button--default:active {
    background-color: #FF555F;
}

.button--action-default:hover,
.button--action-default:active {
    border-color: #72D9BC;
}

button:focus,
.genericButton:focus,
.saveButton:focus,
.nextButton:focus,
.gotoButton:focus,
.button--default:focus {
    background-color: #FF555F;
}

.redirectUrlButton:focus,
.button--secondary:focus {
    background-color: #FFFFFF;
}

.button--action-default:focus {
    border-color: #FF555F;
}

/* FALLBACK FOR --COLOR--MAIN--SUBTONE 2
   ========================================================================== */

/* 11_FORM ELEMENTS: BUTTONS
   -------------------------------------------------------------------------- */
.previousButton:hover,
.previousButton:active,
.homeButton:hover,
.homeButton:active,
.clearButton:hover,
.clearButton:active,
.cancelButton:hover,
.cancelButton:active,
.button--cancel:hover,
.button--cancel:active {
    background-color: #FFFFFF;
}

.button--action-default:hover,
.button--action-default:active {
    background-color: #E0F7F1;
}

.previousButton:focus,
.homeButton:focus,
.clearButton:focus,
.cancelButton:focus,
.button--cancel:focus {
    background-color: #FFFFFF;
}

.button--action-default:focus {
    background-color: #FF555F;
}

/* FALLBACK FOR --COLOR--SECONDARY
   ========================================================================== */

/* 11_FORM ELEMENTS: BUTTONS
   -------------------------------------------------------------------------- */
.redirectUrlButton,
.redirectUrlButton:link,
.redirectUrlButton:visited,
.button--secondary,
.button--secondary:link,
.button--secondary:visited {
    border-color: #F75589;
    background-color: #F75589;
}

/* * FALLBACK FOR --COLOR--SECONDARY--SUBTONE 1
   ========================================================================== */

/* 11_FORM ELEMENTS: BUTTONS
   -------------------------------------------------------------------------- */
.redirectUrlButton:hover,
.redirectUrlButton:active,
.button--secondary:hover,
.button--secondary:active {
    border-color: #EA447A;
}

/* FALLBACK FOR --COLOR--SECONDARY--SUBTONE 2
   ========================================================================== */

/* 11_FORM ELEMENTS: BUTTONS
   -------------------------------------------------------------------------- */
.redirectUrlButton:hover,
.redirectUrlButton:active,
.button--secondary:hover,
.button--secondary:active {
    background-color: #FF74A0;
}

/* FALLBACK FOR --COLOR--TERTIARY
   ========================================================================== */

/* 11_FORM ELEMENTS: BUTTONS
   -------------------------------------------------------------------------- */
.button--action-secondary,
.button--action-secondary:link,
.button--action-secondary:visited {
    color: #828282;
}

.button--action-secondary:hover,
.button--action-secondary:active {
    color: #828282;
}

.button--action-disabled,
.button--action-disabled:link,
.button--action-disabled:visited {
    color: #828282;
}

.button--action-disabled:hover,
.button--action-disabled:active {
    color: #828282;
}

.button--action-secondary:focus {
    color: #828282;
}

.button--action-disabled:focus {
    color: #828282;
}

/* FALLBACK FOR --COLOR--TERTIARY--SUBTONE 1
   ========================================================================== */

/* 11_FORM ELEMENTS: BUTTONS
   -------------------------------------------------------------------------- */
.button--action-secondary:hover,
.button--action-secondary:active {
    border-color: #D6D6D6;
}

.button--action-secondary:focus {
    border-color: #D6D6D6;
}

/* FALLBACK FOR --COLOR--TERTIARY--SUBTONE 2
   ========================================================================== */

:root {
  --color--tertiary--subtone2: #ECECEC;
}

/* 11_FORM ELEMENTS: BUTTONS
   -------------------------------------------------------------------------- */
.button--action-secondary:hover,
.button--action-secondary:active {
    background-color: #ECECEC;
}

.button--action-secondary:focus {
    background-color: #ECECEC;
}

/* BACKGROUND IMAGE OVERRIDES
   ========================================================================== */

/* 03_GENERALS: SITE: HEADER
   -------------------------------------------------------------------------- */
.header__logo {
    background-image: url('../images/logo--default.svg');
}

/* 03_GENERALS: SITE: BANNER
   -------------------------------------------------------------------------- */
.banner--main {
    background-image: url('../images/banner--main.jpg');
}

/* 10_INFO ORGANIZATION: TABLES: SORT
   -------------------------------------------------------------------------- */
.sort__item--ASC,
.sort__item:hover,
.sort__item:focus,
.sort__item:active {
    background-image: url('../images/sort--asc.svg');
}

.sort__item--DESC,
.sort__item--ASC:hover,
.sort__item--ASC:focus,
.sort__item--ASC:active {
    background-image: url('../images/sort--des.svg');
}

/* 10_INFO ORGANIZATION: TABLES: ACCORDION
   -------------------------------------------------------------------------- */
@media all and (max-width:768px) {

    .table--accordion tbody tr:before,
    .table--accordion tbody tr .table--accordion__toggle {
        background-image: url('../images/sort--asc.svg');
    }

    .table--accordion tbody tr.table--accordion__open:before,
    .table--accordion tbody tr.table--accordion__open .table--accordion__toggle {
        background-image: url('../images/sort--des.svg');
    }

}

h1, h2, h3, h4, h5, h6 {
    font-family: Georgia, serif;
}

h3 {
    font-size: 18px;
    font-weight: 700;
    font-family: Georgia, serif;
    color: #073262;
}

.fieldSpec.formContainer .FormHeader h3 {
    font-size: 24px;
    font-weight: 400;
    font-family: Georgia, serif;
    color: #00AECF;
}

.section__header__text__title {
    font-size: 30px;
    font-weight: 400;
    font-family: Georgia, serif;
    color: #00AECF;
    text-align: center;
}

div[class*="labelText"] {
    color: #000000;
    font-size: 16px;
    font-weight: 700;
}

[class*="__wrapper"] {
    max-width: 750px;
    background-color: #FFFFFF;
}

.main__wrapper {
  padding-top: 50px;
  padding-bottom: 50px;
}

.footer__wrapper {
  background-color: #BFBFBF;
}

.section__content .grid__item {
    text-align: center;
}

.banner--main {
  height: 127px;
}

.select2-container--default .select2-search--inline .select2-search__field {
  max-width: 100% !important;
  width: 100% !important;
}

.footer__rights {
  line-height: 42px;
}

.footer__rights a {
  color: #1a3f70;
}

.footer__media p {
  color: #3F3F3F;
}

.mobileHeaderImage {
    display: none;
}
@media all and (max-width:768px)  {
    .mobileHeaderImage {
        width: 100%;
        clear: both;
        display: block;
        max-width: 100%;
    }
    .banner--main {
        height: auto;
        background-image: none;
    }
    .footerThankYou {
        height: 0;
        display: table-row;
    }
}

.select2-container--default .select2-selection--single .select2-selection__placeholder{
    color: #565656;
    font-size: 14px;
}

.select2-container--default .select2-selection--single{
      border: 1px solid #CCC;
      height: 40px;
      padding-top: 4px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow{
    top: 9px;
    right: 0px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b{
    border-color: #565656 transparent transparent transparent;
    border-width: 7px 3px 0 3px;
}

/* VISUAL ADJUSTMENTS
   -------------------------------------------------------------------------- */

.FormCompletionRequestBlockContainer {
    width: 100%;
}

.FieldBorderFormCompletionRequestFieldBorder {
    margin-bottom: 20px;
}

.DateInput {
    width: 50%;
}

.DateInput .InputIcon {
    position: absolute;
    top: 3px;
    right: 10px;
}

.DatePicker .TIN_input_date_Toolbar_MonthWrapper,
.DatePicker .TIN_input_date_Toolbar_YearWrapper {
    display: flex;
    float: none;
}

.DatePicker .TIN_input_date_Toolbar_YearWrapper {
    margin-top: 10px;
}

.uicore_layout_CollapsibleContainer_Title {
    line-height: normal;
    white-space: normal;
}
