<style xmlns="http://www.w3.org/1999/xhtml" type="text/css" media="all">
table td,
table th {
    vertical-align:top
}
table .form-content {
    height:100%;
    background-color:#f6f3ee;
    border-top:1px solid #d7b0c6;
    padding-top:0.5em;
    padding-left:0.5em;
    padding-right:0.5em;
    padding-bottom:2em;
}
table .detail {
    background:white;
}
table.spaced {
     /*Orbeon 4.x default of collapse 0px override*/
    border-collapse: separate;
    border-spacing: 2px;
    -webkit-border-horizontal-spacing: 2px;
    -webkit-border-vertical-spacing: 2px;
}
.orbeon h1,
h1 {
    color:#e16e22;
    font-weight:bold;
    font-size:1.5em !important;
    padding-bottom:.1em;
    padding-top:.1em !important;
    text-align:left;
    margin-top:0 !important;
    margin-bottom:0;
    line-height:140%;
}
.orbeon h2,
h2 {
    font-weight:bold;
    font-size:1.3em;
    padding-top:.2em;
    padding-bottom:.1em;
    margin-top:0em;
    margin-bottom:0em;
    line-height:140%;
}
h2.high {
    padding-top:.4em;
    padding-bottom:.4em
}
.orbeon h3, .orbeon h4, .orbeon h5,
h3, h4, h5 {
    font-size:1.1em;
    font-weight:bold;
    padding-top:.2em;
    padding-bottom:.1em;
    margin-top:0em;
    margin-bottom:0em;
    line-height:140%;
}
.orbeon h4, .orbeon h5,
h4, h5 {
    color:#887A6D;
}
.orbeon h5,
h5 {
    font-style:italic;
}
.h1 {
    color:#e16e22;
    font-weight:bold;
    font-size:1.5em !important;
    text-align:left;
    padding-left:1em;
    padding-right:1em;
    padding-top:.2em;
    padding-bottom:.2em;
    margin-top:0;
    margin-bottom:0;
    line-height:140%;
}
.h2 {
    color:#7a6e62;
    background-color:#ebe7e1;
    font-size:1.3em;
    font-weight:bold;
    padding-left:1em;
    padding-right:1em;
    padding-top:.2em;
    padding-bottom:.2em;
    margin-top:0em;
    margin-bottom:0em;
    border-bottom:solid 1px #d7b0c6;
}
.h3 {
    color:#887A6D;
    background-color:#F5F3F0;
    font-size:1.1em;
    font-weight:bold;
    padding-left:2.5em;
    padding-right:1em;
    padding-top:0em;
    padding-bottom:0em;
    margin-top:0em;
    margin-bottom:0em;
    border-bottom:solid 1px #d7b0c6;
}
.zebra-table {
    border-collapse: collapse; border: 1px solid gray;
}
.zebra-table td {
    padding: 6px;
}
.zebra-row-even {
    background-color: #eee !important;
}
.zebra-row-odd { 
    background-color: #fff !important;
}
tr.acco {
    height: 27px; /* normal tr would be 20px while tr with accordeon is 27px. This gives poor alignment in a number of cases */
}
tr.heading {
    height: 33px; /* heading with buttons are 33px high, without 29px. This gives poor alignment in a number of cases */
}
td.heading {
    color:#7a6e62;
    font-weight:bold;
    background-color:#ebe7e1;
    padding-left:0.5em;
    padding-right:1em;
    padding-top:.4em;
    padding-bottom:.4em;
    margin-top:0em;
    margin-bottom:0em;
    border-bottom:solid 1px #d7b0c6;
    vertical-align:middle;
}
td.item-label { 
    width: 15%;
    min-width: 80px;
    background-color: #f0ebe4;
    color: #7a6e62;
    font-weight: bold;
    padding-left: 0.25em;
    padding-right: 0.25em;
    padding-top: 0.25em;
    padding-bottom: 0.25em;
    text-align: left;
    vertical-align: top;
}
td.item-label-var,
td.heading-var {
    background-color:#f0ebe4;
    color:#7a6e62;
    padding-left:0.25em;
    padding-right:0.25em;
    padding-top:0.25em;
    padding-bottom:0.25em;
    text-align:left;
    vertical-align:top;
}
td.heading-var {
    font-weight:bold;
}
div.heading {
    float:left;
    display:inline;
    color:#7a6e62; /* color the same as .h2 */
    font-size:1.3em; /* font-size the same as .h2 */
    font-weight:bold;
    vertical-align:middle;
}
div.heading2 {
    float:left;
    color:black;
    font-weight:bold;
    vertical-align:middle;
}
div.buttons {
    float:right;
    font-weight:normal;
    font-size:1em;
    padding-left:0em;
    padding-right:0em;
    padding-top:0em;
    padding-bottom:0em;
    margin-top:0em;
    margin-bottom:0em;
    vertical-align:middle;
}
td.floating-label {
    padding-left:0.5em;
    padding-right:0em;
    padding-top:0.25em;
    padding-bottom:0.25em;
    background-color:#f0ebe4;
    color:#7a6e62;
    font-weight:normal;
    text-align:left;
    vertical-align:top;
}
span.xforms-selected,
span.xforms-deselected {
    padding-right: 4px;
}

