/* general */
* {
    margin: 0;
    padding: 0;
}
body {
    background: none repeat scroll 0 0 #DDDEDF;
    font-family: verdana,'LucidaSansUnicodeRegular',sans-serif;
    height: 100%;
    margin: 0;
    text-align: left;
}
input {
    height: auto;
}
a img, fieldset, form {
    border: 0 none;
}
ins, abbr, acronym {
    border: 0 none;
    font-style: normal;
    text-decoration: none;
}
a:hover ins, a:hover abbr, a:hover acronym {
    text-decoration: underline;
}
address {
    font-style: normal;
}
ul {
    list-style: none outside none;
}
q:before, q:after {
    content: "";
}
small {
    font-size: 0.9em;
}
textarea {
    overflow: auto;
}
.accessibility {
    left: -9999em !important;
    position: absolute !important;
}
input.submit {
    border: 0 none !important;
    cursor: pointer !important;
    height: 19px !important;
    overflow: visible;
    width: auto !important;
}
select {
    border: 1px solid #819DB3;
    color: #6C6C6C;
    font-family: Verdana;
    font-size: 8pt;
    height: 20px;
    overflow: visible;
    width: 130px;
}
form, fieldset {
    border: 0 none;
    outline: 0 none;
}
ol {
    color: #000000;
    font-size: 1.1em;
    margin: 0 0 10px;
}
ol li {
    list-style-position: inside;
    padding: 2px 0;
}
.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    line-height: 0;
    visibility: hidden;
}
.clearfix {
    display: inline-block;
}
html[xmlns] .clearfix {
    display: block;
}
* html .clearfix {
    height: 1%;
}
.display_none {
    display: none;
}
a {
    color: black;
}
body {
    font-size: 80%;
}
#container {
    background: none repeat scroll 0 0 #FFFFFF;
    margin: 0 auto;
    width: 1024px;
}
#container #container_wrapper {
    margin: 0 0 0 30px;
    width: 930px;
}
#content {
    width: 930px;
}
#breadcrumb {
    height: 24px;
    padding: 7px 0 0 10px;
    width: 920px;
}
#breadcrumb p {
    font-size: 120%;
    line-height: 17px;
}
#breadcrumb a:hover {
    color: #0066A1;
    text-decoration: underline;
}

.bold {
    font-weight: bold;
}
.dashed {
    border-bottom: 1px dashed #231F20;
}
.purple {
    color: #96299E;
}
.green {
    color: #175E54;
}
.stag {
    font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
}
@font-face {
    font-family: "StagBook";
    font-style: normal;
    font-weight: normal;
    src: url("/sso-webapp/assets/ctx/6226752b/static/fonts/stag-book-webfont.eot?#iefix") format("embedded-opentype"), url("/sso-webapp/assets/ctx/cc40a55b/static/fonts/stag-book-webfont.woff") format("woff"), url("/sso-webapp/assets/ctx/bdc238f5/static/fonts/stag-book-webfont.ttf") format("truetype"), url("/sso-webapp/assets/ctx/z70141ed6/static/fonts/stag-book-webfont.svg#StagBook") format("svg");
}
@font-face {
    font-family: "StagMedium";
    font-style: normal;
    font-weight: normal;
    src: url("/sso-webapp/assets/ctx/3967be3c/static/fonts/stag-medium-webfont.eot?#iefix") format("embedded-opentype"), url("/sso-webapp/assets/ctx/4295fa8/static/fonts/stag-medium-webfont.woff") format("woff"), url("/sso-webapp/assets/ctx/e79ed394/static/fonts/stag-medium-webfont.ttf") format("truetype"), url("/sso-webapp/assets/ctx/za775681e/static/fonts/stag-medium-webfont.svg#StagMedium") format("svg");
}
@font-face {
    font-family: "LucidaSansUnicodeRegular";
    font-style: normal;
    font-weight: normal;
    src: local("?"), url("/sso-webapp/assets/ctx/469bc010/static/fonts/l_10646-webfont.woff") format("woff"), url("/sso-webapp/assets/ctx/8d48c057/static/fonts/l_10646-webfont.ttf") format("truetype"), url("/sso-webapp/assets/ctx/z78ede97b/static/fonts/l_10646-webfont.svg#LucidaSansUnicodeRegular") format("svg");
}
.clear {
    clear: both;
}
p {
    color: #231F20;
    font-family: verdana,'LucidaSansUnicodeRegular',sans-serif;
    font-size: 90%;
    line-height: 14px;
}
li {
    list-style: none outside none;
}
a {
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
sup {
    font-size: 60%;
}
p.goTo {
    margin: 7px 0 5px;
    text-align: right;
}
p.goTo a.aGoTO {
    background-color: #808080;
    color: #FFFFFF;
    font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 90%;
    letter-spacing: 0.1em;
    padding: 4px;
}
p.goTo a.aGoTO:hover {
    background-color: #A626AA;
    text-decoration: none;
}
#two-different-zones-first {
    width: 150px;
}
#two-different-zones-second {
    width: 735px;
}
/* end general */

