@font-face {
    font-family: 'WorkSansRegular';
    src: url(/fonts/WorkSans/WorkSans-Regular.ttf) format("truetype");
}

@font-face {
    font-family: 'WorkSansItalic';
    src: url(/fonts/WorkSans/WorkSans-Italic.ttf) format("truetype");
}

@font-face {
    font-family: 'WorkSansSemiBold';
    src: url(/fonts/WorkSans/WorkSans-SemiBold.ttf) format("truetype");
}

@font-face {
    font-family: 'WorkSansSemiBoldItalic';
    src: url(/fonts/WorkSans/WorkSans-SemiBoldItalic.ttf) format("truetype");
}

:root {
    --dark-grey: #222;
    --long-life-blue: #00157A;
    --river-grey: #E7EEEF;
    --obogreyishbrown: #CCCAC7;
    --error-red: #FF0000;
}

*, body {
    font-family: WorkSansRegular, Arial, Helvetica, sans-serif;
}

h1, h2, h3, h4, h5 {
    color: var(--dark-grey);
    font-family: WorkSansSemiBold, Arial, Helvetica, sans-serif;
    margin-bottom: 20px;
}

button {
    font-family: WorkSansSemiBold, Arial, Helvetica, sans-serif;
}

.header {
    position: relative;
    height: 90px;
}

.ob-logo {
    margin: 31px 0;
}

input {
    border: 0 !important;
    width: 100%;
    padding: 5px;
    border-bottom: 1px solid var(--obogreyishbrown) !important;
}

    input:focus {
        outline: none;
        box-shadow: none;
        background-color: #eef6f8;
        border-bottom: 1px solid var(--long-life-blue) !important;
        transition: background-color .5s ease;
    }

    input:disabled {
        background-color: var(--river-grey) !important;
    }

a {
    color: var(--long-life-blue) !important;
    font-weight: bold !important;
}

.btn-box {
    display: flex;
    justify-content: flex-end;
}

.ob-btn {
    border: unset;
    background-color: var(--river-grey);
    border-radius: 24px;
    font-weight: bold;
    color: var(--dark-grey);
    font-size: 16px;
    cursor: pointer;
    min-width: 200px;
    padding: .5rem 1rem;
    transition: background-color .5s ease;
}

    .ob-btn.primary {
        background-color: var(--long-life-blue);
        color: white;
    }

.right {
    float: right;
}

.text-danger {
    color: var(--error-red) !important;
}

.info-text {
    font-size: 12px;
}

    .info-text .glyphicon {
        color: var(--long-life-blue);
    }

table td {
    padding: 5px;
}

table tr td:first-child {
    font-weight: bold;
}

.form-control-disabled {
    color: #999690;
    background-color: #f7f7f7 !important;
}