.orbeon fieldset &gt; legend {
    color:#7a6e62;
    font-weight:bold;
    background-color:#ebe7e1;
    padding-left:0.5em;
    /*padding-right:1em;*/
    padding-top:.4em;
    padding-bottom:.4em;
    margin-top:0em;
    margin-bottom:0em;
    border-bottom:solid 1px #d7b0c6;
    vertical-align:middle;
}
table.fr-error-list {
    width: 100%;
}
table.fr-error-list td:first-child { 
    width: 4em;
    text-align: right;
}
table.fr-error-list td { 
    padding-right: 1em;
}
.fr-error-label {
    margin-right: 5px;
}
.fr-error-number {
    display: none;
}
.xforms-input input,
.xforms-secret,
.xforms-secret input {
    height:1.7em !important; /*Orbeon 4.x default of 2em override*/
    padding-bottom: 0px !important; /*Orbeon 4.x default of 4px override*/
    padding-top: 0px !important; /*Orbeon 4.x default of 4px override*/
}
.xforms-input input,
.xforms-textarea,
.xforms-textarea textarea,
.xforms-secret,
.xforms-secret input {
    width:20em;
    margin-bottom:2px;
    text-align:left;
}
.xforms-input.auto-width input {
    width:auto !important; /*Orbeon 4.x default of 2em override*/
    margin-bottom:2px;
    text-align:left;
}
.xforms-input.short-number input {
    width:3em !important; /*Orbeon 4.x default of 2em override*/
    margin-bottom:2px;
    text-align:right;
}
.xforms-input.bsn-number input {
    width:9em !important; /*Orbeon 4.x default of 2em override*/
    margin-bottom:2px;
    text-align:left;
}
.xforms-secret.short-text,
.xforms-secret.short-text input,
.xforms-input.short-text input {
    width:12em !important; /*Orbeon 4.x default of 2em override*/
    margin-bottom:2px;
    text-align:left;
}
.xforms-input.top input {
    margin-bottom:2px;
    vertical-align:top;
    text-align:left;
}
.xforms-type-boolean label {
    /*Orbeon 4.x default of arranging select item as display block override*/
    display: inline-block;
    clear: both;
    padding: 0px 4px;
    margin: 0px;
}
.xforms-type-boolean span input {
    padding: 0px !important;
    margin: 0px !important;
}

span.xforms-secret-appearance-full.inline label,
span.xforms-secret-appearance-full.inline input {
    /*Orbeon 4.x default of arranging select item as display block override*/
    display: inline-block;
    float: none;
    clear: both;
}
span.xforms-secret-appearance-full.inline input {
    margin-left: 5px;
    margin-right: 5px;
}
span.xforms-select-appearance-full.inline span.xforms-items span,
span.xforms-select-appearance-full.inline span.xforms-items span label,
span.xforms-select1-appearance-full.inline span.xforms-items span,
span.xforms-select1-appearance-full.inline span.xforms-items span label {
    /*Orbeon 4.x default of arranging select item as display block override*/
    display: inline-block;
    //float: none;
    clear: both;
}
span.xforms-select-appearance-full.inline span.xforms-items &gt; span,
span.xforms-select1-appearance-full.inline span.xforms-items &gt; span {
    /*Orbeon 4.x default of arranging select item as display block override*/
    //display: block;
}
span.xforms-select-appearance-full.inline span.xforms-items span label span,
span.xforms-select1-appearance-full.inline span.xforms-items span label span {
    //margin-left: 1em;
}
.control-label {
    display:-moz-inline-box;
    display:inline-block;
    width:10em;
    min-width:10em;
    margin-left:1em;
    margin-right:1em;
    color:#7a6e62;
    background-color:#ece9e4;
    padding-left:1em;
}
#edit-code-dialog {
    width:40em;
    height:100%;
}
div.container {
    background:#f6f3ee;
}
div.navigate-container {
    margin-right:1em;
    width:100%;
}
div.navigate {
    padding-top:0.25em;
    margin-right:0em;
    background:white;
    vertical-align:top;
    width:inherit;
    height:40em;
    overflow-x: auto;
    overflow-y: auto;
}
div.navigate .xforms-select1-appearance-compact,
div.navigate .xforms-select1-appearance-compact select {
    width: 100%;
    height: 37em !important;
}
div.navigate-max {
    padding-top:0.25em;
    margin-right:0em;
    background:white;
    vertical-align:top;
    height:inherit;
    overflow-y:auto;
    overflow-x:auto;
}
div.navigate-max .xforms-select1-appearance-compact, 
div.navigate-max .xforms-select1-appearance-compact select {
    width: 100%;
    height: inherit !important;
}
div.navigate-small {
    padding-top:0.25em;
    margin-right:0em;
    background:white;
    vertical-align:top;
    height:20em;
    overflow-y:auto;
    overflow-x:auto;
}
div.navigate-small .xforms-select1-appearance-compact,
div.navigate-small .xforms-select1-appearance-compact select {
    width: 100%;
    height: 18.5em !important;
}
div.navigate-seven {
    padding-top:0.25em;
    margin-right:0em;
    background:white;
    vertical-align:top;
    height:12em;
    overflow-y:auto;
    overflow-x:auto;
}
div.navigate-seven .xforms-select1-appearance-compact,
div.navigate-seven .xforms-select1-appearance-compact select {
    width: 100%;
    height: 11.75em !important;
}
div.detail {
    background:white;
    vertical-align:top;
    padding:0;
    margin-bottom:0.71em;
}
div.no-overflow {
   overflow-x: hidden !important;
   overflow-y: hidden !important;
   overflow: hidden !important;
}
.orbeon a {
    /* color: #669; */
    text-decoration: none;
}
img.self-link {
    margin-left: 5px;
    width: 16px;
    height: 16px;
}
/* https://doc.orbeon.com/form-runner/component/autocomplete.html#displaying-all-the-items
    You can disable this button by adding a show-suggestions-button="false" attribute on the 
    control. The default value of this attribute is true.*/
