/*-------------------------------------------------------------------------
These styles apply to the main working area.  Style specific to the
Survox Console menus, etc are in NavFrame.css

Enghouse branding colors are below to easily find then and cut and paste.
I've just grabbed any properties that have colors since my IDE shows
thumbnails, so the properties don't mean anything
-------------------------------------------------------------------------*/

:root {
    /* Enghouse primary colors */
    --color-primary-1: #01529d; /* rgb(1, 82, 157) -- color from logo, guide says #003591 */
    --color-primary-2: #72B5CC; /* rgb(114, 181, 204) */

    /* Enghouse secondary colors */
    --color-secondary-1: #000000; /* black */
    --color-secondary-2: #ffffff; /* white */
    --color-secondary-3: #808080; /* grey */

    /* Enghouse accent colors */
    --color-accent-1: #EF415D; /* rgb(240, 65, 95) */
    --color-accent-2: #00A5B6; /* rgb(0, 165, 182) */
    --color-accent-3: #CFDD28; /* rgb(207, 220, 40) */
    --color-accent-4: #8C5CA4; /* rgb(140, 90, 165); */
    --color-accent-5: #F15D2A; /* rgb(240, 93, 42); */
    --color-accent-6: #001539; /* rgb(0, 21, 57); */

    /* Survox Console */
    --font-main: Calibri, sans-serif;
    --font-monospace: Consolas, monospace;
    --color-font-main: #414141;
    --color-font-dark: black;

    --color-background-1: white;
    --color-background-2: #dcecf2;
    --color-background-3: rgba(240, 65, 95, 0.15);
    --color-background-grey: #eeeeee;

    --color-button-fg: white;
    --color-button-bg: #01529d;
    --color-button-bg-hover: #72B5CC;

    --color-grey-1: #ebebeb;
    --color-grey-2: #d9d9d9;
    --color-grey-3: #cccccc;
    --color-grey-4: #bfbfbf;
    --color-grey-5: #808080;
    --color-grey-6: #414141;

    --border-1: 1px solid #72B5CC;
    --border-3: 1px solid #cccccc;
    --border-4: 1px solid #bfbfbf;
    --border-5: 1px solid #808080;
}


/*-------------------------------------------------------------------------
`XHTML, HTML4, HTML5 Reset
Some browsers have different default values for some settings.  The following rules
make them behave the same
-------------------------------------------------------------------------*/
html, body {
    height: 100%;
}

/* Reset margins, etc */
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite,
code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, font, footer, form,
h1, h2, h3, h4, h5, h6, header, hgroup, hr, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, meter,
nav, object, ol, output, p, pre, progress, q, rp, rt, ruby, s, samp, section, small, span, strike, strong, sub,
summary, sup, table, thead, tfoot, tbody, td, th, time, tr, tt, u, ul, var, video {
    margin: 0;
    padding: 0;
    font-size: 100%;
}

/* Override the default (display: inline) for browsers that do not recognize HTML5 tags.  */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

/* Makes browsers agree.  IE + Opera = font-weight: bold.  Gecko + WebKit = font-weight: bolder.  */
b, strong, .bold  {
    font-weight: bold;
}

/* For IE.  http://css-tricks.com/ie-fix-bicubic-scaling-for-images */
img {
    color: transparent;
    font-size: 0;
    vertical-align: middle;
    -ms-interpolation-mode: bicubic;
}

/* For IE6 + IE7: "display: list-item" keeps bullets from disappearing if hasLayout is triggered.  */
ol, ul {
    list-style: none;
}

li {
    display: list-item;
}

th, td, caption {
    font-weight: normal;
    vertical-align: top;
    text-align: left;
}

/* defaults for quotes */
q {
    quotes: none;
}

q:before, q:after {
    content: none;
}

/* defaults for super/sub-scripts */
sub, sup, small {
    font-size: 75%;
}