/* header */
#header {
    width: 100%;
}

#header-left {
    float: left;
    height: 125px;
    width: 302px;
}

#header-left a img {
    clear: left;
    margin: 20px 0 0 1px;
    display: block;
    height: 63px;
    text-indent: -9999px;
    width: 240px;
}

#header-right {
    float: left;
    height: 125px;
    text-align: right;
    width: 628px;
}

.logoaw {
	clear: left;
    margin: 0 0 0 20px;
    display: block;
    height: 104px;
    text-indent: -9999px;
    width: 155px;
}

#langues {
    clear: both;
    text-align: right;
}

#langues p.p-langue {
    background-color: #A626AA;
    color: #FFFFFF;
    float: right;
    font-family: verdana,sans-serif;
    font-size: 14px;
    padding: 3px 5px 4px;
}

#baseline {
    clear: both;
    text-align: right;
}

#baseline p {
    display: inline-block;
    font-family: 'StagBook','LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 18px;
    font-weight: normal;
    padding: 27px 0;
    text-align: right;
    width: 450px;
}

.side_wide {
    float: right;
    margin-bottom: 10px;
    text-align: left;
    width: 100%;
}

.side_wide form.select_country {
    float: right;
}

.side_wide form.select_country select {
    height: 19px;
}

.side_wide form.select_country input.submit {
    background: none repeat scroll 0 0 #000000;
    color: #FFFFFF;
    float: left;
    font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 80%;
    line-height: 14px;
    padding: 2px 3px 7px;
}
/* end header */

/* menu */
.menu {
    clear: left;
}
.menu ul {
    background: none repeat scroll 0 0 #8A8C8F;
    display: block;
    height: 22px;
}
.menu ul li:hover {
    background: none repeat scroll 0 0 #66A3C7;
}
.menu ul li {
    display: block;
    float: left;
    height: 22px;
    position: relative;
}
.menu ul li a {
    color: #FFFFFF;
    display: block;
    float: left;
	font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 110%;
    height: 22px;
    line-height: 22px;
    padding: 0 12px;
    text-decoration: none;
    vertical-align: middle;
}
.menu ul li a.active {
    background-color: #66A3C7;
    color: #231F20;
    display: block;
    float: left;
    font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 110%;
    height: 22px;
    line-height: 22px;
    padding: 0 12px;
    text-decoration: none;
    vertical-align: middle;
}
.msie6 .menu ul li a {
    height: 20px;
    padding-top: 3px;
    z-index: 20;
}
.msie7 .menu ul li a {
    display: block;
    height: 18px;
    padding-top: 5px;
    z-index: 20;
}
.msie8 .menu ul li a {
    height: 18px;
    padding-top: 5px;
    z-index: 20;
}
.menu ul li a:hover {
    background: none repeat scroll 0 0 #66A3C7;
    color: #231F20;
    text-decoration: none;
}
.menu ul li:hover a {
    color: #231F20;
}
.menu ul li:hover ul li a {
    background: none repeat scroll 0 0 #B4B4B4;
    color: #000000;
    font-family: verdana,'LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 90%;
}
.menu ul li ul {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 white;
    border-color: #FFFFFF #FFFFFF -moz-use-text-color;
    border-style: solid solid none;
    border-width: 1px;
    display: none;
    height: auto;
    left: 0;
    padding-bottom: 3px;
    position: absolute;
    top: 22px;
    z-index: 20;
}
.msie6 .menu ul li ul {
    position: absolute;
    z-index: 20;
}
.menu ul li ul li {
    background: none repeat scroll 0 0 #B4B4B4;
    border-top: 2px solid #FFFFFF;
    clear: left;
    z-index: 20;
}
.menu ul li:hover ul {
    display: block;
}
.menu ul li ul li a {
    color: #000000;
    display: block;
    font-size: 100%;
    height: auto;
    line-height: 22px;
    padding-bottom: 2px;
    width: 150px;
}
.menu ul li ul li a:hover {
    background: none repeat scroll 0 0 #A626AA;
    color: #FFFFFF;
}
/* end menu */