.fr-autocomplete-show-suggestions-button {
    display: none;   /*Orbeon 4.x default of a big weird button override*/
}
.fr-accordion-lnf {
    border-left-color: lightgray;   /*Orbeon 4.x default gray override*/
    border-bottom-color: silver;   /*Orbeon 4.x default gray override*/
    border-right-color: lightgray;   /*Orbeon 4.x default gray override*/
}
.fr-accordion-lnf dt.a-m-t {
    padding: 0.1em 1em;   /*Orbeon default of 0.3em 1em; override which makes the accordions height oversized */
}
.fr-autocomplete-container .yui-ac-content {
    width:50em;
}
.xbl-fr-autocomplete .xforms-input input {
    width:20em;
}
.yui-skin-sam .yui-navset .yui-nav,
.yui-skin-sam .yui-navset .yui-navset-top .yui-nav {
    border:solid #96bf0b;
    border-width:0 0 3px;
    font-size:1.1em;
}
.yui-skin-sam .yui-navset .yui-nav .selected a,
.yui-skin-sam .yui-navset .yui-nav .selected a:focus,
.yui-skin-sam .yui-navset .yui-nav .selected a:hover {
    border:solid #96bf0b;
    border-width:0 0 2px;
    background:#96bf0b;
    color:#fff;
    font-size:1.0em;
    font-weight:bold;
}
.yui-skin-sam .yui-navset .yui-nav .selected a,
.yui-skin-sam .yui-navset .yui-nav .selected a em {
    border-color:#96bf0b;
}
.yui-skin-sam .yui-navset .yui-content {
    background:#f6f3ee;
    border:none;
    padding-left:0em;
    padding-right:0em;
    padding-top:1em;
    padding-bottom:2em;
}
.yui-skin-sam tr.yui-dt-selected td,
.yui-skin-sam tr.yui-dt-selected td.yui-dt-asc,
.yui-skin-sam tr.yui-dt-selected td.yui-dt-desc {
    background-color:#e16e22; /* bright blue selected row */
    color:#FFF;
}
.yui-skin-sam tr.yui-dt-selected.not-selectable td,
.yui-skin-sam tr.yui-dt-selected.not-selectable td.yui-dt-asc,
.yui-skin-sam tr.yui-dt-selected.not-selectable td.yui-dt-desc {
    background-color:inherit; /* bright blue selected row */
    color:#000;
}
span.xforms-trigger-appearance-compact button.btn {
    margin-left: 2px;
    margin-right: 2px;
    padding-bottom: 1px;
    padding-left: 9px;
    padding-right: 9px;
    padding-top: 1px;
    font-size: 1em;
}
/*  useful for hiding input/textarea labels that aid in getting a link from an error summary 
    for example, but where the label doesn't need to be visible because it is already somewhere 
    else */