sub, sup {
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

/* For IE9. Without, occasionally draws shapes outside the boundaries of <svg> rectangle.  */
svg {
    overflow: hidden;
}

/*-------------------------------------------------------------------------
-------------------------------------------------------------------------*/
/*
 * Set fonts
 ----------------------------------------------------------------------------------------------------*/

body, input, textarea, button {
    font-family: var(--font-main);
    font-size: 16px; /* 14px */
    background-color: var(--color-background-1);
    color: var(--color-font-main);
}

pre, code {
    font-family: var(--font-monospace);
}


/*
 * Links
 ----------------------------------------------------------------------------------------------------*/

a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
    cursor: pointer;
}

a:active {
    text-decoration: underline;
}

/* Headings
----------------------------------------------------------------------------------------------------*/

h1 {
    font-size: 1.4em;
}

h2 {
    font-size: 1.3em;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5 {
    font-size: .9em;
}

h6 {
    font-size: .75em;
}

.title,
.heading {
    font-weight: bold;
}

.h4-like {
    font-size: 1.1em;
    font-weight: bold;
    margin: 10px 15px 7px 0;
}

h1.success {
    margin-bottom: 1em;
}

h2.success {
    margin-bottom: 1em;
}

h3.success {
    margin-bottom: 1em;
}

h4.success {
    margin-bottom: 1em;
}

/* Spacing / Position
----------------------------------------------------------------------------------------------------*/

div {
    vertical-align: top;
}

ol {
    list-style: decimal;
}

ul {
    list-style: disc;
}

ul.no_bullet {
    list-style-type: none;
    margin-bottom: 0.5em;
}

ul.items-only {
    list-style-type: none;
}


ul.items-only li {
    margin-left: 0;
}

li {
    margin-left: 30px;
}

ul.no_indent li {
    margin-left: 0;
}

table, tr {
    border-collapse: collapse;
    border-spacing: 0;
    border: 1px solid #ebebeb;

}

dl, hr, ol, ul, pre, table, address, figure {
    margin-bottom: 20px;
}

p, fieldset {
    margin-bottom: .75em;
}

.align_m {
    vertical-align: middle;
}

.float_r {
    float: right;
}

.full_width {
    width: 100%;
}

.lg_margin {
    margin: 10px 0 7px 0;
}

.rt_margin {
    margin-right: 15px;
}

.indent_xsm {
    padding-left: 5px;
}

.indent_sm {
    padding-left: 0.5rem;
}

.indent-med {
    margin-left: 1rem;
}

.indent-lg {
    margin-left: 2rem;
}

.indent-xlg {
    margin-left: 5rem;
}

.indent_10 {
    margin-left: 10px;
}

.indent_20 {
    margin-left: 20px;
}

.indent_30 {
    margin-left: 30px;
}

.indent_40 {
    margin-left: 40px;
}

.indent_50 {
    margin-left: 50px;
}

.indent_60 {
    margin-left: 60px;
}

.workspace,
.workSpace,
.responseDiv {
    margin-top: 5px;
}

.ptop-sm {
    padding-top:10px;
}

/* common styles */

.justify-left {
    text-align: left;
}

div.justify-left, span.justify-left {
    float: left;
}

.justify-right {
    text-align: right;
}

div.justify-right, span.justify-right {
    float: right;
}

.inline {
    display: inline;
}


/* Form Element Defaults
----------------------------------------------------------------------------------------------------*/
input[type='submit'],
input[type='image'],
input[type='button'],
input[type='radio'],
input[type='checkbox'],
input[type='file'],
label[for],
select,
button,
.section,
.showHide,
.showHide_all,
.show_all,
.hide_all,
.clickText,
.instruct,
#select_dates input[type='text'] {
    cursor: pointer;
}

input[type='text'],
input[type='email'],
input[type='password'],
select {
    width: 200px;
    padding: 2px;
    vertical-align: middle;
}

select[multiple] {
    height: 100px;
}

input[type='checkbox'] {
    vertical-align: middle;
}


.baseList select,
.destList select {
    width: 275px;
    height: 100px;
}

input:focus, textarea:focus /* remove default focussed input styling */
{
    outline: none;
}

textarea {
    resize: vertical;
    overflow: auto;
    width: 300px;
}

th,
td {
    padding: 3px;
}

th {
    font-weight: bold;
}

/* form element styles */
input[type='text'].textBox-sm, .textBox-sm {
    width: 50px;
}

input[type='text'].textBox-med, .textBox-med {
    width: 100px;
}