/* breadcrumb */
#breadcrumb {
    height: 24px;
    padding: 7px 0 0 10px;
    width: 920px;
}
#breadcrumb p {
    font-size: 120%;
    line-height: 17px;
}
#breadcrumb a:hover {
    color: #0066A1;
    text-decoration: underline;
}
/* end breadcrumb */

/* contentMiddle */
#contentMiddle {
    float: left;
	margin-top: 25px;
	margin-left: 257px;
	margin-right: 25px;
    padding: 0;
	width: 670px;
}
#contentMiddle ul li {
    list-style: square inside none;
}
#contentMiddle a {
    text-decoration: underline;
}
.bgGrey {
    background-color: #F5F5F5;
    margin-bottom: 15px;
    padding: 15px;
}
#selectLanguage {
    clear: both;
    height: 19px;
    margin-bottom: 15px;
}
#selectLanguage form.select_country {
    float: right;
}
#selectLanguage form.select_country input.submit {
    background: none repeat scroll 0 0 #000000;
    color: #FFFFFF;
    float: left;
    font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 80%;
    line-height: 14px;
    padding: 2px 3px 7px;
}
#contentMiddle h1 {
    color: #0066A1;
    font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 130%;
    font-weight: normal;
    margin-bottom: 15px;
	font-weight: bold;
}
#contentMiddle h2 {
    color: #0066A1;
    font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 160%;
    font-weight: normal;
    margin-bottom: 15px;
}
#contentMiddle h3 {
    color: #231F20;
    font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 90%;
    font-weight: normal;
}
#contentMiddle p {
    color: #231F20;
    font-family: verdana,'LucidaSansUnicodeRegular',sans-serif;
    font-size: 90%;
    line-height: 15px;
    margin-bottom: 10px;
	margin-top: 10px;
}
#contentMiddleTop {
    clear: left;
}
#contentMiddleBottom {
    border-top: 1px dashed #231F20;
    margin-top: 10px;
    padding-top: 20px;
}
#MiddleBottomLeft {
    float: left;
    padding-right: 20px;
    width: 254px;
}
#MiddleBottomRight {
    float: left;
    padding-right: 20px;
    width: 254px;
}
.MiddleBottomInner {
    clear: left;
    height: 55px;
    margin-bottom: 15px;
    width: 244px;
}
.MiddleBottomInnerImg {
    float: left;
    padding-right: 10px;
    width: 55px;
}
.MiddleBottomInnerTxt {
    float: left;
    width: 179px;
}
#contentMiddle p.pInner {
    line-height: 12px;
}
#contentMiddle p.pInner a {
    text-decoration: underline;
}
#contentMiddle p.pInner a:hover {
    color: #0066A1;
}
/* contentMiddle */

/* footer */
#footer {
    height: 20px;
    margin-top: 15px;
    width: 930px;
}
#footerLeft {
    float: left;
    height: 20px;
    width: 300px;
}
#footerRight {
    float: left;
    height: 20px;
    text-align: right;
    width: 630px;
}
#footer p {
    color: #898B8E;
    font-size: 80%;
}
#footer a {
    color: #898B8E;
    margin-right: 10px;
}
#footer a:hover {
    color: #898B8E;
    text-decoration: underline;
}
.dashed_footer {
	padding-top: 15px;
	border-top: 1px dashed #231F20;
}
/* end footer */

