/* ~~~~~~~~~~ EQ OUTREACH Forms Standard[16] ~~~~~~~~~~ */
.tlo__tl_responsive.tlo__tl_responsivetable {
padding: 0;
}
.tlo__formsection.tlo__formsectiongeneral {
padding: 0px;
}
/* mastheads and footer */
.tlo__tl_stdmastheadorfooter {
overflow: hidden;
/*In case theme specifies a height less than the height of the left image */
background-repeat: repeat;
background-position: center top;
}
.tlo__tl_stdmastheadorfooter_inner {
background-repeat: no-repeat;
background-position: right top;
height: 100%;
}
.tlo__tl_stdmastheadorfooter_leftimage {
float: left;
}
.tlo__post_tlmasthead {
clear: both;
}
/* Branding values overridden by theme css */
.tlo__tlmasthead {
height: 100%;
}
.tlo__tldialogmasthead {
height: auto;
}
.tlo__tlfooter {
height: 0;
}
.tlo__tl_stdmastheadorfooter {
/*! background-color: white; */
padding: 10px;
}
.tlo__tlmasthead .tlo__tl_stdmastheadorfooter_statictext {
padding-top: 15px;
display: inline-block;
}
.tlo__tlfooter .tlo__tl_stdmastheadorfooter_statictext {
padding-top: 15px;
padding-bottom: 20px;
}
.tlo__tldialogmasthead .tlo__tl_stdmastheadorfooter_statictext {
padding-top: 15px;
}
.tlo__tl_stdmastheadorfooter_leftimage {
padding: 5px 8px 0 5px;
}
/* GENERAL */
body {
background-color: white;
color: black;
margin: 0px;
padding: 0px;
}
.tlo__dialogbody {
background-color: #999999;
/* See also .tlo__dialogaboveform */
;
}
/*Iron out inconsistencies with default margins and heading sizes etc. in different browsers*/
.tlo__tlform h1 {
margin: 0px;
font-size: 2em;
}
.tlo__tlform h2 {
margin: 10px 0px;
font-size: 1.5em;
/*! width: 100%; */
white-space: normal;
}
.tlo__tlform h3 {
margin: 0px;
}
img {
border: none;
padding: 0px;
margin: 0px;
}
.tlo__tlform fieldset {
margin: 0px;
padding: 0px;
border: 0;
}
.tlo__IE fieldset {
border: 0px solid #666;
margin-top: 2px;
}
/* IE override to mimic the FFox colour */
.tlo__builtindialog .tlo__tlform fieldset {
border: none;
}
/* "built in" as opposed to "custom" dialog*/
.tlo__tlform p {
margin: 0px;
}
.tlo__tlform {
margin-top: 0;
margin-bottom: 0;
}
.tlo__details {
clear: left;
display: block !important;
}
/* This change should only apply to non-responsive headers. The flat and white-space are un-done below for responsive styles*/
.tlo__secheadertitle {
color: black;
float: left;
white-space: nowrap;
}
/*h3 or legend is used for headings depending on value of Presentation.UseLegend[InDialog]*/
.tlo__tlform legend,
.tlo__tlform h3 {
/*! font-weight: 700; */
/*! color: black; */
/*#0046d5;*/
/*! font-size: 1.3em; */
/*! padding: 0; */
margin: 0px 10px 20px 0;
width: auto;
/*! float: left; */
padding: 0 !important;
}
.tlo__tlform h3 {
padding-top: 3px;
}
.tlo__dialogbody .tlo__tlform h3 {
padding-top: 3px;
margin-left: 18px;
}
/*Legacy*/
.tlo__tlform legend.tlo__empty {
padding: 0;
}
/*Prevent Firefox showing a small gap in the fieldset border if legend is empty*/
/* Make browsers consistently leave a gap approx half as high as a legend above a fieldset which has an empty legend. */
/* (This was default behaviour in IE6 and 7 if you did not alter fieldset border properties from browser defaults.) */
fieldset.tlo__emptylegend {
margin-top: 10px;
}
/* IE */
.tlo__nonIE fieldset.tlo__emptylegend {
margin-top: 9px;
}
/* Firefox, Safari, Chrome etc. */
/* Overrides for dialogs so h1 appears smaller than in main form section */
.tlo__dialogbody h1 {
font-size: 1.5em;
}
.tlo__builtindialog .tlo__tlform h1 {
padding-top: 3px;
margin-left: 18px;
}
/* "built in" as opposed to "custom" dialog*/
/*If you want the title to start below the form section header controls, uncomment next line*/
/*.formtitle {clear:right;} */
.tlo__formtitle {
margin: 0px 0.1em 0.3em 0;
}
.tlo__formtitle h1 {
margin: 20px 0;
}
/*Form section header controls (Accessible/Normal version link, form help link, etc) */
.tlo__headercontrols,
.tlo__dlgheadercontrols {
float: right;
margin-left: 8px;
margin-bottom: 2px;
}
.tlo__linkbaritem {
display: inline;
border-left: 1px solid black;
padding-left: 0.5em;
margin-left: 0.5em;
}
.tlo__linkbaritem:first-child {
border-left-style: none;
padding-left: 0;
margin-left: 0;
}
.tlo__assistanceid,
.tlo__formsaveid {
color: blue;
}
/* Same colour as links (but not underlined); may be overridden by theme CSS */
.tlo__tlmaincontent {
clear: both;
}
.tlo__tlmaincontent_secbuttons,
.tlo__headerarea2_secbuttons {
margin-left: 240px;
margin-right: 30px;
}
.tlo__tlmaincontent_nosecbuttons,
.tlo__headerarea2_nosecbuttons {
margin: 20px;
}
/* Min/max widths.
* (CSS min-width does not work in IE6, so we use a different method in Fragment InternalStyles for IE6 only)*/
.tlo__aj_formcontent,
.tlo__headerarea {
min-width: 410px;
}
/* min width of main part of form */
.tlo__tltoolbar {
min-width: 400px;
}
.tlo__dialogouter {
min-width: 460px;
max-width: 1000px;
}
/* min & max width of dialogs */
/* Min heights. These values are only used if JavaScript is disabled, because they are overridden in function MakeFormContentAtLeastAsHighAsSectionButtons */
.tlo__aj_formcontent {
min-height: 600px;
}
.tlo__IE6 .tlo__aj_formcontent {
height: 600px;
}
/*IE6 does not understand min-height, but it treats height as min-height */
/* undo the above in dialogs */
.tlo__dialog .tlo__aj_formcontent {
min-height: 0;
}
.tlo__IE6 .tlo__dialog .tlo__aj_formcontent {
height: auto;
}
/* Toolbars and buttons */
#aj_formheader {
padding: 10px 0;
}
.tlo__tltoolbar {
border: 0px solid #ffffff;
background-color: #ffffff;
/*! padding: 10px; */
/*! margin: 10px 0 0; */
min-height: 0;
/* Ensure top and bottom toolbars are similar height when only one contains buttons */
;
border-collapse: collapse;
white-space: unset;
}
.tlo__toolbarbuttons {
float: right;
clear: right;
}
.tlo__button, .tlo__buttondisabled {
font-weight: normal;
font-size: 1em;
cursor: pointer;
/* Prevents iOS 8 from overriding button styles */
-webkit-border-radius: 2px;
-webkit-appearance: none;
margin-left: 0px;
margin-right: 0px;
padding: 10px 20px;
border: 0;
}
.tlo__button {
background-color: #999999;
color: #000000;
}
.tlo__buttondisabled {
background-color: #C3C4C5;
color: #ffffff;
}
/* Misc */
p.tlo__mandatoryfieldmessage {
margin-bottom: 3px;
float: left;
width: auto;
position: unset;
padding: 5px 10px;
}
.tlo__nobr {
white-space: nowrap;
display: table-cell;
vertical-align: text-top;
}
.tlo__headercaption {
padding-bottom: 1px;
}
.tlo__fieldrow {
clear: both;
padding: 0 0 10px;
/*Space around fields*/
;
}
.tlo__tlheadercontent {
padding: 10px 0;
/*Space inside headings*/
;
}
.tlo__tlfooter {
clear: both;
}
.tlo__tlsectionhelplink {
float: right;
}
/* SECTION BUTTONS */
.tlo__secbuttoncontainer {
position: absolute;
left: 10px;
width: 200px;
}
.tlo__secbuttoncontainer_withstatusicons {
left: -190px;
}
/*If section completion status icons shown (Presentation.IncludeSectionStatusIcons) then need more space*/
/* See also .tlo__secbuttoncontainer {position:absolute;left:-180px;} CSS which is set in Fragment XXX in controls11.htm when using fixed width form presentation option. */
/*Vertical gap between the section buttons*/
.tlo__sectionbuttoncontainer,
.tlo__sectionbuttoncontainerhover {
/*! margin-bottom: 3px; */
}
/*Firefox etc*/
.tlo__IE6or7 .tlo__sectionbuttoncontainer,
.tlo__IE6or7 .tlo__sectionbuttoncontainerhover {
clear: both;
margin-bottom: 5px;
float: left;
}
/* Needed for IE, gaps between buttons*/
/* Section buttons */
.tlo__tlsectionbuttons {
/*! max-width: 220px; */
/*! width:100%; */
display: block;
}
.tlo__currentsectionbutton,
.tlo__enabledsectionbutton,
.tlo__disabledsectionbutton {
/*Styles which apply to all section buttons in all browsers*/
/* 24px for IE6or7 - see below */
width: 160px;
background-image: none !important;
border: none;
font-size: 1em;
font-weight: bold;
cursor: pointer;
text-align: left;
background-color: #424242;
max-width: 180px;
word-wrap: break-word;
padding: 10px;
overflow: auto;
white-space: pre-line;
float: unset;
display: inline-block;
margin: 0;
box-sizing: border-box;
clear: none;
min-height: 40px;
height: 100%;
}
.tlo__enabledsectionbutton:hover {
filter: brightness(0.7);
}
.tlo__button:hover {
filter: brightness(0.7);
}
.tlo__currentsectionbutton {
filter: brightness(0.7);
}
.tlo__enabledsectionbutton {
background-color: #999999;
}
.tlo__disabledsectionbutton {
background-position: 0 3px;
}
.tlo__sectionbuttoncontainerhover .tlo__enabledsectionbutton {
background-position: 0 -47px;
}
/* Section buttons in IE. (IE positions text on the button about 3 pixels higher than Firefox, Opera and other browsers. Also IE<7 needs float:left).*/
.tlo__IE6or7 .tlo__currentsectionbutton {
float: left;
height: 24px;
background-position: 0 -100px;
}
.tlo__IE6or7 .tlo__enabledsectionbutton {
float: left;
height: 24px;
background-position: 0 0;
}
.tlo__IE6or7 .tlo__disabledsectionbutton {
float: left;
height: 24px;
background-position: 0 0;
}
.tlo__IE6or7 .tlo__sectionbuttoncontainerhover .tlo__enabledsectionbutton {
background-position: 0 -50px;
}
/* Vertical positioning of text on section buttons in IE versions */
.tlo__IE .tlo__currentsectionbutton,
.tlo__IE .tlo__enabledsectionbutton,
.tlo__IE .tlo__disabledsectionbutton {
padding-top: 4px;
}
.tlo__IE6or7 .tlo__currentsectionbutton,
.tlo__IE6or7 .tlo__enabledsectionbutton,
.tlo__IE6or7 .tlo__disabledsectionbutton {
padding-top: 0px;
}
/*Current section indicator (to right of button)*/
.tlo__currentsectionindicator,
.tlo__enabledsectionindicator,
.tlo__disabledsectionindicator {
width: 0;
height: 0;
display: none;
}
.tlo__sectionbuttoncontainerhover .tlo__enabledsectionindicator {
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
background-position: -800px -47px;
}
.tlo__IE6or7 .tlo__currentsectionindicator {
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
background-position: -800px -50px;
}
.tlo__IE6or7 .tlo__sectionbuttoncontainerhover .tlo__enabledsectionindicator {
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
background-position: -800px -25px;
}
/*Section completion status icons (optionally shown to left of buttons, depending on value of Presentation.IncludeSectionStatusIcons)*/
.tlo__tliconstatusinitial,
.tlo__tliconstatuspartial,
.tlo__tliconstatuscomplete {
display: inline-block;
/*! position: absolute; */
margin: 10px 0 0;
float: left;
}
.tlo__tliconstatusinitial {
width: 24px;
height: 24px;
background-image: none;
}
.tlo__tliconstatuspartial {
width: 24px;
height: 24px;
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
background-position: -597px 2px;
}
.tlo__tliconstatuscomplete {
width: 24px;
height: 24px;
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
background-position: -548px 3px;;
}
.tlo__IE6or7 .tlo__tliconstatuspartial {
background-position: -600px 2px;
}
.tlo__IE6or7 .tlo__tliconstatuscomplete {
background-position: -550px 2px;
}
/** new style to combat the display:inline being removed **/
.tlo__IE6 .tlo__tlsectionbuttons ul li {
float: left;
}
/** subsection groups **/
.tlo__contractedgroup .tlo__enabledsectionbutton {
background-image: url(EQ-Outreach-Icons-Sprites__Master.png) !important;
background-position: 140px -831px;
padding-right: 30px;
}
.tlo__subsectiongroupcontainer .tlo__currentsectionindicator,
.tlo__subsectiongroupcontainer .tlo__enabledsectionindicator,
.tlo__subsectiongroupcontainer .tlo__disabledsectionindicator {
position: relative;
left: 18px;
}
.tlo__subsectiongroupcontainer {
background-color: transparent;
/*! width: auto; */
border: 0px solid #C7C7C7;
margin-top: 0px;
margin-right: 0;
margin-bottom: 3px;
float: left;
padding-top: 0px;
padding-bottom: 0px;
}
.tlo__secbuttoncontainer_withstatusicons .tlo__subsectiongroupcontainer {
margin-left: 0;
margin: 3px 0;
}
.tlo__subsectiongroupcontainer .tlo__sectionbuttoncontainer {
margin: 0 0 1px 0;
}
.tlo__IE6 .tlo__subsectiongroupcontainer {
margin-left: 10px;
}
.tlo__IE6or7 .tlo__subsectiongroupcontainer {
margin-top: 0;
margin-bottom: 6px;
}
.tlo__subsectiongroupcontainer .tlo__sectiongrouptitle {
height: auto;
width: 160px;
margin: 0 0 1px 24px;
padding: 10px;
font-weight: bold;
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
background-position: -114px -328px;
background-repeat: no-repeat;
background-color: #999999;
border: none;
text-align: left;
box-sizing: border-box;
filter: brightness(0.7);
cursor: default;
}
.tlo__subsectiongroupcontainer .tlo__currentsectionbutton,
.tlo__subsectiongroupcontainer .tlo__enabledsectionbutton,
.tlo__subsectiongroupcontainer .tlo__disabledsectionbutton {
width: 160px;
box-sizing: border-box;
border-left: 5px solid #000000;
}
.tlo__secbuttoncontainer_withoutstatusicons .tlo__subsectiongroupcontainer .tlo__currentsectionbutton,
.tlo__secbuttoncontainer_withoutstatusicons .tlo__subsectiongroupcontainer .tlo__enabledsectionbutton,
.tlo__secbuttoncontainer_withoutstatusicons .tlo__subsectiongroupcontainer .tlo__disabledsectionbutton {
margin-left: 20px;
}
.tlo__subsectiongroupcontainer .tlo__currentsectionbutton {
background-position: -600px -97px;
font-weight: normal;
filter: brightness(0.7);
}
.tlo__subsectiongroupcontainer .tlo__enabledsectionbutton {
background-position: -600px 3px;
font-weight: normal;
}
.tlo__subsectiongroupcontainer .tlo__disabledsectionbutton {
background-position: -600px 3px;
font-weight: normal;
}
.tlo__subsectiongroupcontainer .tlo__sectionbuttoncontainerhover .tlo__enabledsectionbutton {
background-position: -600px -47px;
}
/* Section buttons in IE. (IE positions text on the button about 3 pixels higher than Firefox, Opera and other browsers. Also IE<7 needs float:left).*/
.tlo__IE6or7 .tlo__subsectiongroupcontainer .tlo__currentsectionbutton {
float: left;
height: 24px;
background-position: -600px -100px;
}
.tlo__IE6or7 .tlo__subsectiongroupcontainer .tlo__enabledsectionbutton {
float: left;
height: 24px;
background-position: -600px 0;
}
.tlo__IE6or7 .tlo__subsectiongroupcontainer .tlo__disabledsectionbutton {
float: left;
height: 24px;
background-position: -600px 0;
}
.tlo__IE6or7 .tlo__subsectiongroupcontainer .tlo__sectionbuttoncontainerhover .tlo__enabledsectionbutton {
background-position: -600px -50px;
}
.tlo__orphanedsection input[type=submit] {
background-image: none;
background-color: black;
color: white;
border: 1px solid red;
margin-top: 0px;
}
.tlo__nonIE .tlo__orphanedsection input[type=submit] {
margin-top: 2px;
}
.tlo__secbuttoncontainer li {
clear: both;
display: unset;
width: 100%;
box-sizing: border-box;
display: block;
}
/* when hover mouse just above expanded nested section group, prevent section button below getting hover style */
.tlo__IE6 .tlo__secbuttoncontainer li {
clear: none;
}
/* undo the above in IE6 as it causes problem */
/*FIELDS*/
.tlo__formtextarea,
.tlo__formtextfield,
.tlo__formpasswordfield,
.tlo__formtextarea_err,
.tlo__formtextfield_err,
.tlo__formpasswordfield_err {
/* Text, memo, number and password fields - rule applies to the area where the user can enter data */
/* Width: 100% causes the fields to fill the entire width of the container they are in, so they will change
width as the browser window resizes, unless the width of that container (e.g. .tlo__fieldinputcolumn) is fixed).*/ width: 100%;
}
.tlo__fieldwidthmodifier {
/*Stops the width: 100% declaration above making fields too wide in W3C standards mode.
(An has border 2px and padding 1px on each side by default. This was considered part of
the element's width in quirks mode.)*/
padding-right: 6px;
}
.tlo__fieldwidthmodifier_err {
/*Fields in error have border 3px instead of the default 2px, so we need to effectively subtract 2px from the field width (1px each side).*/
padding-right: 2px;
}
label,
.tlo__calendaricon {
cursor: pointer;
/*! white-space: pre-line; */
/*! word-break: normal; */
/*! box-sizing: border-box; */
}
.tlo__fieldhelp,
.tlo__formhelp,
.tlo__sectionhelp,
.tlo__grouphelp {
cursor: help;
}
label.tlo__suppressedcaption {
display: none;
}
.tlo__tlform .tlo__radiogroup,
.tlo__tlform .tlo__radiogroup_err {
margin: 0;
padding: 0;
border: none;
display: inline;
}
.tlo__tlform .tlo__radiogroup legend,
.tlo__tlform .tlo__radiogroup_err legend {
position: absolute;
left: -9999px;
}
/*Win Phone will hide the radio buttons as well as the legend if it is positioned. Instead we hide it*/
.tlo__tlform .tlo__radiogroup legend.tlo__radiogrouplegend_winphone,
.tlo__tlform .tlo__radiogroup_err legend.tlo__radiogrouplegend_winphone {
display: none;
}
/*Fields in error*/
.tlo__formtextarea_err,
.tlo__formtextfield_err,
.tlo__formpasswordfield_err,
.tlo__narrowformtextfield_err,
.tlo__hourfield_err,
.tlo__minutefield_err,
.tlo__yearfield_err,
.tlo__listboxfield_err,
.tlo__dayfield_err,
.tlo__monthfield_err {
border: solid 2px #e00000 !important;
padding: 10px;
box-sizing: border-box;
}
.tlo__fielderrortext {
color: #e00000;
font-weight: bold;
}
.tlo__fielderrortext strong {
font-weight: bold;
}
/*Prevent IE increasing font-weight from 700 to 900 on strong element inside element that already has font-weight:bold;*/
/* Area above fields, contains custom error and/or section error text */
/* Section errors - error summary */
.tlo__aerror {
color: #e00000 !important;
display: block;
font-weight: bold;
line-height: 150%;
}
.tlo__aerror strong {
font-weight: bold;
}
/*Prevent IE increasing font-weight from 700 to 900 on strong element inside element that already has font-weight:bold;*/
a.tlo__aerror {
text-decoration: none;
display: block;
line-height: 150%;
}
a.tlo__aerror:hover {
text-decoration: underline;
}
.tlo__tlform h2.tlo__errormsgheader {
font-size: 1.3em;
margin: 0;
}
.tlo__errormsgsubheader {
font-size: 14px;
font-weight: bold;
display: block;
margin-top: 7px;
margin-bottom: 7px;
}
.tlo__error_formmessage {
border: solid 3px #e00000;
padding: 1em;
}
.tlo__morelink {
margin-top: 0.5em;
}
/* Info message */
.tlo__tlform .tlo__info_formmessage {
background-color: #eaeaea;
color: #333333;
font-size: 14px;
margin-top: 7px;
margin-bottom: 7px;
padding: 0.4em 1em;
}
/*Field border:
Give fields a 1px simple border instead the default, which in most browsers is 2px inset.
Notes: 1. IE does not honour this on list boxes (HTML select elements) in Windows XP Classic theme / Win 2k.
2. We don't set it on checkboxes and radio buttons because it doesn't give the desired effect. */
.tlo__formtextarea,
.tlo__formtextfield,
.tlo__formpasswordfield,
.tlo__narrowformtextfield,
.tlo__dayfield,
.tlo__monthfield,
.tlo__hourfield,
.tlo__minutefield,
.tlo__yearfield,
.tlo__tlform select {
border: solid 1px #C3C4C5; /*eq-lightgrey*/
margin: 1px 0;
-webkit-border-radius: 0;
padding: 10px;
box-sizing: border-box;
}
/*Other tweaks to account for the smaller than default field border:*/
.tlo__fieldwidthmodifier_err {
padding-right: 4px;
}
/*Fields in error have border 3px instead of 1px (as specified above), so we need to subtract 4px from the field width (2px each side).*/
/* Fix width of list boxes, to account for fields having 1px borders instead of the default 2px. */
.tlo__fieldwidthmodifierlist {
padding-right: 4px;
}
/*Firefox (it's actually the wrong value for Opera, but market share dictates)*/
.tlo__IE6or7 .tlo__fieldwidthmodifierlist {
padding-right: 1px;
}
/* Layout of fields:
/*-----------------------------------
/*| icons | caption | field | right |
/*-----------------------------------
/* or, for caption over field, caption suppressed or full captions
/*-----------------------------------
/*| icons | merged | right |
/*-----------------------------------
/* Icons is space for the mandatory icon, and is a fixed (pixel) width. The others are percentages. */
.tlo__fieldiconscolumn {
float: left;
width: 20px;
clear: left;
/*! min-height: 13px; */
box-sizing: border-box;
}
/*Min height ensures div takes width (and height) in standards compliant browsers, when field captions are right aligned*/
.tlo__fieldcaptioncolumn {
float: left;
width: 28%;
min-height: 1px;
margin-top: 1px;
}
.tlo__fieldinputcolumn {
float: left;
width: 44%;
overflow: visible;
}
.tlo__fieldmergedcolumn {
float: unset;
width: auto;
max-width: 90%;
overflow: hidden;
min-height: 1em;
box-sizing: border-box;
}
/*=28% + 44%*. Min-height ensures empty captions have vertical height in standards compliant browsers*/
.tlo__fieldrightcolumn {
float: left;
}
/* Width of right is automatically 100% - captions - input ( = 100% - merged) */
/*Widths for the above when inside a multi-column heading*/
/*Varies depending on how many columns there are.*/
/*The default values below should allow space for a help icon right of each field with up to 3 columns (unless browser window is very narrow).*/
.tlo__columns .tlo__fieldcaptioncolumn {
width: 32%;
}
.tlo__columns .tlo__fieldinputcolumn {
width: 47%;
}
.tlo__columns .tlo__fieldmergedcolumn {
width: 79%;
}
/* 7 or more columns*/
.tlo__cols2 .tlo__fieldcaptioncolumn {
width: 32%;
}
.tlo__cols2 .tlo__fieldinputcolumn {
width: 55%;
}
.tlo__cols2 .tlo__fieldmergedcolumn {
width: 87%;
}
/*= caption + input*/
.tlo__cols3 .tlo__fieldcaptioncolumn {
width: 32%;
}
.tlo__cols3 .tlo__fieldinputcolumn {
width: 54%;
}
.tlo__cols3 .tlo__fieldmergedcolumn {
width: 86%;
}
.tlo__cols4 .tlo__fieldcaptioncolumn {
width: 35%;
}
.tlo__cols4 .tlo__fieldinputcolumn {
width: 53%;
}
.tlo__cols4 .tlo__fieldmergedcolumn {
width: 88%;
}
.tlo__cols5 .tlo__fieldcaptioncolumn {
width: 34%;
}
.tlo__cols5 .tlo__fieldinputcolumn {
width: 51%;
}
.tlo__cols5 .tlo__fieldmergedcolumn {
width: 85%;
}
.tlo__cols6 .tlo__fieldcaptioncolumn {
width: 33%;
}
.tlo__cols6 .tlo__fieldinputcolumn {
width: 49%;
}
.tlo__cols6 .tlo__fieldmergedcolumn {
width: 82%;
}
/*Properties of columns*/
.tlo__column {
float: left;
}
.tlo__colborderright {
border-right: solid 1px #cccccc;
}
/* vertical line between columns inside a heading */
.tlo__colborderrightinvisible {
border-right-color: transparent;
}
/* Overrides colour specified in .tlo__colborderright if Presentation.ShowColumnDividers<>1 */
/*Horizontal line displayed when a heading contains more column breaks than columns*/
.tlo__colrowbreak {
clear: both;
height: 1px;
background-color: #cccccc;
overflow: hidden;
/*IE6 fix*/
;
}
.tlo__colrowbreakinvisible {
background-color: transparent;
}
/* Overrides colour specified in .tlo__colrowbreak if Presentation.ShowColumnDividers<>1 */
/*Make div.columncontent expand to contain its (floated) content, so we can see its border(s) (e.g. if it also has class="colborderright")*/
/*Also used for other divs, so we can set (e.g.) padding-bottom on them.*/
.tlo__clearfix {
height: 100%;
}
/*In IE*/
.tlo__clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
/*In Firefox. Description at http://www.positioniseverything.net/easyclearing.html */
/* IE workaround: Prevent (e.g.) two 50% divs floated wrapping onto 2 lines due to widths being rounded up. */
.tlo__IE .tlo__cols2,
.tlo__IE .tlo__cols3 {
padding-right: 1px;
overflow: hidden;
}
.tlo__IE .tlo__cols4,
.tlo__IE .tlo__cols5,
.tlo__IE .tlo__cols6,
.tlo__IE .tlo__cols7 {
padding-right: 2px;
overflow: hidden;
}
.tlo__IE .tlo__cols8,
.tlo__IE .tlo__cols9 {
padding-right: 4px;
overflow: hidden;
}
.tlo__IE .tlo__cols10,
.tlo__IE cols11 {
padding-right: 5px;
overflow: hidden;
}
/*ICONS*/
.tlo__tliconcalendar img {
cursor: pointer;
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
vertical-align: top;
width: 26px;
height: 24px;
}
.tlo__tliconcalendar .tlo__hover {
background-position: 0 -50px;
}
.tlo__columns .tlo__tliconcalendar img {
width: 18px;
height: 23px;
background-position: -50px 0;
}
.tlo__columns .tlo__tliconcalendar .tlo__hover {
background-position: -50px -50px;
}
.tlo__tliconhelp img,
.tlo__tliconhelp input {
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
width: 20px;
height: 20px;
background-position: -298px 1px;
margin-top: 2px;
}
/* Change image on mouseover (all browsers, using .tlo__hover class and javascript), and also on getting focus via tab key (except IE6) */
.tlo__tliconhelp .tlo__hover,
.tlo__tliconhelp a:focus img,
.tlo__tliconhelp a:active img {
background-position: -298px -48px;
}
.tlo__columns .tlo__tliconhelp img,
.tlo__columns .tlo__tliconhelp input {
width: 12px;
height: 18px;
background-position: -350px 0px;
}
/* Change image on mouseover and on focus (see above) */
.tlo__columns .tlo__tliconhelp .tlo__hover,
.tlo__columns .tlo__tliconhelp a:focus img,
.tlo__columns .tlo__tliconhelp a:active img {
background-position: -350px -50px;
}
.tlo__tliconerror img,
.tlo__tliconerror input {
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
width: 18px;
height: 18px;
background-position: -199px 0px;
margin-top: 2px;
position: relative;
left: -2px;
}
.tlo__tliconerror .tlo__hover,
a:focus .tlo__tliconerror img,
a:active .tlo__tliconerror img {
background-position: -199px -49px;
}
.tlo__columns .tlo__tliconerror img,
.tlo__columns .tlo__tliconerror input {
width: 12px;
height: 18px;
background-position: -250px 0px;
position: static;
}
.tlo__columns .tlo__tliconerror .tlo__hover,
.tlo__columns a:focus .tlo__tliconerror img,
.tlo__columns a:active .tlo__tliconerror img {
background-position: -250px -50px;
}
.tlo__tltable .tlo__tliconerror img,
.tlo__tltable .tlo__tliconerror input {
left: 1px;
}
/* Error icon when it appears inside a table row (rare) */
#Message .tlo__tliconerror img {
left: 0px;
top: 2px;
}
/* Error icon when it appears inside the section error message at the top of the page */
.tlo__tliconmandatory {
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
background-position: -649px 0px;
}
.tlo__tlform .tlo__tliconmandatory,
.tlo__tlform .tlo__tliconnomandatory {
width: 10px;
height: 10px;
margin: 1px 3px 3px 1px;
}
.tlo__mandatoryfieldmessage .tlo__tliconmandatory {
margin: 0 3px 2px 3px;
}
.tlo__mandatoryhiddentip {
position: absolute;
}
/*legacy*/
.tlo__tliconselect {
width: 6px;
height: 11px;
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
}
td input {
vertical-align: top;
}
.tlo__tlicontablerowinsert {
width: 22px;
height: 21px;
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
background-position: -400px 0;
display: none;
}
.tlo__tlicontablerowedit {
width: 20px;
height: 20px;
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
background-position: -447px 0;
display: table-cell;
vertical-align: text-top;
}
.tlo__tlicontablerowdelete {
width: 19px;
height: 17px;
background-image: url(EQ-Outreach-Icons-Sprites__Master.png);
background-position: -498px 0px;
display: table-cell;
vertical-align: text-top;
}
/* Allow calendar icon to take space that would be occupied by help icon instead of wrapping (for date fields that don't have help).*/
.tlo__tlcalendaroverlapright {
position: absolute;
}
/* Tweaks to positions of icons */
.tlo__nonIE .tlo__tliconcalendar,
.tlo__IE8 .tlo__tliconcalendar,
.tlo__IE9 .tlo__tliconcalendar {
margin-left: 2px;
}
.tlo__nonIE .tlo__columns .tlo__tliconcalendar {
margin-left: 1px;
}
.tlo__IE8 .tlo__columns .tlo__tliconcalendar,
.tlo__IE9 .tlo__columns .tlo__tliconcalendar {
margin-left: -1px;
}
.tlo__IE6or7 .tlo__columns .tlo__tliconcalendar {
margin-left: -2px;
}
.tlo__IE .tlo__tliconhelp {
margin-left: 2px;
}
.tlo__IE6or7 .tlo__columns .tlo__tliconhelp {
margin-left: 0px;
}
.tlo__nonIE .tlo__columns .tlo__tliconhelp {
margin-left: -1px;
}
/* Help icon when immediately to right of narrow field (all browsers) */
.tlo__fieldinputcolumn .tlo__tliconhelp,
.tlo__fieldmergedcolumn .tlo__tliconhelp {
margin-left: 4px;
}
.tlo__columns .tlo__fieldinputcolumn .tlo__tliconhelp,
.tlo__columns .tlo__fieldmergedcolumn .tlo__tliconhelp {
margin-left: 2px;
}
/* Buttons linked to field (or caption) */
.tlo__linkedbuttoncontainer {
vertical-align: top;
}
.tlo__captionwithlinkedbutton {
padding-right: 6px;
}
.tlo__IE6or7 .tlo__fieldwithlinkedbutton,
.tlo__IE6or7 .tlo__captionwithlinkedbutton {
display: inline-block;
}
.tlo__IE6or7 .tlo__linkedbuttoncontainer input {
float: right;
margin-left: 0.2em;
margin-right: 2px;
}
.tlo__IE6or7 .tlo__fieldwithlinkedbutton {
padding-right: 0px;
}
.tlo__IE6or7 .tlo__fieldwithlinkedbutton .tlo__formtextarea,
.tlo__IE6or7 .tlo__fieldwithlinkedbutton .tlo__formtextfield,
.tlo__IE6or7 .tlo__fieldwithlinkedbutton .tlo__formpasswordfield,
.tlo__IE6or7 .tlo__fieldwithlinkedbutton .tlo__formtextarea_err,
.tlo__IE6or7 .tlo__fieldwithlinkedbutton .tlo__formtextfield_err,
.tlo__formpasswordfield_err {
width: 95%;
}
.tlo__IE6or7 .tlo__linkedbuttoncontainer {
width: auto;
}
.tlo__fieldwithlinkedbutton,
.tlo__captionwithlinkedbutton {
display: table-cell;
}
.tlo__linkedbuttoncontainer {
display: table-cell;
white-space: nowrap;
width: 10%;
}
.tlo__nonIE .tlo__linkedbuttoncontainer {
padding-right: 4px;
/*Padding appears necessary in Firefox & Chrome (but not Safari & Opera).*/
}
/*List box field width*/
.tlo__listboxfield {
max-width: 95%;
}
/*Prevent drop arrow of list box being hidden if its content makes it too wide to fit in the space available, also 95% not 100% to prevent help icon wrapping in Chrome & Safari*/
.tlo__IE select.tlo__listboxfield {
width: 100%;
max-width: 100%;
}
/*max-width on select elements works in IE10+ but not earlier IE versions. width works in all*/
.tlo__IE .tlo__fieldwrapperlistboxother select.tlo__listboxfield {
width: 70%;
}
/*As above, but allow space for "other" checkbox alongside listbox - OF9_0226*/
.tlo__nonIE .tlo__fieldwidthmodifierlist,
.tlo__IE8 .tlo__fieldwidthmodifierlist,
.tlo__IE9 .tlo__fieldwidthmodifierlist {
padding-right: 2px;
}
.tlo__narrowformtextfield,
.tlo__narrowformtextfield_err {
max-width: 100%;
}
/* Make the gaps between the fields in IE6/7 the same size as in Firefox*/
.tlo__IE6or7 .tlo__formtextarea,
.tlo__IE6or7 .tlo__formtextfield,
.tlo__IE6or7 .tlo__formpasswordfield,
.tlo__IE6or7 .tlo__narrowformtextfield,
.tlo__IE6or7 .tlo__hourfield,
.tlo__IE6or7 .tlo__minutefield .tlo__IE6or7 .tlo__formtextarea_err,
.tlo__IE6or7 .tlo__formtextfield_err,
.tlo__IE6or7 .tlo__formpasswordfield_err,
.tlo__IE6or7 .tlo__narrowformtextfield_err {
margin-top: -1px;
margin-bottom: -1px;
}
.tlo__IE6or7 .tlo__fieldcaptiondate,
.tlo__IE6or7 .tlo__fieldcaptiontime {
position: relative;
top: 2px;
}
/*One or other of these is used depending on Presentation.FieldCaptionAlign */
.tlo__fieldcaptioncolumn_alignleft {
padding-right: 3px;
}
.tlo__fieldcaptioncolumn_alignright {
text-align: right;
padding-right: 6px;
}
.tlo__aj_formmessage {
clear: both;
margin: 10px;
}
/* Changes to allow help icons immediately to right of narrow fields */
.tlo__checkboxfield,
.tlo__checkboxfield_err {
display: inline;
}
.tlo__checkboxfield_err {
line-height: 1.8em;
padding-right: 2px;
padding-top: 2px;
}
.tlo__IE6or7 .tlo__checkboxfield_err {
padding-top: 0;
}
.tlo__fieldwidthmodifierradio .tlo__tliconhelp {
vertical-align: top;
}
.tlo__nonIE .tlo__fieldwidthmodifierlist .tlo__tliconhelp {
vertical-align: top;
}
.tlo__IE8 .tlo__fieldwidthmodifierlist .tlo__tliconhelp {
vertical-align: top;
}
.tlo__IE9 .tlo__fieldwidthmodifierlist .tlo__tliconhelp {
vertical-align: top;
}
.tlo__tliconhelp {
position: absolute;
}
.tlo__righticons {
position: absolute;
}
.tlo__tlgrouphelp .tlo__tliconhelp {
position: relative !important;
top: -8px !important;
left: unset !important;
}
.tlo__tlgrouphelp {
position: relative;
margin: 7px 0 0;
display: block;
}
.tlo__fieldwithlinkedbutton .tlo__tliconhelp,
.tlo__righticons noscript .tlo__tliconhelp,
.tlo__nonIE .tlo__fieldwidthmodifierradio .tlo__tliconhelp {
position: relative;
}
/*prevent help icon overlapping content below if it wraps*/
/** Heading help fix **/
.tlo__IE8 .tlo__tlgrouphelp .tlo__tliconhelp,
.tlo__IE9 .tlo__tlgrouphelp .tlo__tliconhelp {
margin-top: -2px;
margin-left: -2px;
}
/* Prevents help icon overlapping on iOS 8 */
.tlo__fieldwidthmodifierdate {
margin-bottom: 5px;
}
.tlo__fieldwidthmodifierdate .tlo__tliconhelp {
position: relative;
}
/*TABLES*/
/* Styles not qualified by .tlo__formXXX apply to both ordinary tables and the lookup dialog. */
table.tlo__tltable {
width: 100%;
}
table.tlo__tltable,
table.tlo__tltable th,
table.tlo__tltable td {
border: 1px solid black;
border-color: inherit;
/* to prevent table border lines inheriting the body colour (if non black) e.g. body {color:purple;} (except IE6/7 which are not affected). (IE9 inherits the colour inconsistently - the bottom border does not inherit but the others do!) */
border-collapse: collapse;
padding: 10px;
}
thead.tlo__formtablehead tr {
vertical-align: top;
}
.tlo__formsection thead.tlo__formtablehead tr {
background-color: #dadada;
}
table.tlo__tltable th {
text-align: left;
}
.tlo__formsectionbody table.tlo__tltable th {
padding: 10px;
}
tbody.tlo__formtablebody td {
vertical-align: text-top;
}
/* The rows in a table or lookup can have alternating colours.
Table rows have the class names tableroweven and tablerowodd.
Odd and even are calculated based on 0-indexed rows so the first row is even. */
.tlo__tableroweven,
.tlo__tablerowodd {
padding: 10px;
}
.tlo__tableroweven {
background-color: white;
}
.tlo__tablerowodd {
background-color: #eeeeee;
}
.tlo__formtableaddbuttonarea {
margin-top: 0.4em;
margin-bottom: 0.3em;
margin-left: 0px;
}
.tlo__formtableaddbuttonhint {
margin-left: 0.3em;
}
.tlo__tableouter {
margin-bottom: 5px;
}
.tlo__tablerowbuttonscontainer_disabled {
display: none;
}
table.tlo__tltable td.tlo__tablerowbuttons {
white-space: nowrap;
padding: 10px;
}
.tlo__nonIE .tlo__partcontent .tlo__w4 {
padding-left: 1px;
padding-right: 1px;
}
/*Needed in Firefox to prevent left & right table borders overlapping left & right borders of their container (if using rounded corners)*/
/* Cells in table columns which have been locked by signing. These cells cannot be edited. */
.tlo__signedtablecell {
color: #666666;
/*dark grey*/
}
/*LINKS*/
.tlo__formtablehead a:hover,
.tlo__formtablebody a:hover {
text-decoration: underline;
}
.tlo__disabledlink {
color: #666666;
}
/* Used for disabled Next/Previous link text in lookups. (May be used for other disabled links in future versions) */
/*DIALOGS*/
.tlo__dialogouter {
margin: 0.5em auto 1em auto;
background-color: white;
width: 50%;
/*where not overridden*/
}
.tlo__dialog {
padding: 15px 20px 18px 20px;
}
.tlo__builtindialog .tlo__dialog {
padding-bottom: 16px;
}
/* Logon dialog */
.tlo__LogonDialog .tlo__tlmaincontent {
width: 600px;
margin-left: auto;
margin-right: auto;
}
/*Do not increase width above 600 because not tested with theme which specifies a narrower width than this (and 600 is the minimum for themes)*/
.tlo__LogonDialog .tlo__formtitle {
display: none;
}
.tlo__LogonDialog .tlo__tltoolbar_top {
display: none;
}
.tlo__LogonDialog fieldset {
border-style: none;
}
/* move bottom toolbar up */
.tlo__LogonDialog .tlo__aj_formcontent {
min-height: 0 !important;
}
/* important to override inline style set by JavaScript */
.tlo__IE6 .tlo__LogonDialog .tlo__aj_formcontent {
height: auto !important;
}
.tlo__LogonDialog .tlo__cols1 .tlo__column {
width: 100%;
}
.tlo__LogonDialog .tlo__fieldcaptioncolumn {
width: 22%;
}
/* default = 28% */
.tlo__LogonDialog .tlo__fieldinputcolumn {
width: 33%;
}
/* default = 44% */
.tlo__LogonDialog .tlo__fieldmergedcolumn {
width: 90%;
}
/* See comment in Fragment LogonDialogLinkedLogonButtonAfterField. The widths of the password field and logon button
are both fixed so the layout works when text size changed via IE's View > Text Size option. */
.tlo__IE6or7 .tlo__LogonDialog .tlo__fieldwithlinkedbutton {
width: 131px;
float: left;
}
.tlo__IE6or7 .tlo__LogonDialog .tlo__linkedbuttoncontainer {
width: 61px;
float: right;
}
.tlo__IE6or7 .tlo__LogonDialog #BB_OK {
width: 57px;
margin-left: 0;
}
.tlo__LogonDialog .tlo__dlgmsg {
padding-top: 1em;
padding-bottom: 1.5em;
}
.tlo__LogonDialog .tlo__selfreglinks {
margin-top: 0.2em;
padding-bottom: 0.5em;
}
.tlo__LogonDialog .tlo__selfreglink {
margin-top: 0.7em;
}
.tlo__LogonDialog .tlo__tlconnectwithlinks {
margin-top: 0.3em;
padding-bottom: 0;
}
.tlo__LogonDialog .tlo__tlconnectwithlink {
float: left;
width: 190px;
margin: 7px 2px 4px 0;
}
.tlo__LogonDialog .tlo__tlconnectwithlink img {
display: block;
float: left;
}
.tlo__LogonDialog .tlo__tlconnectwithlinktext {
display: block;
float: left;
padding: 18px 0 0 5px;
text-decoration: inherit;
/*so Firefox doesn't lose the underline*/
cursor: pointer;
/*for IE*/
}
/* Process Start Dialog - similar look to the logon dialog*/
.tlo__ProcessStartDialog .tlo__tlmaincontent {
width: 600px;
margin-left: auto;
margin-right: auto;
}
.tlo__ProcessStartDialog .tlo__formtitle {
display: none;
}
.tlo__ProcessStartDialog .tlo__tltoolbar_top {
display: none;
}
.tlo__ProcessStartDialog fieldset {
border-style: none;
}
.tlo__ProcessStartDialog .tlo__aj_formcontent {
min-height: 0 !important;
}
.tlo__IE6 .tlo__ProcessStartDialog .tlo__aj_formcontent {
height: auto !important;
}
/* mimic no cpation full width display for this dialog */
.tlo__ProcessStartDialog .tlo__cols1 .tlo__column {
width: 100%;
}
.tlo__ProcessStartDialog .tlo__fieldcaptioncolumn {
display: none;
}
.tlo__ProcessStartDialog .tlo__fieldinputcolumn {
width: 90%;
}
/* Custom dialog and other dialogs that expand CustomDialog */
.tlo__dialogtitle {
margin-top: 0.7em;
margin-bottom: 1.2em;
}
.tlo__dialog .tlo__dlgheadercontrols {
margin-bottom: 0.5em;
}
.tlo__dialog .tlo__mandatoryfieldmessage {
margin-bottom: 0.5em;
}
.tlo__CustomDialog .tlo__dialogouter {
width: 75%;
}
.tlo__CustomDialog .tlo__toolbarbuttons {
margin-top: 0.5em;
}
/* Dialogs with custom markup (i.e. not based on CustomDialog or FormSection) */
.tlo__dlgcontent {
padding: 13px 13px 10px 13px;
}
.tlo__dialog .tlo__cols1 .tlo__column {
width: 100%;
}
.tlo__dlgbuttons {
margin-top: 2em;
text-align: right;
}
/* Rules affecting specific types of dialog*/
.tlo__FormClose .tlo__dialogouter {
width: 40em;
}
.tlo__GenericFieldDialog .tlo__dialogouter {
width: 70%;
}
.tlo__GenericFieldDialog .tlo__dlgmsg {
margin-bottom: 1.5em;
}
.tlo__GenericFieldDialog .tlo__dlgmsg2 {
margin-top: 1.5em;
}
.tlo__GenericFieldDialog .tlo__fieldmergedcolumn {
width: auto;
}
.tlo__SupplyEmail .tlo__dialogouter {
width: 40em;
}
.tlo__SupplyEmail .tlo__dlgmsg {
margin-bottom: 1em;
}
.tlo__SupplyEmail .tlo__dlgmsg2 {
margin-top: 1em;
}
.tlo__SupplyEmail .tlo__fieldcaptioncolumn {
width: auto;
padding-right: 5px;
}
.tlo__YesNoDialog .tlo__dialogouter {
width: 45%;
}
.tlo__DownloadFile .tlo__dlgmsg p {
margin-bottom: 1em;
}
.tlo__RecoveryData .tlo__dialogouter {
width: 60%;
}
.tlo__PDFOptions h2 {
font-size: 100%;
margin-top: 0;
margin-bottom: 1em;
}
.tlo__PDFOptions h2.tlo__importantmsg {
margin-top: 1em;
}
.tlo__PDFOptions li {
margin-bottom: 0.5em;
}
.tlo__PDFOptions .tlo__dlgbuttons {
text-align: center;
}
.tlo__PDFOptions p.tlo__getreadermsg {
margin-bottom: 1em;
}
.tlo__UploadFile input#Filedata {
width: 100%;
}
.tlo__UploadFile p.tlo__uploadsizelimit {
margin-top: 1em;
}
.tlo__FormAttachments .tlo__dialogouter {
width: 60%;
max-width: 60em;
}
.tlo__FormAttachments select {
width: 100%;
}
.tlo__FormAttachments .tlo__attachdlgbuttons .tlo__button {
width: 8em;
margin-bottom: 0.5em;
margin-right: 0.3em;
margin-top: 1em;
}
.tlo__FormAttachments .tlo__attachdlgcontent {
margin-top: -2em;
}
.tlo__FormAttachments .tlo__attachdlgcontent p {
margin-top: 1em;
margin-bottom: 0.3em;
font-weight: bold;
}
.tlo__Lookup .tlo__dialogouter {
width: 75%;
}
.tlo__Lookup .tlo__dialog h3 {
margin-left: 15px;
}
.tlo__Lookup .tlo__lookupcustombuttons {
float: right;
}
.tlo__Lookup .tlo__lookuptableheadercaption {
margin: 0.5em 0.5em 0.2em 0;
font-weight: bold;
}
/* Caption text which optionally appears above the lookup table (Set by UISetCaption API) */
.tlo__Lookup .tlo__lookuprecordcontrols {
clear: both;
}
.tlo__Lookup .tlo__lookuprecordcontrols_top {
margin-top: 1.4em;
}
.tlo__Lookup .tlo__lookupnextprev {
float: right;
}
.tlo__Lookup .tlo__lookupnextprev a,
.tlo__Lookup .tlo__lookupnextprev .tlo__disabledlink {
margin-left: 0.5em;
}
.tlo__Lookup .tlo__dlgcontent {
padding-top: 0.7em;
}
/*less than other dialogs*/
/* lookup table */
.tlo__Lookup .tlo__aj_table {
margin-top: 1em;
margin-bottom: 1em;
}
.tlo__Lookup .tlo__tltable {
border: 0px none;
border-collapse: collapse;
}
.tlo__Lookup table.tlo__tltable th,
.tlo__Lookup table.tlo__tltable td {
border: solid 2px #eaecef;
/*grey*/
}
.tlo__Lookup table.tlo__tltable th {
background-color: #3a4b8f;
background-image: url(tl9_tableheadbg.opng);
background-repeat: repeat-x;
color: white;
}
.tlo__Lookup .tlo__lookupselectcell {
vertical-align: middle;
padding-left: 1.5em;
}
.tlo__Lookup table.tlo__tltable tbody td.tlo__tablerowodd {
background-color: #f6f6f6;
}
.tlo__Lookup table.tlo__tltable tbody tr.tlo__hover td {
background-color: yellow;
}
.tlo__Lookup table.tlo__tltable tbody tr.tlo__hover {
cursor: pointer;
}
/* lookup table column headings */
.tlo__Lookup thead a:link,
.tlo__Lookup thead a:visited {
color: white;
text-decoration: none;
}
.tlo__Lookup thead a:hover {
text-decoration: underline;
}
.tlo__Lookup thead th {
padding: 0;
min-height: 21px;
}
.tlo__Lookup thead th.tlo__thsel {
width: 1%;
padding: 0.3em 0.3em 0.2em 0.2em;
}
.tlo__Lookup thead .tlo__iconscontainer_outer {
position: relative;
}
.tlo__Lookup thead .tlo__iconscontainer {
position: absolute;
width: 47px;
right: 0;
}
.tlo__Lookup thead .tlo__filtericon {
float: right;
}
.tlo__tlfiltericon {
width: 23px;
height: 21px;
background-image: url(tl9_filter.ofif);
}
.tlo__pressed .tlo__tlfiltericon {
background-image: url(tl9_filter_pressed.ofif);
}
.tlo__tlfiltercancelicon {
width: 23px;
height: 21px;
background-image: url(tl9_filter_cancel.ofif);
}
.tlo__pressed .tlo__tlfiltercancelicon {
background-image: url(tl9_filter_cancel_pressed.ofif);
}
.tlo__Lookup thead .tlo__sorticon {
float: right;
}
.tlo__Lookup thead .tlo__colhdg {
display: block;
padding: 0.3em 0.2em 0em 0.2em;
min-height: 21px;
margin-right: 38px;
}
.tlo__Lookup thead .tlo__colhdg a:hover {
color: white;
}
.tlo__tliconsorted_asc,
.tlo__tliconsorted_desc {
width: 7px;
height: 4px;
margin: 5px 5px 0px 2px;
background-repeat: no-repeat;
}
.tlo__tliconsorted_asc {
background-image: url(tl9_sorted_asc.ofif);
}
.tlo__tliconsorted_desc {
background-image: url(tl9_sorted_desc.ofif);
}
.tlo__Filter .tlo__predicateouter {
margin-left: 1.5em;
margin-top: 0.5em;
}
.tlo__Filter .tlo__predicatelabel,
.tlo__Filter .tlo__predicate,
.tlo__Filter .tlo__predicatefield {
float: left;
}
.tlo__Filter .tlo__predicatelabel {
margin: 1em 2.5em 0 0em;
}
.tlo__Filter .tlo__predicatefield {
margin: 0.9em 0 0 1em;
}
.tlo__AssistanceDialog .tlo__dlgmsg,
.tlo__AssistanceDialog .tlo__dlgmsg2 {
margin-top: 1em;
margin-bottom: 1em;
}
.tlo__AssistanceADDialog .tlo__dlgmsg,
.tlo__AssistanceADDialog .tlo__dlgmsg2,
.tlo__AssistanceADDialog .tlo__dlgmsg3 {
margin-top: 1em;
margin-bottom: 1em;
}
.tlo__AssistanceADDialog .tlo__dlglimitationshdg {
margin-top: 1.5em;
margin-bottom: 1em;
}
.tlo__AssistanceADDialog .tlo__dlglimitationslist li {
margin-bottom: 0.5em;
}
.tlo__SignVerify .tlo__button {
width: 5em;
}
.tlo__SignVerify p.tlo__dlgmsg {
margin-top: 1em;
margin-bottom: 1em;
}
.tlo__SignVerify .tlo__signaturecontent {
background-color: white;
border: 1px solid #999;
padding: 0 1em 1em 1em;
}
.tlo__SignVerify .tlo__dialogouter {
width: 65%;
}
.tlo__SignVerify .tlo__signaturecontent pre {
font-size: small;
}
/* Spell Check dialog */
.tlo__SpellCheck .tlo__dialogouter {
width: 70%;
max-width: 70em;
}
.tlo__SpellCheck div.tlo__row {
clear: both;
padding-top: 5px;
}
.tlo__SpellCheck div.tlo__row span.tlo__label {
float: left;
width: 9em;
}
.tlo__SpellCheck .tlo__smfield {
width: 15em;
}
.tlo__SpellCheck #spelltext {
padding: 10px;
border: 1px solid black;
overflow: auto;
margin-top: 10px;
background-color: white;
color: black;
clear: both;
}
.tlo__SpellCheck #CompletedMessage {
display: none;
font-weight: bold;
}
.tlo__SpellCheck #OptionButtons .tlo__button {
width: 7em;
}
.tlo__SpellCheck .tlo__hiddencontrols {
display: none;
position: absolute;
top: 0;
left: 0;
width: 1px;
height: 1px;
}
.tlo__SpellCheck #cWord {
color: #e00000;
font-weight: bold;
}
/*Current word in error*/
/*Facebook send dialog*/
.tlo__FacebookSend .tlo__sendtext {
padding: 0.25em 0 0.25em 0;
}
.tlo__FacebookSend .tlo__suggestedlink {
padding: 0.25em 0 0.25em 0;
}
.tlo__FacebookSend .tlo__subjecttext {
padding: 0.25em 0 0.25em 1em;
}
.tlo__FacebookSend .tlo__subjectfont {
font-size: large;
color: #FF0000;
}
.tlo__FacebookSend .tlo__sendbutton {
padding: 18px 0px 3px 0px;
}
/* Process message dialog (Used by OfficeProcess Desktop when viewing message from previous participant)*/
.tlo__processmessage {
padding: 10px;
border: 3px outset #dddddd;
background-color: #ffff99;
height: 100px;
}
/* Accessibility Help dialog */
ul.tlo__accesskeys strong {
color: #00a200;
}
.tlo__NormalToAccessibleDialog ul.tlo__accesskeys,
.tlo__AccessibleToNormalDialog ul.tlo__accesskeys {
list-style: none none outside;
margin-left: 0;
padding-left: 0;
}
/* ALL DIALOGS ABOVE MAIN FORM (Used in IE7+, Firefox and Chrome when AJAX and this feature are enabled) */
.tlo__dialogaboveform {
/* When showing a dialog above the main form, this class is applied in addition to .tlo__dialogbody */
background-color: transparent;
/* override declaration in .tlo__dialogbody */
min-height: 100%;
width: 100%;
z-index: 1100;
position: absolute;
top: 0;
left: 0;
}
.tlo__dialogaboveform .tlo__dialogouter {
border: 3px solid black;
}
/* Hide the contents of the fragments DialogHeaderCustomisable1 and DialogFooterCustomisable1 if dialog is
being shown above form, otherwise if they contain custom content it will overlap with the main form. */
.tlo__dialogaboveform .tlo__dlgheaderarea1,
.tlo__dialogaboveform .tlo__dlgfooter1 {
display: none;
}
.tlo__modaldialogoverlay,
.tlo__modalinlinetableoverlay {
/* A semi-transparent div that sits underneath the dialog but above the disabled main form,
when a dialog is displayed modally above the main form. */
filter: alpha(opacity=55);
/* Transparency in IE(7+). N.B. This Microsoft proprietary property will fail W3C CSS validation. */
opacity: 0.55;
/* Transparency in Firefox etc. N.B. This property will fail validation against W3C CSS level 2.1, but it is valid in CSS 3. */
background-color: #000;
top: 0;
left: 0;
position: fixed;
/* In IE, overridden below */
min-height: 100%;
min-width: 100%;
/* Also height and width are set by JavaScript, for IE (see below) and browsers that don't support position:fixed, e.g. Safari on iPad) */
;
}
.tlo__IE6or7 .tlo__modaldialogoverlay,
.tlo__IE6or7 .tlo__modalinlinetableoverlay {
/* In IE7, using position:fixed can make scrolling a little jerky, so use position: absolute instead. */
/* JavaScript also sets the width and height so the overlay covers the entire document. */
position: absolute;
}
.tlo__modaldialogoverlay {
z-index: 1050;
}
.tlo__modalinlinetableoverlay {
z-index: 1020;
}
/* Adding table row inline */
.tlo__tlTableInlineAddRowContent {
z-index: 1040;
position: relative;
background-color: white;
border: 3px solid black;
padding: 1px 6px 7px 6px;
margin: 5px 0 5px 0;
}
.tlo__tlTableInlineAddRowContent .tlo__tlinlinetoolbar {
margin-top: 5px;
}
.tlo__tlTableInlineAddRowContent .tlo__info,
.tlo__tlTableInlineAddRowContent .tlo__info2,
.tlo__tlTableInlineAddRowContent .tlo__custommsg {
margin-top: 4px;
}
/*Main font*/
input,
textarea,
select {
font-size: 100%;
}
.tlo__fieldcaptioncolumn_inner {
word-wrap: break-word;
white-space: normal;
}
/* Make disabled buttons obviously disabled in Firefox, Chrome, Safari (all types: section/action/toolbar buttons) including when a theme overrides the colour of input elements */
input[type=submit][disabled] {
color: #ffffff;
}
input.tlo__buttondisabled[type=submit][disabled] {
color: #ffffff;
}
.tlo__tltoolbar input.tlo__buttondisabled[type=submit][disabled] {
color: #ffffff;
}
input[type=button][disabled] {
color: #6D6D6D;
}
input.tlo__buttondisabled[type=button][disabled] {
color: #6D6D6D;
}
.tlo__tltoolbar input.tlo__buttondisabled[type=button][disabled] {
color: #6D6D6D;
}
/*Tweaks to layout, desirable if main font size is smaller than about 13px, otherwise not needed:*/
.tlo__checkboxfield label,
.tlo__radiogroup label {
position: relative;
top: -1px;
}
input[type="checkbox"] {
margin: 10px 10px 10px 0;
}
/*Position checkbox and radio button labels slightly above where they'd normally be (approximate vertical align middle) */
.tlo__IE6or7 .tlo__checkboxfield label,
.tlo__IE6or7 .tlo__radiogroup label {
position: static;
}
/*Undo the above in IE6 as it can break in IE6 in some circumstances, leaving the labels totally in the wrong place*/
.tlo__tliconhelp img,
.tlo__tliconhelp input,
.tlo__tliconerror img,
.tlo__tliconerror input {
margin-top: 0px;
}
/*Icon vertical positioning: Override default top margin 2px because field height is smaller than standard */
.tlo__tliconhelp img {
margin-bottom: -3px;
}
/* margins only affect elements that.. */
.tlo__nonIE .tlo__tliconhelp img {
margin-bottom: -5px;
}
/* .tlo__.are not absolutely positioned */
.tlo__IE6 .tlo__tliconhelp img {
margin-bottom: 0;
}
/*(except IE6 gets it wrong)*/
/*Rich text editor*/
.tlo__mceEditorIframe {
margin-bottom: 0 !important;
}
.tlo__disabledrichtextarea {
padding: 1px;
background-color: white;
min-height: 1.2em;
}
.tlo__IE6or7 .tlo__disabledrichtextarea {
margin-top: 0px;
margin-bottom: 0px;
}
.tlo__disabledrichtextwidthmodifier {
padding-right: 4px;
}
.tlo__IE6or7 .tlo__fieldwidthmodifierrichtext {
padding-right: 2px;
}
.tlo__nonIE .tlo__fieldwidthmodifierrichtext {
padding-right: 4px;
}
.tlo__mceEditor td {
border-color: #d4d0c8;
border-width: 1px !important;
}
/* Prevent rich text controls becoming too narrow*/
.tlo__fieldwrapperrichtext .tlo__fieldinputcolumn,
.tlo__fieldwrapperrichtext .tlo__fieldmergedcolumn {
min-width: 361px;
overflow: visible;
/*For IE6 and in case width below is wrong; the effect of omitting min-width and just having overflow:visible is help icon can overlap rich text area*/
}
/* POP-UP WINDOWS */
/* These rules apply to pop-up windows which are used to show
1. Field error messages (when "!" icon is clicked) and
2. Context-sensitive help text (when "?" icon is clicked). */
body.tlo__popupmessagearea {
background-color: white;
margin: 1.3em 1em 1.3em 1em;
}
/* Heading text in the pop-up window */
.tlo__tlform .tlo__popupheader,
.tlo__popupcontent {
font-size: medium;
}
.tlo__tlform .tlo__popupheader {
border-bottom: 1px solid #666;
color: black;
padding-bottom: 0.9em;
}
p.tlo__popupcontent {
margin-top: 1em;
margin-bottom: 3em;
}
/* ACCESSIBILITY */
/* Hide items specifically for screen-readers/accessibility */
.tlo__accessibleformstartlinks {
position: absolute;
top: -1px;
}
/*legacy*/
.tlo__accessiblefieldinfo {
position: absolute;
}
/* Prevent skip links affecting the page layout (shifting other content down when tabbed to) */
.tlo__accessibleskiplink,
.tlo__accessibleskiplinktarget {
position: absolute;
}
/* .tlo__accessible_hidden hides items but leaves them audible to screen readers */
/* p.virtualbufferupdate is a JAWS fix */
/* Others make skip link invisible (until tabbed to) */
.tlo__screenreader,
.tlo__accessible_hidden,
.tlo__accessibleskiplink a,
accessibleskiplink a:hover,
.tlo__accessibleskiplink a:visited,
p.tlo__virtualbufferupdate {
position: absolute;
left: -10000px;
top: auto;
width: 1px;
height: 1px;
overflow: hidden;
}
p.tlo__virtualbufferupdate {
top: 0;
}
/* remove gap appearing underneath the footer in some circumstances */
/* Make skip link visible when tabbed to, for sighted users who navigate using the keyboard */
.tlo__accessibleskiplink a:active,
.tlo__accessibleskiplink a:focus {
position: static;
width: auto;
height: auto;
background-color: white;
/*Ensure readable if logo behind*/
}
.tlo__accessibleskiplink {
z-index: 501;
}
/* Arbitrary value to give skip link a very good chance of being in front of custom masthead content */
/* Some items are marked up as lists for semantic reasons, but we do not want them displayed as lists */
.tlo__tlnoul {
list-style: none none inside;
}
.tlo__tlnoul,
.tlo__tlnoli {
margin: 0;
padding: 0;
display: inline;
float: none;
height: auto;
width: 100%;
}
.tlo__accessibleskiplinkresponsive {
display: none;
}
.tlo__sectionbuttonwrapper.tlo__contractedgroup {
}
/* The responsive skip link is hidden by default */
/* HTML PRINTING */
/* .tlo__printbody => Applied to the HTML tag of document */
/* .tlo__printreturnblock => Blocks containing return message and button (at top and bottom of page by default) */
/* .tlo__printdate => Today's date (i.e. date printed) */
/* .tlo__printref => Save ID (only shown if using key-based save model) */
/* .tlo__printbody h1 => Form title */
/* .tlo__printbody h2 => Section titles */
/* .tlo__printbody legend => Sub-section captions (i.e. headings) and table captions */
/* .tlo__printformsubsection => Form sub-section. Applied to each HTML