.textBox-lg,
input[type='text'].textBox-lg,
input[type='password'].textBox-lg {
    width: 150px;
}

.text-wide,
input[type='text'].text-wide,
input[type='password'].text-wide {
    width: 20em;
}

.text-widest,
input[type='text'].text-widest,
input[type='password'].text-widest {
    width: 30em;
}


/*
 * Content blocks
 ----------------------------------------------------------------------------------------------------*/

html {
    min-width: 100%;
    min-height: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body {
    min-width: 960px;
    height: 100%;
    line-height: 1.4;
    background-color: #ffffff;
}

.flex-row {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-direction: row;
}

.flex-col {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
}

.flex-expander {
    flex-grow: 1;
}


/*
 * Globals
 ----------------------------------------------------------------------------------------------------*/
.box {
    padding: 12px 0;
}

img {
    vertical-align: middle;
}

.titleBar_instructError {
    margin-left: 20px;
}

.hidden,
.hide_at_start,
.hideatstart {
    display: none;
}

iframe {
    margin-top: 10px;
    /*height: auto;*/
    width: 100%;
    min-height: 800px;
    height: 100%;
    overflow: hidden;
    overflow-y: scroll;
    border: 1px solid #ebebeb;
}

.titleBar_error {
    font-weight: bold;
}

hr,
.breakLine,
#breakLine {
    border-top-width: 1px;
    clear: both;
    height: 0;
    margin: 12px 0 7px 0;
}

/* Helper classes
----------------------------------------------------------------------------------------------------*/
.ajaxLoading {
    width: 80%;
    min-height: 20px;
    min-width: 32px;
    background: url(../images/ajax-loader.gif) no-repeat center;
}

#result {
    display: inline;
    padding: 3px 100px 3px 100px;
    background: url(../images/ajax-loader.gif) no-repeat center;
}

.note,
.note_postit,
.InfoText {
    display: inline-block;
    min-width: 30%;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
    padding: 1rem 2rem 1rem 4rem;
    background: #ebebeb url(../images/note.png) no-repeat;
}

/*.note_postit {*/
/*    margin: 17px 0 5px 0;*/
/*    padding: 7px 7px 10px 65px;*/
/*    color: var(--color-font-dark);*/
/*    background: rgba(140, 90, 165, 0.08) url(../../images/note.png) no-repeat;*/
/*}*/


.cautionBox {
    width: 80%;
    padding: 20px;
    margin: 12px 0 12px 0;
    border: 1px solid #ebebeb;
}

.info_block {
    font-weight: bold;
    padding: 1.5em;
    border: var(--border-1);
    background-color: rgba(114, 181, 204, 0.075);
}

.warning_block {
    font-weight: bold;
    padding: 1.0em;
    margin: 1em 0;
    border: 1px solid var(--color-accent-1);
    background-color: rgba(240, 65, 95, 0.075);

}


/*-------------------------------------------------------------------------
-------------------------------------------------------------------------*/
.noborder, .noborder tr, .noborder th, .noborder td {
    border: none;
}

.clickable-border {
    border: var(--border-1);
    cursor: pointer;
}

.InfoText {
    display: none;
}

/*-------------------------------------------------------------------------
These seem to define classes and so don't look like they belong here
-------------------------------------------------------------------------*/

.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

.clearfix:before,
.clearfix:after {
    content: '.';
    display: block;
    overflow: hidden;
    visibility: hidden;
    font-size: 0;
    line-height: 0;
    width: 0;
    height: 0;
}

.clearfix:after, .clear-both {
    clear: both;
}

.clearfix {
    zoom: 1; /* specifically for IE6 + IE7.  */
}



/*-------------------------------------------------------------------------
modal and pop-up content
-------------------------------------------------------------------------*/
dialog::backdrop {
    background-color: rgba(0 0 0 / 50%);
}

.popButton {
    margin: 1rem 0 0 45%;
}

.modal-prompt,
.modal-content {
    position: fixed;
    min-width: 30%;
    max-width: 60%;
    /*height: 60%;*/
    max-height: 85%;
    overflow: auto;
    left: 50%;
    top: 100px;
    margin-left: -30%;
    padding: 1rem;
    border-radius: .7rem;
    -moz-border-radius: .7rem;
    -webkit-border-radius: .7rem;
    z-index: 1000;
}