.mysubmit {
	background: none repeat scroll 0 0 #A626AA;
    color: #FFFFFF;
    float: right;
    font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
    font-size: 80%;
    line-height: 14px;
    padding: 3px 3px 3px;
	border: 0px solid;
	margin-top:5px;
}

.input[type = radio] {
    margin-right: 50px;
    background-color: transparent;
    border: none;
}

input[type = text] {
    width: 190px; 
}

input[type = password] {
    width: 190px; 
}

.errorTable {
    width: 710px;
    border: 0px;
    background-color: #F9F9F9;
    padding: 5px;
    color: #FF5555;
}

.infoTable {
    width: 710px;
    border: 0px;
    background-color: #EEEEEE;
    padding: 5px;
}

infoColumn {
    background-color: #EEEEEE;
}

div#central{
	margin-left: 257px;
}

.header {
    width: 930px;
    height: 265px;
}

.headertop {
    height: 80px;
}

.headerlinks {
    float: left;
    color: #6c6c6c;
}

.headerlinks a:link, .headerlinks a:visited {
    color: #6c6c6c;
    text-decoration: none;
}

.headerlinks a:hover {
    color: #d21241;
    text-decoration: none;
}

.headerlinks ul {
    margin: 30px 0 0 30px;
    padding: 0;
}

.headerlinks ul li {
    display: inline;
    padding-right: 2px;
}

.headerlinks form {
    display: inline;
}

.headerpic {
    background-image: url("/sso-webapp/assets/ctx/2d9dc6d/static/images/09_headerpic01.jpg");
    background-color: #d21241;
    height: 113px;
}

.headerbandeau {
    background-color: #d21241;
    height: 72px;
}

.headerbandeau .welcome {
    display: block;
    background-image: url("/sso-webapp/assets/ctx/18370b10/static/images/09_welcome_en.gif");
    width: 280px;
    height: 72px;
    float: left;
}

.headerbandeau .country {
    display: block;
    width: 140px;
    height: 72px;
    float: right;
}

.LatestNews {
    /*height:180px;*/
}

.LatestNews ul {
    padding-left: 0px;
    margin-left: 0px;
    margin-top: -7px;
    margin-bottom: -10px;
}

.LatestNews li {
    /*	padding-left: 1px;*/
    padding-bottom: 10px;
    color: #424242;
    font-weight: bold;
    font-size: 100%;
    list-style-type: none;
}

.LatestNews a, .LatestNews a:visited {
    color: #888;
    /*	font-weight: bold;*/
    text-decoration: underline;
    font-weight: normal;
}

.LatestNews a:hover {
    color: #000;
}

/* ----------- Navigation -----------------*/
.ariane {
    color: #999999;
    margin-bottom: 14px;
}

#nav, #nav ul {
    /*	z-index:200;*/
    /*	float: left;*/
    list-style: none;
    padding: 0;
    margin: 0;
}

#nav .inter {
    background-image: url("/sso-webapp/assets/ctx/24432129/static/images/09_fleche-menu_nav_h.gif");
    background-repeat: no-repeat;
}

#nav a {
    /*	z-index:200;*/
    display: block;
    color: #424242;
    font-weight: bold;
    text-decoration: none;
    padding: 0px 16px 4px 12px;
}

/*#nav a:hover {
 
 /*	z-index:200;*/
/*	color: #213f62;
 /*}*/
#nav li {
    /*	z-index:200;*/
    float: right;
    /*	padding: 1px 0 2px 0;*/
    padding: 2px 0 1px 0;
}

#nav li ul {
    /*	z-index:200;*/
    position: absolute;
    left: -999em;
    height: auto;
    width: 152px;
    border: 1px solid #A9A9A9;
    margin: 0px 0 0 0;
}

#nav li ul li {
    /*	z-index:200;*/
    background: #E3E3E3;
    width: 152px;
}

#nav li li {
    /*	z-index:200;*/
    /*	padding-right: 1em;*/
    width: 152px !important;
    width: 100%;
    border-bottom: 1px solid #CECECE;
}

#nav li ul a {
    /*	z-index:200;*/
    white-space: normal !important;
    width: 131px;
    font-weight: normal;
    padding: 1px 10px 1px 11px;
    color: #424242;
    line-height: 125%;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
    /*	z-index:200;*/
    left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
    /*	z-index:200;*/
    left: auto;
}