.hidden { 
    display: none !important;
}
.concepttypeA,
.concepttypeS,
.concepttypeD {
    font-style: italic;
}
.concepttypeA,
.concepttypeD {
    opacity: 0.5;
}
.concepttypeD {
    text-decoration: line-through;
}
.exception {
    font-style: italic !important;
}
.seealso {
    background-repeat:no-repeat;
    padding:2px 0 0 18px;
    line-height:18px;
}
.seealso {
    background-image:url('img/book_open.png')
}
a.ygtvspacer,
a.ygtvspacer:focus {
    outline: none;
}
.ygtvfocus {
    background-color:inherit;
}
.ygtvfocus .ygtvlabel,
.ygtvfocus .ygtvlabel:link,
.ygtvfocus .ygtvlabel:visited,
.ygtvfocus .ygtvlabel:hover {
    background-color:inherit;
}
.yui-skin-sam .yui-editor-panel label input.warning {
    background-color:inherit !important;
}
.xforms-select1,
.xforms-select1 select {
    margin-top:0em;
    margin-bottom:0em;
    padding-top:0em;
    padding-bottom:0em;
    /* vertical-align:top; */
    min-width:25em;
    width:inherit;
    height:inherit;
    border:none;
}
.xforms-select.auto-width,
.xforms-select.auto-width select,
.xforms-select1.auto-width,
.xforms-select1.auto-width select {
    min-width:0em;
    width:auto;
    height:auto;
}
.xbl-fr-code-mirror .CodeMirror {
    height:20em;
    width:50em;
}
.xforms-repeat-selected-item-1,
.xforms-repeat-selected-item-2,
.xforms-repeat-selected-item-3,
.xforms-repeat-selected-item-4 {
    font-weight:bold;
    background-color:#faf6f0;
    color:#e16e22;
}
.xforms-repeat-selected-item-1.not-selectable,
.xforms-repeat-selected-item-1 .not-selectable,
.xforms-repeat-selected-item-2.not-selectable,
.xforms-repeat-selected-item-2 .not-selectable,
.xforms-repeat-selected-item-3.not-selectable,
.xforms-repeat-selected-item-3 .not-selectable,
.xforms-repeat-selected-item-4.not-selectable,
.xforms-repeat-selected-item-4 .not-selectable,
.xforms-repeat-template.not-selectable,
.xforms-repeat-template .not-selectable {
    font-weight:normal;
    background-color:inherit;
    color:black;
}
.xbl-fr-select1-button.bottom-align {
    vertical-align:bottom;
}
div.toggled-open {
    display:block;
}
div.toggled-closed {
    display:none;
}
/* rules for navigation menu */
/* ========================================== */
ul#navmenu,
ul.sub1,
ul.sub2 {
    margin:0px !important;
    padding:0px !important;
    list-style-type:none;
    font-size:1em;
}
ul.sub1,
ul.sub2 {
    border:1px solid #CCC;
    background-color:#FFF;
    box-shadow:3px 3px 10px 3px #CCC;
}
ul#navmenu li {
    width: 10em;
    text-align: center;
    position: relative;
    float: left;
    margin-right:0px;
    font-size: 1em;
    font-weight: normal;
    color: #7a6e62;
}
ul#navmenu li.xforms-disabled {
    display: none;
}
ul#navmenu li.half {
    width: 5em;
}
ul#navmenu li.right {
    float: right;
}
ul#navmenu a {
    height: 1.8em;
    color: black;
    width: inherit;
    text-decoration: none;
    display: block;
    background-image:url('img/menu_background.png'), url('img/menu_background.png');
    border: 1px solid #CCC;
}
ul#navmenu .sub1 li {
    text-align: left;
    padding-right: 5px;
    width: 300px;
}
ul#navmenu .sub2 li {
    text-align: left;
    padding-right: 5px;
    width: 300px;
}
ul#navmenu .sub1 a {
    padding-top: 3px;
    padding-left: 5px;
    margin-top: 2px;
    width: inherit;
    background-image: none;
    border: none;
}
ul#navmenu .sub2 a {
    margin-left: 0px;
    width: inherit;
}
ul#navmenu li:hover &gt; a {
    background-image:url('img/menu_selected_background.png'), url('img/menu_selected_background.png');
}
ul#navmenu li:hover a:hover {
    background-image:url('img/menu_selected_background.png'), url('img/menu_selected_background.png');
}
ul#navmenu ul.sub1 {
    display:none;
    position:absolute;
    top:20px;
    left:0px;
}
ul#navmenu ul.sub2 {
    display:none;
    position:absolute;
    top:0px;
    left:255px;
}
ul#navmenu li:hover .sub1,
ul#navmenu .sub1 li:hover .sub2 {
    display:block;
    z-index:10;
}
span.xforms-selected label input,
span.xforms-deselected label input,
span.xforms-selected label span,
span.xforms-deselected label span {
    display: inline-block;
}
</style>