.modal-prompt,
.modal-content {
    border: 5px solid #01529d;
    background-color: #fff;
}

.modal-prompt .title,
.modal-content .title {
    margin-bottom: 1em;
    font-size: 1.6em;
    color: #01529d;
}

.modal-prompt .title {
    background: url(../images/user_prompt.gif) no-repeat top left;
    padding-left: 45px;
}

.modal-prompt .instructions,
.modal-content .instructions {
    padding: 7px 0 0 7px;
}

.modal-prompt .buttons,
.modal-content .buttons {
    padding-top: 20px;
    text-align: center;
}

#modal-background,
.modal-background {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    background-color: rgba(0, 0, 0, 25%);
    z-index: 50;
}

/*
 *  extend jQuery-ui widget settings
 */
.ui-widget {
    font-size: .9em;
}

.ui-tooltip {
    padding: 2px 7px 2px 7px;
    font-size: .9em;
}

/* main workspace classes
 ********************************************/

.assign td {
    padding: 0 5px;
}

table.assign,
table.assign tr {
    border: 0;
}

table.two_column,
table.two_column tr {
    border: 0;
}

/* --- title bars --- */
.titleBar,
#titleBar_top,
.titleBar_top,
.titleBar_right,
.element_heading {
    font-size: 1.1em;
    font-weight: bold;
    background-color: #fff;
    color: #01529d;
    padding-left: 0;
    margin-left: 0;
    border-bottom: var(--border-1);
    margin-bottom: 1ex;
}

.titleBar,
.element_heading {
    margin-top: 15px;
}

.titleBar_instruct,
.titleBar_Instruct {
    margin-left: 20px;
    font-size: .9em;
    font-weight: normal;
}

/* --- item cards --- */
.card {
    margin-bottom: 1em;
}

.card .card-header {
    color: #01529d;
    background-color: #ebebeb;
    border: thin solid #01529d;
    margin: 0;
    padding: 1ex;
}

.card .card-header-inactive {
    /*color: #414141;*/
    background-color: #d9d9d9;
    border: thin solid #cccccc;
    margin: 0;
    padding: 1ex;
}

.card .card-body {
    border: thin solid #d9d9d9;
    border-top: 0;
    padding: 2ex;
}


dl.description {
    padding-bottom: .5em;
}

dl.description dt {
    font-weight: bold;
    padding-top: .5em;
}

dl.description dd {
    padding-bottom: .5em;
}

/* --- prompts / selection elements --- */

.prompt,
.test_prompt,
#mode_prompt,
#test_prompt,
#envPort,
#select_dates input[type='text'] {
    margin-right: 15px;
}

.prompt,
.test_prompt,
#test_prompt {
    display: inline-block;
}

#select_dates {
    margin: 10px 0 7px 0;
}

/* --- workspace elements --- */

.green_light {
    height: 25px;
    padding: 10px 0 0 40px;
    background: url(../images/green_light.gif) no-repeat;
}

h2 {
    margin: 20px 0 20px 0;
    border-bottom: var(--border-1);
}

.link_buttons,
.linkButtons {
    margin-top: 20px;
    vertical-align: middle;
}

.note_right {
    width: 200px;
    position: relative;
    float: right;
    padding: 10px;
    border: 1px solid #d9d9d9;
    -moz-box-shadow: 0 0 0 #fff;
    -webkit-box-shadow: 0 0 0 #fff;
    box-shadow: 0 0 0 #fff;
    background-color: white;
}

.upload_files {
    width: 400px;
}

/* -- SCROLL - used for error listings in script returns -- */

.scroll,
.return_logged {
    height: 12em;
    border: 1px solid #d9d9d9;
    /* padding: 0.8em;*/
    overflow: auto;
}

.return_logged {
    height: 75%;
    margin: 12px 0 12px 0;
}

/* --- checkbox item selection (security / download ) --- */