/*#nav li:hover, #nav li.sfhover {*/
/*	background: #E0EDF7;*/
/*}*/
#nav li li:hover, #nav li li.sfhover {
    /*	z-index:200;*/
    background: #CDCDCD;
}

#nav li li a:hover {
    /*	z-index:200;*/
    color: #424242;
}

#nav ul li ul {
    padding-top: 20px;
    margin-top: 20px;
}

/* ----------- Fin Navigation -----------------*/
.padbot {
    margin-bottom: 20px;
}

.padtop {
    margin-top: 5px;
}

.pied {
    width: 930px;
    color: #777;
    margin-left: 1px;
    padding: 0px 0 0 0;
    font-weight: normal;
    height: 20px;
}

.pied a, .pied a:hover, .pied a:visited {
    color: #777;
    font-weight: normal;
    text-decoration: underline;
}

.pied .copy {
    float: left;
    padding: 0 0 0 20px;
}

.pied ul {
    width: auto;
    float: right;
    margin-top: 0;
    margin-left: 0;
    padding-left: 0;
    display: inline;
}

.pied ul li {
    margin-left: 0;
    padding: 0px 5px;
    border-left: 1px solid #777;
    list-style: none;
    display: inline;
}

.pied ul li.premier {
    margin-left: 0;
    border-left: none;
    list-style: none;
    display: inline;
}

.spacer {
    clear: both;
    height: 200px;
}

.topnavHP {
    background-repeat: repeat-x;
    /*	background-color:#c6c6c6;	*/
    background-color: #fff;
    width: 930px;
    height: 20px;
    background-image: url("/sso-webapp/assets/ctx/9cf24b8a/static/images/09_menu_nav_top.gif");
}

.topnavHP .container {
    padding-left: 173px;
}

.mytextarea {
    border: 1px solid #819DB3;
    color: #6C6C6C;
    font-family: arial, verdana, sans serif;
    font-size: 100%;
    vertical-align: middle;
}

div#content {
	width: 670px;
}

.tablehomepage td {
    height: 60px;
    width: 150px;
    padding-right: 9px;
    padding-bottom: 9px;
}

.headerlinks ul li a.Go img {
    background-image: url("/sso-webapp/assets/ctx/47f547e/static/images/09_go.gif");
    background-repeat: no-repeat;
    border: 0 none;
    height: 20px;
    margin: 0 1px;
    vertical-align: middle;
    width: 26px;
}

#content div#infoMessage {
	color: #d21241;
    margin-top: 0px;
    margin-bottom: 16px;
    font-weight: bold;
	margin-left: 215px;
}

/* Error blocks */
div.t-error-single {
    background-color: white;
    color: red;
    display: block;
	font-style: italic;
	font-size: 70%;
    margin: 0;
    padding: 2px;
	padding-top: 5px;
}

IMG.t-error-icon {
    background: none;
	display: none;
}

/* Captcha input */
input#captcha_input {
	display: block;
	/*height: 16px;
	width: 50px;*/
}
img#captcha_kaptcha {
	padding-bottom: 5px;
}
input[id*="captcha"] {
	display: block;
}

a:link, a:active, a:visited {
    color: #000000;
}
a:hover {
    color: #0066A1;
    text-decoration: underline;
}
a.styleswitch_active:link, a.styleswitch_active:active, a.styleswitch_active:visited {
    text-decoration: none;
}
a.styleswitch_active:hover {
    text-decoration: none;
}

/* Table loggedIn */
table#loggedIn {
	width: 600px;
	background-color: #FFFFFF;
	table-layout: fixed;
	border-collapse: separate;
	border-spacing: 8px 8px;
	margin-left: 120px;
	margin-top: 25px;
}

table#loggedIn td {
	background-color: #FFFFFF;
	background-position: center center;
    border: 1px solid #C0C0C0;
    padding: 10px;
    vertical-align: top;
	overflow:hidden;
	width: 200px;
	height: 50px;
}

div#isoLanguagesAvailable {
	width: 930px;
}

div#isoLanguagesAvailable div {
	vertical-align: top;
}

