/* ~~~~~~~~~~ EQUINITI TOPLEVEL Standard16.css ~~~~~~~~~~ */
body {
margin: 0;
line-height: normal;
}
.tlo__tl_responsivetable {
padding: 0;
}
.tlo__formsectiongeneral {
position: relative; /* section buttons are positioned relative to this */
padding: 10px 20px;
}
/* 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;} /* TODO review WHITESPACE - padding added */
.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 */
.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;white-space:normal;} /* TODO review WHITESPACE - 10px top + 10px bottom margin added */
.tlo__tlform h3 {margin:0px;}
img {border: none;padding:0px;margin:0px;}
.tlo__tlform fieldset {margin:0; padding:2px 0;}
.tlo__IE fieldset {margin-top: 2px;} /* TODO review - why should IE be different? */
.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;} /* prevent IE6 and 7 leaving a 1em vertical gap between masthead and tlform, and tlform and tlfooter */
/* TODO review - what is this - headings as drop help? */
.tlo__details {
clear: left;
display: block !important;
}
/*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;font-size:1.3em;
margin-bottom: 10px;
margin-right: 5px;
width: auto;
padding: 0;
}
.tlo__tlform legend.tlo__heading-with-help-icon, .tlo__tlform h3.tlo__heading-with-help-icon {
float: left; /* required for positioning of help icons after legends */
}
.tlo__tlform h3 {padding-top:3px;margin-left:7px;} /* TODO review aren't these always overridden? */
.tlo__dialogbody .tlo__tlform h3 {padding-top:3px;margin-left:18px;} /*Legacy - TODO review - what does "legacy" mean?*/
/* Consistent gap between fieldsets */
.tlo__tlform .tlo__headingenabled, .tlo__tlform .tlo__headingdisabled, .tlo__tlform .tlo__tableenabled, .tlo__tlform .tlo__tabledisabled {
margin-top:10px;margin-bottom:10px;
}
/* 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:10px;} /* "built in" as opposed to "custom" dialog*/
.tlo__formtitle h1 {margin: 0 0 10px;}
/*Form section header controls (Accessible/Normal version link, form help link, etc) */
.tlo__headercontrols, .tlo__dlgheadercontrols {
text-align: right;
padding: 0 0 10px;
width: auto;
display: inline-block;
float: right;
}
.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;} /* left margin will be overridden by theme CSS */
.tlo__tlmaincontent_nosecbuttons, .tlo__headerarea2_nosecbuttons {/*! margin:20px; */} /* TODO review WHITESPACE - 10px top and bottom margin added - seems wrong to do this only when there are no section buttons? */
/* 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 */
.tlo__tltoolbar {
border: 0px solid #ffffff;
background-color: #ffffff;
margin: 10px 0 0;
/*! min-height: 0; */ /* Ensure top and bottom toolbars are similar height when only one contains buttons */
}
.tlo__toolbarbuttons {
float:right;
clear:right;
text-align: right;
}
.tlo__button, .tlo__buttondisabled {
font-weight: normal;
cursor: pointer;
margin: 0 0 2px;
/* Prevents iOS 8 from overriding button styles */
-webkit-border-radius: 2px; /* TODO review: why "-webkit-border-radius" (changed from 0 to 2px) without standard "border-radius"? */
-webkit-appearance: none;
box-sizing: border-box;
}
.tlo__button {
background-color: #999999;
color: #000000;
}
.tlo__button:hover {
cursor: pointer;
text-decoration: underline;
box-shadow: none;
transform: translateY(1px);
}
.tlo__buttondisabled {
background-color: #C3C4C5; /* TODO review - insufficient contrast - is background too pale for white text? */
color: #ffffff;
}
/* Misc */
p.tlo__mandatoryfieldmessage {
color: #666666;
font-size: 0.9em;
margin: 0;
width: auto;
padding: 0;
margin-top: 5px;
}
p.tlo__mandatoryfieldmessage .tlo__tliconmandatory {
padding-bottom: 2px;
}
.tlo__nobr {
white-space: nowrap;
}
.tlo__headercaption {padding-bottom:1px;}
.tlo__fieldrow {clear:both;padding: 0 10px;}
.tlo__tlheadercontent { padding: 5px 0;}
.tlo__tlfooter {clear:both;}
.tlo__tlsectionhelplink {float:right;}
/* ----------------- START SECTION BUTTONS ----------------- */
.tlo__secbuttoncontainer {position:absolute;left:10px;width:200px;} /* this width will be overridden by theme CSS */
.tlo__secbuttoncontainer_withstatusicons {left:10px;} /* TODO review - does this do anything? we used to leave more space when section completion status icons are shown (Presentation.IncludeSectionStatusIcons) */
.tlo__tlsectionbuttons {
display: block; /* TODO review - remove? It's a div so it'll always have display block anyway? */
}
.tlo__secbuttoncontainer li {
clear: both;
width: 100%;
box-sizing: border-box;
display: block;
}
.tlo__orphanedsection input[type=submit] {
/* TODO review - remove? what's this for? Is it incomplete? */
}
/* SECTION BUTTONS */
.tlo__currentsectionbutton,
.tlo__enabledsectionbutton,
.tlo__disabledsectionbutton
{
width: 160px; /* this width will be overridden by theme CSS */
border: 0;
font-size: 1em;
font-weight: inherit;
cursor: pointer;
text-align: inherit;
word-wrap: break-word;
padding: 10px;
overflow: auto;
white-space: normal;
display: inline-block;
box-sizing: border-box;
clear: none;
}
.tlo__currentsectionbutton,
.tlo__enabledsectionbutton {
background-color: #c6c6c6;
}
.tlo__disabledsectionbutton {
color: #c6c6c6 !important;
background-color: #f2f2f2;
}
.tlo__currentsectionbutton {
filter: brightness(0.8);
}
.tlo__enabledsectionbutton:hover {
filter: brightness(0.9);
}
/* CURRENT STATUS INDICATORS: Position of arrows on RHS of section buttons */
.tlo__SecButtonContainer__WithCurrentSectionIndicator .tlo__currentsectionindicator,
.tlo__SecButtonContainer__WithCurrentSectionIndicator .tlo__enabledsectionindicator,
.tlo__SecButtonContainer__WithCurrentSectionIndicator .tlo__disabledsectionindicator {
width: 16px;
height: auto;
position: absolute;
right: 0px;
visibility: hidden;
margin: 10px 0 0;
min-height: auto;
box-sizing: border-box;
}
/* CURRENT STATUS INDICATORS: Arrows for current section button */
.tlo__SecButtonContainer__WithCurrentSectionIndicator .tlo__currentsectionindicator {
visibility:visible;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left:10px solid #5a555a;
}
/*Section completion status icons (optionally shown to left of buttons, depending on value of Presentation.IncludeSectionStatusIcons)*/
/* Shaded Section Buttons */
.tlo__SecButtonContainer__StyleShaded .tlo__currentsectionbutton,
.tlo__SecButtonContainer__StyleShaded .tlo__enabledsectionbutton,
.tlo__SecButtonContainer__StyleShaded .tlo__contractedgroup .tlo__enabledsectionbutton,
.tlo__subsectiongroupcontainer .tlo__sectiongrouptitle {
/* IE10+ */
background-image: -ms-linear-gradient(top, #e6e6e6 0%, #c6c6c6 100%);
/* Mozilla Firefox */
background-image: -moz-linear-gradient(top, #e6e6e6 0%, #c6c6c6 100%);
/* Opera */
background-image: -o-linear-gradient(top, #e6e6e6 0%, #c6c6c6 100%);
/* Webkit (Safari/Chrome 10) */
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e6e6e6), color-stop(100, #c6c6c6));
/* Webkit (Chrome 11+) */
background-image: -webkit-linear-gradient(top, #e6e6e6 0%, #c6c6c6 100%);
/* W3C Markup */
background-image: linear-gradient(to bottom, #e6e6e6 0%, #c6c6c6 100%);
}
.tlo__SecButtonContainer__StyleShaded .tlo__disabledsectionbutton {
/* IE10+ */
background-image: -ms-linear-gradient(top, #e6e6e6 0%, #f2f2f2 100%);
/* Mozilla Firefox */
background-image: -moz-linear-gradient(top, #e6e6e6 0%, #f2f2f2 100%);
/* Opera */
background-image: -o-linear-gradient(top, #e6e6e6 0%, #f2f2f2 100%);
/* Webkit (Safari/Chrome 10) */
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e6e6e6), color-stop(100, #f2f2f2));
/* Webkit (Chrome 11+) */
background-image: -webkit-linear-gradient(top, #e6e6e6 0%, #f2f2f2 100%);
/* W3C Markup */
background-image: linear-gradient(to bottom, #e6e6e6 0%, #f2f2f2 100%);
}
/** Sub Section Groups **/
.tlo__contractedgroup .tlo__enabledsectionbutton {
background-image: url(icon-eq16__arrow-right-wire.opng);
background-repeat: no-repeat;
background-position: left 10px top 16px;
background-size: 10px 10px;
padding-left: 20px;
}
.tlo__subsectiongroupcontainer {
background-color: transparent;
margin-top: 0px;
margin-right: 0;
margin-bottom: 5px;
float: left;
padding-top: 0px;
padding-bottom: 0px;
}
.tlo__secbuttoncontainer_withstatusicons .tlo__subsectiongroupcontainer {
margin-left: 0;
}
.tlo__subsectiongroupcontainer .tlo__sectionbuttoncontainer {
margin: 0 0 0px 0;
}
/* Nested Section Buttons Title */
.tlo__subsectiongroupcontainer .tlo__sectiongrouptitle {
background: #c7c7c7;
height: auto;
margin: 1px 0 -1px 25px;
padding: 10px;
font-weight: bold;
border-top: 0px solid #666;
border-bottom: 0px solid #666;
border-left: 0px solid #666;
border-right: 0px solid #666;
border-radius: 0 5px 0 0;
box-sizing: border-box;
filter: brightness(1);
cursor: default;
background-image: url(icon-eq16__arrow-down-wire.opng);
background-repeat: no-repeat;
background-position: left 6px top 18px;
background-size: 10px 10px;
padding-left: 20px;
}
.tlo__subsectiongroupcontainer .tlo__currentsectionbutton,
.tlo__subsectiongroupcontainer .tlo__enabledsectionbutton,
.tlo__subsectiongroupcontainer .tlo__disabledsectionbutton {
box-sizing: border-box;
border-left: 0px solid #c3c3c3;
padding-left: 20px;
border-top: 1px solid rgba(0,0,0,0.2);
}
.tlo__subsectiongroupcontainer .tlo__currentsectionbutton {
font-weight: bold;
filter: brightness(0.8);
}
.tlo__subsectiongroupcontainer .tlo__enabledsectionbutton,
.tlo__subsectiongroupcontainer .tlo__disabledsectionbutton {
font-weight: normal;
}
/* ----------------- END SECTION BUTTONS ----------------- */
/*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%;
padding: 5px;
box-sizing: border-box;
}
.tlo__captionover .tlo__fieldmergedcolumn,
.tlo__captionsuppressed .tlo__fieldmergedcolumn {
max-width: 72%;
}
.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.)*/
/* TODO review: Is fieldwidthmodifier even needed now we can do box-sizing:border-box;? May be too big a change though. */
padding-right:6px;
}
.tlo__fieldwidthmodifier > div[style*='visibility: visible;'] {
/* TODO review: what does this do? */
font-size:0.8em;
}
label, .tlo__calendaricon {cursor:pointer;}
.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 5px 0 0;
padding:0;
border:none;
float:left;
} /* Float:left instead of Display:inline positions help icon at top of vertical radio groups */
.tlo__fieldwidthmodifierradio {
display: inline-block;
padding: 5px 0 0;
}
.tlo__radiogroupHorizontal {
display: inline-block;
}
.tlo__radiogroupHorizontal label {
margin-right:10px;
}
.tlo__tlform .tlo__radiogroup legend, .tlo__tlform .tlo__radiogroup_err legend {position: absolute; left: -9999px;}
.tlo__tlform .tlo__radiogroup label > input[type="radio"] {
margin: 0 5px 0 0;
}
/*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;}
/* Area above fields, contains custom error and/or section error text */
/* Section errors - error summary */
.tlo__aerror {
color: #de0001;
display:block;
}
a.tlo__aerror {
text-decoration: none;
}
a.tlo__aerror:hover {
text-decoration: underline;
}
.tlo__tlform h2.tlo__errormsgheader {
font-size: 1.3em;
margin: 0 0 12px 0; /* Removes white space at top */
}
.tlo__errormsgsubheader {
font-size: 14px;
display: block;
margin-top: 5px;
margin-bottom: 5px;
}
.tlo__error_formmessage {
border: solid 3px #de0001; /* This gets overwritten by the theme border setting */
padding: 1em;
}
.tlo__morelink {
margin-top:0.5em;
}
/* Info message */
.tlo__tlform .tlo__info_formmessage {
background-color: #eaeaea;
color: #333333;
font-size: 14px;
margin: 7px 0;
padding: 10px;
box-sizing: border-box;
}
/*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__hourfield, .tlo__minutefield, .tlo__yearfield,
.tlo__dayfield, .tlo__monthfield, .tlo__listboxfield {
border:solid 1px #C3C4C5; /*eq-lightgrey*/
-webkit-border-radius:0;
padding: 5px; /* 5px has been set as the baseline for whitespacing */
box-sizing:border-box;
}
/*Other tweaks to account for the smaller than default field border:*/
/* TODO review: are these still needed? Also fields in error now have border 2px */
/* 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;}
/*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 #de0001; /* border colour overridden by theme (error colour setting) */
padding: 5px; /* 5px has been set as the baseline for whitespacing */
}
.tlo__error_formmessage {
border: solid 2px #de0001; /* border colour overridden by theme (error colour setting) */
}
.tlo__fielderrortext {color:#de0001;font-size: 0.9em;} /* colour overridden by theme (error colour setting) */
/* 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; /* sets width for icons that appear at the start of a field label */
clear: left;
box-sizing: border-box;
padding-top: 5px; /* added to make icons align with text that have 5px padding - 5px has been set as the baseline for whitespacing */
min-height: 10px; /* Min height ensures div takes width (and height) in standards compliant browsers, when field captions are right aligned*/
}
/* swap padding from top to bottom for the caption over and suppress cases */
.tlo__captionover .tlo__fieldiconscolumn,
.tlo__captionsuppressed .tlo__fieldiconscolumn {
padding-top: 0;
padding-bottom: 5px;
}
.tlo__fieldcaptioncolumn {
float: left;
width: 28%;
min-height: 1px;
}
.tlo__fieldinputcolumn {
float: left;
width: 44%;
overflow: hidden;
}
.tlo__fieldmergedcolumn {
float: left;
width: 72%; /* = 28% + 44% */
overflow: hidden;
box-sizing: border-box;
}
.tlo__fieldrightcolumn { float:left; } /* Width of right is automatically 100% - captions - input ( = 100% - merged) */
.tlo__fieldwrapper { margin: 5px 0; } /* adds consistent spacing between field rows */
/*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 #DDDDDD;box-sizing:border-box;} /* 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:#DDDDDD; overflow: hidden;/*IE6 fix*/}
.tlo__colrowbreakinvisible {background-color:transparent;} /* Overrides colour specified in .tlo__colrowbreak if Presentation.ShowColumnDividers<>1 */
.tlo__partcontent {
clear: both; /* TODO review: what does this do? */
}
/*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 .tlo__cols11 {padding-right:5px;overflow:hidden;}
td input {
vertical-align: top;
}
/* 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 with icon*/
.tlo__listboxfield {
width: calc(100% - 25px);
float: left;
margin-right: 5px;
}
.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:6px;}
.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;}
.tlo__fieldcaptioncolumn, .tlo__fieldinputcolumn_forcaption {padding-top:5px; padding-bottom:5px;} /* 5px has been set as the baseline for whitespacing */
/*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__fieldwidthmodifiercheckbox {
padding: 5px 0;
}
.tlo__aj_formmessage {clear:both;margin: 7px 0;}
.tlo__aj_formmessage:empty {margin:0px;}
/* Changes to allow help icons immediately to right of narrow fields */
.tlo__checkboxfield, .tlo__checkboxfield_err {display:inline;padding-right: 5px;}
.tlo__checkboxfield_err {line-height:1.8em;padding-right:2px;padding-top:2px;}
.tlo__IE6or7 .tlo__checkboxfield_err {padding-top:0;}
/* TODO review: test help icons next to radio groups and list boxes */
/* TODO review: .tlo__tliconhelp and .tlo__righticons no longer positioned absolutely - means will */
.tlo__tlgrouphelp {
position: relative;
margin: 7px 0 0;
display: inline-block;
width: auto;
}
/* Prevents help icon overlapping on iOS 8 */
.tlo__fieldwidthmodifierdate {/*! margin-bottom:5px; */}
/*TABLES*/
/* Styles not qualified by .tlo__formXXX apply to both ordinary tables and the lookup dialog. */
table.tlo__tltable {
width:100%;
white-space: normal;
}
.tlo__dialog table {
table-layout: fixed;
}
table.tlo__tltable td { word-break: normal; }
table.tlo__tltable, table.tlo__tltable th, table.tlo__tltable td {
border:1px solid #c3c4c5;
border-collapse: collapse;
padding: 5px;
vertical-align:top;
}
thead.tlo__formtablehead tr {vertical-align:top;}
.tlo__formsection thead.tlo__formtablehead tr {background-color:#dadada;}
table.tlo__tltable th {text-align:left;}
/* 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:0.1em 0.2em 0.1em 0.2em;} /* TODO review: is this always overridden? */
.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;
}
.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*/
a:link, a:visited {color:cornflowerblue;} /* TODO review: why change this one but not the below? Is contrast ratio still sufficient against white bg? */
.tlo__formtablehead a:link, .tlo__formtablehead a:visited {color:blue;text-decoration:none;}
.tlo__formtablebody a:link, .tlo__formtablebody a:visited {color:blue;text-decoration:none;}
a:hover {color:#de0001;}
.tlo__formtablehead a:hover, .tlo__formtablebody a:hover {text-decoration:underline;color:#de0001;}
.tlo__disabledlink {color:#666666; /*dark grey*/} /* 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;}
.tlo__LogonDialog .tlo__selfreglinks {margin-top:0.2em;padding-bottom:0.5em;}
.tlo__LogonDialog .tlo__selfreglink {margin:0.7em 0;}
.tlo__LogonDialog .tlo__selfreglink a:hover {text-decoration: underline;}
.tlo__LogonDialog .tlo__tlconnectwithlinks {margin-top:0.3em;padding-bottom:0;}
.tlo__LogonDialog .tlo__tlconnectwithlink {
float: none;
width: auto;
margin: 7px 2px 4px 0;
display: inline-block;
}
.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*/
}
.tlo__tlconnectwithlink.tlo__tlconnectwithgoogle img {
background-image: url("btn_google_signin_dark_normal_web.opng");
background-position: -3px -3px;
background-repeat: no-repeat;
width: 186px;
height: 46px;
}
.tlo__tlconnectwithlink.tlo__tlconnectwithfacebook img {
background-image: url("btn_facebook-signin-normal.opng");
background-size: contain;
background-repeat: no-repeat;
width: 246px;
height: 46px;
}
.tlo__tlconnectwithlink.tlo__tlconnectwithgoogle span, .tlo__tlconnectwithlink.tlo__tlconnectwithfacebook span {
visibility: hidden;
width: 0;
height: 0;
padding: 0;
}
/* 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 caption 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: 10px 10px 10px 0;
}
.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;font-weight:bold}
.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,
.tlo__UploadFile input#ajOldId_Filedata {
width:100%;
border: 1px solid #c3c3c3;
padding: 10px;
margin: 10px 0 0;
color: #5a555a;
background: #ffffff;
box-sizing: border-box;
}
.tlo__UploadFile p.tlo__uploadsizelimit {margin-top:1em;}
.tlo__FormAttachments .tlo__dialogouter {width:60%;max-width:60em;}
.tlo__FormAttachments select {width:100%; padding:5px;}
.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;}
/* lookup table */
.tlo__Lookup .tlo__aj_table {margin-top:1em;margin-bottom:1em;}
/* TODO continue review from this point on ---------------------------------------------------- */
.tlo__Lookup table.tlo__tltable th, .tlo__Lookup table.tlo__tltable td {
border: solid 1px #c3c4c5;
}
.tlo__Lookup .tlo__lookupselectcell {
vertical-align: middle;
}
.tlo__Lookup table.tlo__tltable tbody td.tlo__tablerowodd {background-color:#f6f6f6;}
.tlo__Lookup table.tlo__tltable tbody tr.tlo__hover td {
background-color: #ccc;
}
.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: 3%;
padding: 0;
font-size: 0;
}
.tlo__Lookup thead .tlo__iconscontainer_outer {position:relative;}
.tlo__Lookup thead .tlo__iconscontainer {position:absolute;width:55px;right:0;}
.tlo__Lookup thead .tlo__filtericon {float:right;}
/* ICONS */
.tlo__tlfiltericon, .tlo__tlfiltercancelicon {
width: 20px;
height: 20px;
background-repeat: no-repeat;
background-color: white;
border-radius: 20px;
-webkit-border-radius: 20px;
border: 2px solid white;
}
.tlo__tlfiltericon {
background-size: 20px 16px;
background-position-y: 3px;
}
.tlo__tlfiltericon {
background-image: url(icon-eq16__filter.opng);
}
.tlo__tlfiltericon:hover {
background-image: url(icon-eq16__filter-hover.opng);
}
.tlo__tlfiltercancelicon {
background-image: url(icon-eq16__cancel-close-x.opng);
}
.tlo__tlfiltercancelicon:hover {
background-image: url(icon-eq16__cancel-close-x-hover.opng);
}
/* lookup table headers are bigger and need the padding at the top
The right pading is to agree with tliconsorted icons and leave a gap*/
.tlo__Lookup .tlo__tlfiltericon, .tlo__Lookup .tlo__tlfiltercancelicon {
margin: 10px 5px 0 0;
}
.tlo__Lookup thead .tlo__sorticon {float:right;}
.tlo__Lookup thead .tlo__colhdg {
display: block;
padding: 10px 30px 10px 10px;
word-wrap: break-word;
}
.tlo__Lookup thead .tlo__colhdg a:hover {color:white;}
/* lookup only */
.tlo__tliconsorted_asc, .tlo__tliconsorted_desc {
width: 20px;
height: 20px;
margin: 10px 5px 0 0;
background-repeat:no-repeat;
}
.tlo__tliconsorted_asc {
background-image:url(icon-eq16__arrow-up.opng);
}
.tlo__tliconsorted_desc {
background-image:url(icon-eq16__arrow-down.opng);
}
.tlo__tliconselect {
width:20px;
height:20px;
background-image:url("icon-eq16__arrow-right.opng");
}
.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, .tlo__SpellCheck #ajOldId_spelltext {padding:10px;border:1px solid black;overflow:auto;margin-top:10px;background-color:white;color:black;clear:both;}
.tlo__SpellCheck #CompletedMessage, .tlo__SpellCheck #ajOldId_CompletedMessage {display:none;font-weight:bold;}
.tlo__SpellCheck #OptionButtons .tlo__button, .tlo__SpellCheck #ajOldId_OptionButtons .tlo__button {
width: auto;
}
.tlo__SpellCheck .tlo__hiddencontrols {display:none;position:absolute;top:0;left:0;width:1px;height:1px;}
.tlo__SpellCheck #cWord, .tlo__SpellCheck #ajOldId_cWord {color:#de0001;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 process forms when viewing message from previous participant)
N.B. does not have tlo__ prefix as class name is hard coded in VirtualForm.dll */
.processmessage {
padding: 10px;
border: 3px solid #666666;
background-color: #ffff99;
min-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;}
.tlo__NormalToAccessibleDialog legend, .tlo__AccessibleToNormalDialog legend {margin-top:0.5em;}
/* 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%;
font-weight: normal;
}
.tlo__fieldcaptioncolumn_inner {
word-wrap: break-word;
white-space: normal;
}
input[type=submit][disabled] { color:#6D6D6D; }
input.tlo__buttondisabled[type=submit][disabled] { color:#6D6D6D; }
.tlo__tltoolbar input.tlo__buttondisabled[type=submit][disabled] { color:#6D6D6D; }
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 checkbox and radio button layout */
.tlo__IE6or7 .tlo__checkboxfield label, .tlo__IE6or7 .tlo__radiogroup label {
position: static;
}
/* TODO review: This seems very global */
input[type="checkbox"] {
margin: 0 10px 0 0;
}
/*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 (very old) JAWS fix */
/* Others make skip link invisible (until tabbed to) */
.tlo__screenreader, .tlo__accessible_hidden, .tlo__accessibleskiplink a, .tlo__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; } /* 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