.titleLine .box {
    padding: 0 5px;
    font-size: 1.0em;
    font-family: var(--font-monospace);
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.titleLine .title {
    padding-left: 7px;
}

.showHide_links {
    font-size: .8em;
    padding-left: 10px;
    vertical-align: middle;
}

.profile div {
    margin-left: 25px;
}

.check_all {
    padding: 10px 0 10px 55px;
    background: url(../images/check_all.gif) no-repeat top left;
}

/*  */


.pad10 {
    padding-top: 5px;
    padding-bottom: 5px;
}

.center {
    text-align: center;
}

table.center {
    margin-left: auto;
    margin-right: auto;
}

.center:first-child {
    /* doesn 't work in IE 6 margin: auto; */
    text-align: left;
}

.ConditionExamples { /*---Used on Select Examples---*/
    background-color: #ffffff;
    width: 80%;
    margin: 10px 10% 0 10%;
    border-collapse: collapse;
    border: solid 1px #ccc;
}

.smalltext {
    width: 30px !important;
}

/*-- SPLASH PAGES --*/

.splash_page table.two_column th {
    width: 150px;
    height: 30px;
    vertical-align: top;
    border-top: 1px solid #ccc;
    padding: 7px;
}

.splash_page table.two_column td {
    vertical-align: top;
    border-top: 1px solid #ccc;
    padding: 7px 7px 7px 7px;
}

.splash_page .overview h2,
.splash_page .overview .title,
.splash_page .overview .title_main,
.splash_page .overview .box a {
    color: #01529d;
}

.splash_page th {
    font-weight: normal;
    white-space: nowrap;
}

.splash_page .overview {
}

.splash_page .overview .title,
.splash_page .overview .title_main {
    font-size: 2.5em;
    font-weight: bold;
}

.splash_page .overview h2 {
    border-bottom: var(--border-1);
    margin: 20px 0 20px 0;
}

.splash_page .overview .box {
    width: 180px;
    height: 115px;
    float: left;
    margin: 30px 40px 0 0;
    border: 0 solid #ccc;
}

.splash_page .overview .box a {
    font-size: 1.75em;
    font-weight: bold;
    margin-bottom: 8px;
}

.splash_page .overview .box a:hover {
    color: var(--color-accent-5);
}

.splash_page .overview .note {
    margin-top: 60px;
}

.qs {
    border: 1px solid #ebebeb;
    overflow: auto
}

/* CALENDAR STYLES */

.arrows {
    margin: 0 12px 0 12px;
    color: #808080;
}

/* scriptReturn.css */

.script-return .return_logged {
    padding: 5px;
    border: 1px solid #808080;
    background-color: #ebebeb;
    /*font: 10px bitstream vera sans, arial;*/
    margin: 10px 0 0 0;
    height: 250px;
    width: 700px;
    color: #414141;
    overflow: auto;
}

.script-return .element_heading {
    /*font: bold 11px bitstream vera sans, verdana, arial;*/
    color: #808080;
}

#Row_Months_div,
#Row_Xdays_value_div,
#study_list,
#interviewer_list,
#Row_Xdays_value_div {
    margin-left: 25px;
}


/* Misc. Styles */

/* view_files.css */
.display_files {
    width: 100%;
    position: relative;
}

.display_files thead td {
    vertical-align: bottom;
    border-bottom: 1px solid #808080;
}

.display_files tbody td {
    font-size: .9em;
    border-bottom: 1px solid #ebebeb;
}

a.del_file {
    display: block;
    width: 16px;
    height: 16px;
    background: transparent url(../images/delete_pg_16x16.gif) no-repeat center center;
}

/* setup_web_look.css */

.web_look .closeBox {
    font-weight: bold;
    text-align: right;
    width: 50px;
    border: 1px solid #000;
    margin: 0 20px;
    position: relative;
    cursor: pointer;
}

.web_look .instruct {
    text-align: right;
    /*font: 10px verdana;*/
    font-size: small;
    margin: 0 20px 0 17px;
    color: #808080;
}

.image_pop {
    display: none;
    text-align: center;
    border: 1px solid #fff;
    padding: 20px 10px 20px 10px;
    position: absolute;
    z-index: 200;
    margin: 0 auto 0 auto;
    top: 100px;
    width: 700px;
    background-color: #414141;
}