form#isoLanguageForm ul {
    margin: 30px 0 0 30px;
    padding: 0;
}

form#isoLanguageForm ul li {
    display: inline;
    padding-right: 2px;
}

form#isoLanguageForm ul li label {
    color: #6C6C6C;
}


form#isoLanguageForm ul li a.Go img {
    background-image: url("/sso-webapp/assets/ctx/47f547e/static/images/09_go.gif");
    background-repeat: no-repeat;
    border: 0 none;
    height: 20px;
    margin: 0 1px;
    vertical-align: top;
    width: 26px;
}


/* DIV messages success, info and error */
/* ------------------------------ */
.errors, .success, .information {
    padding:20px 20px 20px 85px; /* bg */
    margin:3px 0px 10px 0px;
    font-weight:bold;
    font-size:1em;
    line-height:1.5;
}

.success {
    border:1px dotted #390;
    color:#346344;
    background:#9BCAAB url("/sso-webapp/assets/ctx/b93554a1/static/images/success.gif") no-repeat 2em 50%;
	width: 823px;
	margin:3px 0px 10px 0px;
}

.information {
    border:1px dotted #2284B3;
    color:#2284B3;
    background:#B2DCFF url("/sso-webapp/assets/ctx/e573f818/static/images/info.gif") no-repeat 2em 50%;
	width: 823px;
	margin:3px 0px 10px 0px;
}

.errors {
    border:1px dotted #b00;
    color:#d21241; /* bg */
    background:#fed url("/sso-webapp/assets/ctx/fc059cea/static/images/error.gif") no-repeat 2em 50%;
	width: 823px;
	margin:3px 0px 10px 0px;
}

label#passwordHintLabel {
	color: #666666;
	font-style:italic;
	font-size:70%;
}

#selectLanguageForm {
	float: right;
}

#img_go {
	vertical-align: top;
}

/* ============================================================
   Layout fixes for header language selector and Go button
   ------------------------------------------------------------
   The legacy layout was calibrated for IE6-era native controls;
   modern browsers render taller <select> elements which pushed
   the header language dropdown past its parent's fixed 125px
   height, causing it to overlap the banner image.  The 20x20
   gobutton.gif also looks broken next to the taller select.
   Scoped to .language-select-form so both the header and the
   SelectLanguage-page instances of the Language component are
   covered (Tapestry rewrites the duplicate id= attribute, so an
   id-based selector only hits the first instance).
   ============================================================ */

/* Let #header-right grow with its content instead of clipping
   into a fixed 125px box that the banner assumes ends there. */
#header-right {
	height: auto;
	min-height: 125px;
}

/* Push the top-right language selector clear of the banner. */
#header-right .side_wide {
	margin-bottom: 6px;
}

/* Keep label + <select> + Go button on a single line inside the
   table cell — otherwise the button wraps below the dropdown
   when the parent is narrow (e.g. .side_wide in the header). */
form.language-select-form td.language-select-cell {
	white-space: nowrap;
}

/* Compact black "go" button — replaces the raw 20x20 gobutton.gif
   with a native-styled square that sits inline with the modern
   taller <select>.  Matches the pre-migration Worldline look. */
form.language-select-form a.language-go {
	background-color: #000000;
	color: #FFFFFF;
	display: inline-block;
	font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
	font-size: 80%;
	line-height: 14px;
	margin-left: 4px;
	padding: 4px 8px;
	text-decoration: none;
	vertical-align: middle;
}
form.language-select-form a.language-go:hover {
	background-color: #333333;
	text-decoration: none;
}
form.language-select-form a.language-go img {
	display: none;
}
form.language-select-form a.language-go::after {
	content: "go";
	letter-spacing: 0.05em;
}

/* Shrink the native <select> to match the label's line-height so
   the dropdown, label text, and Go button all read at the same
   scale.  Height/padding tuned so total rendered height ~= label. */
form.language-select-form select {
	font-family: verdana,'LucidaSansUnicodeRegular',sans-serif;
	font-size: 90%;
	height: 22px;
	line-height: 16px;
	padding: 1px 4px;
	vertical-align: middle;
}