.look_feel img.thumb_it {
    width: 400px;
    max-height: 250px;
    border: 1px solid #808080;
    cursor: pointer;
}

img.px200 {
    max-height: 200px;
    max-width: 200px;
}

img.theme-preview {
    max-width: 800px
}

.submit_look {
    margin: 10px 0 0 175px;
}

.nav_buttons {
    width: 500px;
    text-align: center;
    margin: 0 auto 0 auto;
    border: 0 solid #ccc;
}

.nav_buttons .button {
    display: inline;
    margin: 0 10px 0 10px;
}

.button.disabled,
input[type=button]:disabled {
    cursor: not-allowed;
}

/* box_element.css used on project overview page only */
.box_heading {
    position: relative;
    margin: 20px 0 0 0;
    font-size: 100%;
    font-weight: bold;
    border-bottom: var(--border-1);
    padding: 0 0 0 0;
    color: #01529d;
    width: 60%;
}

.box_heading span {
    font-size: 100%;
}

.box_heading .sub {
    position: absolute;
    width: 250px;
    right: 0;
    bottom: 0;
    font-size: 75%;
    text-align: right;
}

.box_element {
    border: 0 solid #ccc;
    margin: 15px 0 0 0;
    width: 60%;
}

.box_element table {
    width: 100%;
    border-collapse: collapse;
    color: #414141;
    margin: 0 0 0 0;
}

.box_element table td {
    padding: 2px 10px 2px 0;
    text-align: left;
    white-space: nowrap;
    width: 10px;
    vertical-align: top;
}

.box_element table th {
    padding: 2px 10px 2px 0;
    text-align: left;
    color: #414141;
    vertical-align: top;
}

.box_element a {
    color: #72B5CC;
    text-decoration: none;
}

.box_element a:hover {
    text-decoration: underline;
}

.box_element a.box_link {
    display: inline;
    text-align: center;
    padding: 3px 7px 3px 7px;
    margin: 0 0 0 7px;
    border: 0;
    background: #01529d;
    color: #fff;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.box_element a.box_link:hover {
    background-color: #72B5CC;
    text-decoration: none;
    color: #fff;
}

.checkmark {
    display: inline-block;
    position: relative;
    left: 0;
    top: 0;
    height: 16px;
    width: 16px;
    background: url(../images/checkmark.png) no-repeat;
    background-size: cover;
}

.checkmark_empty {
    display: inline-block;
    position: relative;
    left: 0;
    top: 0;
    height: 16px;
    width: 16px;
    background: url(../images/checkmark_empty.png) no-repeat;
    background-size: cover;
}

/* web_options.pm */

.profile div {
    vertical-align: middle;
    line-height: 1.5;
}

.profile .title {
    margin-top: 7px;
}

.msg_box input[type='textarea'] {
    width: 400px;
}

#webCATI_Close_Text {
    max-width: 600px;
}


/*===============[ NEXT GENERATION ]=================*/

.report_heading {
    /*font-size: 14px;*/
    /*font-family: "lucida grande", tahoma, verdana, arial, sans-serif;*/
    font-weight: normal;
    color: #808080;
}

.report_heading strong {
    color: #414141;
}

table.intv_cgi_report {
    width: 100%;
    border-collapse: collapse;
    /*font-size: 11px;*/
    /*font-family: "lucida grande", tahoma, verdana, arial, sans-serif;*/
    color: #808080;
    margin: 12px 0 0 0;
}

table.intv_cgi_report thead th {
    padding: 2px 0 2px 0;
    font-weight: bold;
    border: 0 solid #ccc;
    text-align: left;
}

table.intv_cgi_report tbody td {
    padding: 2px 10px 2px 3px;
    color: black;
    border-top: 1px solid #ccc;
}

/* report CSS */

/* TABLE CODE */

table.results {
    border-collapse: collapse;
    /*font: 11px verdana, arial;*/
    font-size: small;
    color: #000;
    margin: 10px 0 40px 0;
    border: 1px solid #ccc;
    width: 500px;
}

/* head */

table.results thead {
    color: #808080;
}

table.results thead th {
    text-align: center;
    /*font: italic 14px georgia, trebuchet ms, verdana, arial;*/
    font-style: italic;
}

table.results thead th span {
    display: block;
    /*font: bold 12px verdana, arial;*/
    font-weight: bold;
}

/* BODY */

/*table.results tbody {*/
/*    font: 12px verdana, arial;*/
/*}*/

/* defaults */

table.results tbody th {
    padding: 5px 0 5px 10px;
    background-color: #fff;
    font-weight: normal;
}

table.results tbody th p {
    padding: 0 55px 0 5px;
    margin: 0;
}

table.results tbody td {
    width: 50px;
    text-align: center;
    vertical-align: top;
    padding: 5px 0 2px 0;
    border-right: 1px solid #ccc;
}

table.results tbody td span {
    /*font: 11px verdana, arial;*/
    display: block;
}

/* title */

table.results tbody th.title {
    /*font: bold 12px verdana, arial;*/
    font-weight: bold;
    color: #000;
    padding: 30px 0 2px 10px;
    border-bottom: 1px solid #808080;
}

table.results tbody td.title {
    padding: 30px 0 2px 0;
    border-bottom: 1px solid #808080;
    font-weight: bold;
}

table.results tbody td.title span {
    /*font: 11px verdana, arial;*/
    font-size: small;
    display: block;
}

/* sub */

table.results tbody th.sub {
    padding: 0 0 0 30px;
    /*font: italic 11px verdana, arial;*/
    font-style: italic;
    font-size: small;
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
}

table.results tbody th.sub p {
    padding: 2px 55px 2px 5px;
    color: #808080;
}

table.results tbody td.sub {
    /*font: 11px verdana, arial;*/
    font-size: small;
    text-align: center;
    background-color: #fff;
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
    padding: 2px 0 2px 0;
    color: #808080;
}

table.results tbody td.sub span {
    /*font: 9px verdana, arial;*/
    color: #808080;
    display: block;
}

/* footer */

table.results tfoot {
    color: #808080;
}

table.results tfoot th {
    padding: 30px 0 0 10px;
    /*font: italic 10px verdana, arial;*/
    font-style: italic;
    border-right: 1px solid #ccc;
}

/* ------------------------------------------------------------------------------------------------------
Theme colors, etc.
 */
html,
input,
select,
textarea {
    color: #414141; /*-- sitewide default text color --*/
}

h1,
h2,
h3 {
    color: #01529d;
}

/* ------------------------------------------------------------------------------------------------------
links
 */
a:link,
a:visited,
.clickText,
.instruct,
.showHide_all,
.show_all,
.hide_all,
.showHide {
    color: #72B5CC; /*-- sitewide default link color --*/
}

.de-em,
a:hover,
a:active,
.clickText:hover,
.instruct:hover,
.showHide_all:hover,
.show_all:hover,
.hide_all:hover,
.showHide:hover {
    color: #808080; /*-- sitewide default link hover / "lighter" text color --*/
}

/* ------------------------------------------------------------------------------------------------------
buttons
 */


button {
    color: var(--color-button-fg);
    background-color: var(--color-button-bg);
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    border: 0;
}

input[type='submit'],
input[type='button'],
button.std
{
    color: var(--color-button-fg);
    background-color: var(--color-button-bg);
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    border: 0;
    padding: 5px 8px 5px 8px;
}

button:hover,
input[type='submit']:hover,
input[type='button']:hover {
    background-color: var(--color-button-bg-hover);
}

input[type='button'].cancel {
    color: #fff;
    background-color: #808080;
}
input[type='button'].cancel:hover {
    background-color: var(--color-button-bg-hover);
}

.smallbutton {
    font-size: smaller;
}

.refresh-btn {
    display: inline-block;
    background: url(../images/refresh-icon.png) no-repeat center;
    background-size: 25px 25px;
    height: 25px;
    width: 25px;
    margin-left: 15px;
    cursor: pointer;
    vertical-align: middle;
}

span.load-next {
    display: inline-block;
    color: var(--color-button-fg);
    background-color: var(--color-button-bg);
    height: 1.4em;
    width: 1.8em;
    margin-left: 1em;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
}