/* Keep every table cell in the language form on a shared baseline
   so the compact button sits next to the compact select cleanly
   even though they now live in separate <td>s. */
form.language-select-form table td {
	vertical-align: middle;
	padding: 0 4px 0 0;
}

/* ============================================================
   Login form width + OK-button placement
   ------------------------------------------------------------
   Tapestry 5.8 auto-imports Bootstrap, whose `input { width:100% }`
   stretches Email/Password across the whole content area.  The
   legacy `input[type=text] { width:190px }` at line 594 loses the
   specificity war.  Override with a more specific selector.
   Also neutralise .mysubmit's `float:right` inside the login form
   so the OK button sits next to the "(Or click here to register)"
   sentence instead of drifting to the far right edge.
   ============================================================ */

/* Force compact size on login + register inputs.  Bootstrap
   (auto-imported by Tapestry 5.8) applies form-control-style
   width:100% and ~40px padding via `.form-control`; use
   !important + high-specificity selectors so this override
   always wins, regardless of load order. */
#loginForm input[type="text"],
#loginForm input[type="password"],
#registerForm input[type="text"],
#registerForm input[type="password"] {
	box-sizing: content-box !important;
	width: 190px !important;
	height: 20px !important;
	padding: 2px 4px !important;
	font-size: 90% !important;
	line-height: 16px !important;
}

/* Same treatment for the <select> in registerForm (preferedLanguage)
   so it lines up with the surrounding text inputs. */
#registerForm select {
	box-sizing: content-box !important;
	width: 200px !important;
	height: 26px !important;
	padding: 2px 4px !important;
	font-size: 90% !important;
	line-height: 16px !important;
	vertical-align: middle;
}

/* Align every label cell right so labels sit flush against the
   inputs; align every input cell left so fields line up in a
   single vertical column.  Tighten row padding. */
#loginForm table td,
#registerForm table td {
	padding: 3px 6px 3px 0;
	vertical-align: middle;
}
#loginForm table tr > td:first-child,
#registerForm table tr > td:first-child {
	text-align: right;
	white-space: nowrap;
}

/* Purple submit button: sized to be readable, no longer floated. */
#loginForm .mysubmit,
#registerForm .mysubmit {
	background-color: #A626AA !important;
	color: #FFFFFF !important;
	float: none !important;
	font-family: 'StagMedium','LucidaSansUnicodeRegular',verdana,sans-serif;
	font-size: 90% !important;
	line-height: 16px !important;
	margin-left: 8px;
	padding: 4px 14px !important;
	vertical-align: middle;
	width: auto !important;
	height: auto !important;
	border: 0 none;
	cursor: pointer;
}
#loginForm .mysubmit:hover,
#registerForm .mysubmit:hover {
	background-color: #7d1c80 !important;
}

/* Login: put "(Or click here to register)" text and OK button on
   ONE line.  The .tml renders <input> before <p>, so flip visual
   order with flex. */
#loginForm tr:last-child td {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
#loginForm tr:last-child td p {
	margin: 0;
	order: -1;
	font-size: 90%;
}
#loginForm tr:last-child td .mysubmit {
	order: 0;
}

/* Register: captcha image sits above the captcha input; give it a
   little breathing room and keep both left-aligned in the cell. */
#registerForm img[alt="captcha"] {
	display: block;
	margin-bottom: 4px;
	border: 1px solid #cccccc;
}

/* "Change image" reload link — small, italic, tight against the
   captcha image and above the input. */
#registerForm #reloadCaptchaLink {
	display: inline-block;
	margin: 0 0 6px 0;
	font-size: 80%;
	font-style: italic;
	color: #0066A1;
	text-decoration: underline;
}
#registerForm #reloadCaptchaLink:hover {
	color: #A626AA;
}

/* Register submit row has colspan=2; left-align the button under
   the input column instead of the default full-width stretch. */
#registerForm tr:last-child td {
	text-align: left;
	padding-top: 10px;
}

/* Password hint appears inline in the error cell; keep it small
   and grey so it doesn't dominate the row. */
#registerForm label#passwordHintLabel {
	color: #666666;
	font-style: italic;
	font-size: 80%;
	white-space: normal;
	display: inline-block;
	max-width: 280px;
}