span.load-next-disabled {
    display: inline-block;
    color: var(--color-button-fg);
    background-color: var(--color-button-bg);
    height: 1.4em;
    width: 1.8em;
    margin-left: 1em;
    cursor: not-allowed;
    text-align: center;
    vertical-align: middle;
}


/* ------------------------------------------------------------------------------------------------------
inputs
 */
input[type='text'],
input[type='number'],
input[type='email'],
input[type='password'],
select
{
    border: 1px solid #808080;
}

input[type='text']:read-only,
input[type='number']:read-only,
input[type='email']:read-only,
input[type='password']:read-only
{
    border: 0;
    /*border-bottom: 1px solid #808080;*/
    /*border-right: 1px solid #808080;*/
    cursor: default;
}

/* Disabled styles */
input:disabled, input[aria-disabled=true],
textarea:disabled, textarea[aria-disabled=true],
select:disabled, select[aria-disabled=true],
.disabled, .readonly {
    background-color: #ebebeb;
    cursor: default;
}

option:disabled {
    background-color: #ebebeb;
}

input[type='text']:required,
input[type='number']:required,
input[type='email']:required,
input[type='password']:required,
input[type='file']:required,
select:required,
.input_required,
.textBox_req
{
    border: var(--border-1);
    background-color: rgba(114, 181, 204, 0.075);
}

input[type='text']:focus,
input[type='number']:focus,
input[type='email']:focus,
input[type='password']:focus,
select:focus
{
    /*border: 2px solid var(--color-accent-3); !* enghouse accent green *!*/
    /*border-right-width: 4px;*/
    border-left-width: 4px;
}

input[type='text'].error,
input[type='number'].error,
input[type='email'].error,
input[type='password'].error,
select.error {
    color: #000;
    border: 1px solid var(--color-accent-1);
    background-color: rgba(240, 65, 95, 0.2);
}

input[type='text'].error:focus,
input[type='number'].error:focus,
input[type='email'].error:focus,
input[type='password'].error:focus,
select.error:focus {
    border: 2px solid var(--color-accent-1);
    /*border-left-width: 4px;*/
    /*border-right-width: 4px;*/
}


.input_error {
    border: 1px solid var(--color-accent-1);
}

/* ------------------------------------------------------------------------------------------------------

 */

table, tr {
    border-color: #72B5CC;
}


thead.border th {
    border: var(--border-1);
}


/* ----- colors ----- */
.versioninfo th {
    color: #01529d;
}

.showHide_links {
    color: #72B5CC;
}

.titleBar_instruct,
.titleBar_Instruct,
.note_reqd {
    color: #414141;
}

.titleBar_error,
.titleBar_instructError {
    color: var(--color-accent-1);
}

.required,
.showHide,
.titleLine .box {
    color: #01529d;
    font-weight: bold;
}

.black {
    color: #000;
    font-weight: bold;
}

.border_test {
    border: 1px solid var(--color-accent-1);
}

.border_test {
    padding: 5px;
}

.upload_files,
.titleLine .box {
    border: 1px solid #01529d;
}

.versioninfo {
    outline: 2px solid #01529d;
}

.versioninfo td,
.versioninfo th {
    border: 1px solid #01529d;
    text-align: center;
    padding: 10px;
}

.expiry {
    width: 69%;
    color: var(--color-accent-1);
    background-color: white;
    padding: 1em 0;
    margin: 1em auto;
    border: 2px solid #01529d;

}

#test_prompt > select {
    width: 7em;
}

/* ------------------------------------------------------------------------------------------------------
 generic font styles
 */

.green,
.success {
    color: green;
}

.warn {
    color: #9A4D00; /*-- warning - script return --*/
}

.error,
.error_text,
.button_del,
.cautionBox {
    color: var(--color-accent-1); /*-- sitewide default error color --*/
}

.danger {
    font-weight: bold;
    font-size: larger;
    color: var(--color-accent-1);
}

.err,
.scroll,
.return_logged {
    color: #808080;
}

.highlight-error {
    background-color: #FFBBBB;
}

.smaller {
    font-size: smaller
}

.bold {
    font-weight: bold;
}

.status-good {
    background-color: green;
    color: white;
}

.status-bad {
    background-color: var(--color-accent-1);
    color: white;
}