/*! normalize.css v1.0.0 | MIT License | git.io/normalize */
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html,button,input,select,textarea{font-family:sans-serif}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}h2{font-size:1.5em;margin:.83em 0}h3{font-size:1.17em;margin:1em 0}h4{font-size:1em;margin:1.33em 0}h5{font-size:.83em;margin:1.67em 0}h6{font-size:.75em;margin:2.33em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}blockquote{margin:1em 40px}dfn{font-style:italic}mark{background:#ff0;color:#000}p,pre{margin:1em 0}code,kbd,pre,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:before,q:after{content:'';content:none}small{font-size:75%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}dl,menu,ol,ul{margin:1em 0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ul,nav ol{list-style:none;list-style-image:none}img{border:0;-ms-interpolation-mode:bicubic}svg:not(:root){overflow:hidden}figure{margin:0}form{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left:-7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;*overflow:visible}button[disabled],input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*height:13px;*width:13px}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}

body  {
  margin: 0px;
  color: #666666;
  background-color: white;
  font-family:  "Trebuchet MS", Helvetica, sans-serif;
  font-size: 10pt;
  text-align: left;
  background: url("/flexweb/xylem/assets/images/main_background.jpg") repeat-x;
}

ul {list-style-type: square}

.menu * {
  margin: 0;
  padding: 0;
}






div#home-page div#right-column h3, div#mainsummary div#main-table div#right-column h3 {border-bottom: 1px solid #cccccc; color: #cc0000}


div#banner { height: 119px}


div#top-bar {  height: 20px;padding:10px 20px 10px 20px;}
div#top-bar div { width: 50%; float:left}
div#top-bar div#inner-left{ font-size:9pt; }
div#top-bar div#inner-right{    text-align: right}

div#mainsummary table tr td {padding: 10px}

div#menu-bar {
  padding: 10px 0 10px 0;
}

div#content a {
  color: #03519f;
  font-weight: bold;
  text-decoration: none}

div#content a:hover {
  color:#cc0000;
}

div#content a.button
{
color: white;
display:block;
}

div#content {
  padding: 0 20px 0 30px;
  background-color: white;
}

.with_menus div#content {
  margin-left: 186px;
}

div.overflow-hidden {  overflow: hidden;}

.with_menus div#content table {
  overflow: auto
}

div#content div.download-box div.buttons a {
  float:left;

}

.menu li {
  list-style-type: none;
}

div#context_menu ul {
  list-style-type: none;
}

div#context_menu a.active, div#menu-bar a.active {
  text-decoration: none;
  cursor: default;
  color: #cc0000
}

div#context_menu {
  float:left;
  width:186px;
  background-color: white;
}

div#context_menu a, div#header a {
  color:#77787B;
  text-decoration: none
}

div#context_menu a:hover, div#menu-bar a:hover,div#header a:hover{
  color:#cc0000;
}

#content_wrapper.with_menus{
  float: left;
}

.collapsed {
  cursor: pointer;
}

.expanded {
  cursor: pointer
}

#wrapper {
  max-width: 980px;
  margin: auto;
  border-left: 1px solid #666666;
  border-right: 1px solid #666666;
  border-top: 1px solid #666666;


}

#content_wrapper {
  width: 100%;
  padding: 20px 0 20px 0;
  background-color: white;
  border-bottom: 1px solid #666666;
}

div#wrapper {margin-top: 20px}

div#context_menu, div#footer {

  font-weight: bold;

}

div#footer {
  padding: 10px 0 0 20px;
}

div#footer a {
  text-decoration: none;
  color: #919396;
}

div#footer a:hover {
  color: #cc0000
}

div#footer ul {
  margin:0;
  padding:0
}

div#footer ul li {
  display:inline;
  padding: 0 10px 0 10px;
  border-right: 1px solid #666666
}

div#footer ul li:first-child {
  padding-left: 0;
}

div#footer ul li.last-child {
  border: none
}

div#header {

  font-weight: bold;
  font-size: 11pt;
  height: 196px;
}

div#left-header-item {
  float:left;
  width: 25%
}

div#left-header-item-inner {
  border-top:1px solid #666666;
}

div#left-header-item-inner-inner {
  width: 70%;
  border-bottom:1px solid #666666;
  padding: 10px 0 10px 20px;
}

div#right-header-item {
  float: left;
  width: 25%
}

div#right-header-item-inner {
  border-top:1px solid #666666;
}

div#right-header-item-inner-inner {
  float: right;
  border-bottom: 1px solid #666666;
  width: 70%;
  padding: 10px 20px 10px 0;
  text-align: right
}

div#logo {
  float:left;
  width: 50%;
  text-align: center;
}



div#menu-bar ul {
  padding: 0;
  margin: 0;
  height: 17px
}

div#right-menu-bar {
  text-align: right
}

div#right-menu-bar ul li {
  display: inline;
  background: url('/flexweb/include/images/menu_bar_border.png') no-repeat right;
  padding: 0 18px 0 0;
}

div#right-menu-bar ul li.last-child {
  background: none;
  padding-right: 20px
}

div#right-menu-bar ul {
  margin: 0;
  padding: 0;
}

div#left-menu-bar {
  float:left;

}

div#left-menu-bar ul {
  padding-left: 20px
}

div#left-menu-bar ul li {
  display: inline;
  background: url('/flexweb/include/images/menu_bar_border.png') no-repeat right;
  padding: 0 18px 0 0;
}

div#left-menu-bar ul li.last-child {
  background: none;
}

div#picture {
  width: 90%;
  margin: auto;
  border: 3px solid white;
}

div#picture img {
  width: 100%
}

div#picture {
  margin-top: 20px;
}

.clearfix:after {
   content: ".";
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}

.header-item div {
  height: 100%
}



#header-employee-name {
  color: #cc0000
}

div#context_menu li.menu-label {
  background-color: #cc0000;
  padding: 5px 5px 5px 30px;
  color: white;
  font-size: 12pt;
  margin-left: -10px;
  text-transform: lowercase
}

div#context_menu li.menu-label div {
  background: url('/flexweb/include/images/menu_pointer.png') no-repeat right;
  margin-right: 5px
}



#context_menu li {
  margin: 10px 0 10px 20px;
  font-size: 10pt;
}

#context_menu li.menu-label:first-child {margin-top: 0;}

div#footer {clear:left;}


label.error {color:red}

.error {color: red}


table#personal-info {
display:none}


h1 { /*0-0-1*/
  margin: 0;
  padding: 0;
  font-size: 22pt;
  color: #03519f;
  font-weight: normal;

}

h2 {color: #03519f;}

strong, .strong { /*0-0-1*/
  color: red;
}

.rightalign { /*0-1-0*/
  text-align: right;
}


div#home-page div#welcome p {  font-weight: bold; color: #919396}

h4 {margin:0; padding:0; color:#03519f}


div.download-box {float: right; border: 1px solid #03519f; border-radius: 3px; width: 210px; padding: 10px; margin-left: 20px; margin-bottom: 20px;text-align: center; font-weight: bold}
div.download-box p {margin: 0; margin-bottom: 10px}
div.download-box span#statement-date {color: #03519f}

div.download-box div.buttons a { padding: 5px; width: 90px; text-align: center;}


div.download-box div.buttons a#print {margin-right: 5px; }




h3 {color: #03519f}

div.piechart {float: left; width: 50%}
div.piechart embed {width: 100%}

div#share-disposal table {border-collapse: collapse; margin-bottom: 2em}
div#share-disposal table td {border-right: 1px solid #ECECEC; padding: 1em; vertical-align: top; text-align: center;}
div#share-disposal table td:last-child {border: none}
div#share-disposal table {margin-bottom: 2em}



div.notes{background-color: #FAFAFA; padding: 1em; border-radius:3px;border: 6px solid #ececec; color:#222; margin:1em 0 1em 0}

form.datepicker-form {background-color: #FAFAFA; padding: 1em; border-radius:3px;border: 1px solid #ececec; color:#222; margin:1em 0 1em 0}

div#breadcrumbs {float: right; border-radius: 3px; border: 1px solid #03519f ; font-weight: normal; color:#666666; background-color:#ffffff; position: relative;}
div#breadcrumbs ul {list-style-type: none; margin:0; padding:0}
div#breadcrumbs {margin: 0 0 1em 1em; padding: 1em;  background-color: white}
div#breadcrumbs li {margin-bottom: 3px; padding-left: 1.5em}
div#breadcrumbs li:last-child {margin-bottom: 0}
div#breadcrumbs li.breadcrumbsOn {color: #03519f ;font-weight: bold; background: url('/flexweb/include/images/breadcrumb_pointer.png') no-repeat left;}





div#actions {margin-top: 1em;padding-top: 1em; border-top: 1px solid #03519f }
div#actions div {float:left; width:50%; text-align: right}
div#actions div:first-child {text-align: left}





input[type=submit] {margin: 0; padding: 0}
input[type="text"] {border-radius: 3px;}

a.button, input[type=submit], input[type="button"], input[type="reset"]{
background-color: #03519f;
border-radius: 2px;
padding: 7px;
border: none;
color: white;
font-weight: bold;

}

a.button:hover, input[type=submit]:hover, input[type="button"]:hover, input[type="reset"]:hover{
background-color: #cc0000;
cursor: pointer;
}

a.button {white-space: nowrap; text-align: center }

input[disabled=disabled] {background-color: #C6C6C6; border: none; }
input[disabled=disabled]:hover {cursor: default; background-color:#C6C6C6 }

input.cancel {
background-color: #666666;
}

input.cancel:hover{
background-color: #cc0000;
}

input[disabled=disabled]{

}

input[disabled=disabled]:hover{

}

div#vestingbarchart embed  {width: 100%}

.help-text {display: none}
.help-icon {cursor: pointer}



div.extra-banner {
width: 106%;




}

div.extra-banner-inner-left {
width: 75%;
margin: 14px 0 14px 0;
height: 1em;

float: left;
background: url('/flexweb/include/images/grey_pixel.png') repeat-x center;
}

div.extra-banner-inner-center {
width: 3%;
border-left: 1px solid #666666;
border-top: 1px solid #666666;
border-bottom: 1px solid #666666;



float: left;
}

div.extra-banner-inner-center-inner {
margin: 5px 0 5px 5px;
padding: 7px 0 7px 0;
background-color: #cc0000;
height: 1em;
}

div.extra-banner-inner-right {

width: 20%;


float: left;
}

div.extra-banner-inner-right-inner {
margin: 6px 0 7px 0;
padding: 7px 0 7px 20px;

height: 1em;
color: white;
font-weight: bold;
text-transform: uppercase;
background: url('/flexweb/include/images/menu_pointer.png') left center #cc0000 no-repeat;
}

div.extra-banner-inner-right {cursor: pointer}

div.extra-banner {margin: 1em 0 1em 0}


label
{font-weight: bold; }


div#disposal-chooseshares table th {background-color: #ECECEC; border: 1px solid #ececec;}


.see th {font-size:9pt;}

h3 {border-bottom: 1px solid #ECECEC;}





table {border-collapse: collapse;}
table td, table th {padding: 4px; vertical-align: top }
div#disposal-details table  {width: 70%}
div#disposal-details table td:first-child {width: 50%}
div#bankdetails table {width: 100%}
div#bankdetails table td:first-child {width: 30%}
div#bankdetails #status, div#bank-details-div #status {color: green}
div#bankdetails #status.error {color: red}

label.required {padding-right: 10px; background: url('/flexweb/include/images/red_asterisk.png') top right no-repeat}

table.stripeme {width: 100%}
table.stripeme th {text-transform: none; text-align: left}
table.stripeme tr.odd {background-color:#FAFAFA;}
table.stripeme th {background-color:#ECECEC;  }
table.stripeme th, table.stripeme td {padding: 4px}

div#manage-plans table {margin-bottom: 1em}
div#manage-plans table td {padding: 1em; vertical-align: top}
div#manage-plans table td:first-child {width: 30%}

p.table-caption {font-weight: bold; text-transform: uppercase}


p.table-caption {color: #03519f}
p.to-the-top {text-align: right}

table.plan-management td {border-left: 1px solid #ECECEC}
table.plan-management td:first-child {border: none}

table#sub-message-table th  {background-color: #ECECEC; }
table#sub-message-table th:first-child {border-top-left-radius: 3px}
table#sub-message-table th:last-child {border-top-right-radius: 3px}
table#sub-message-table td:first-child {border-bottom-left-radius: 3px}
table#sub-message-table td:last-child {border-bottom-right-radius: 3px}

div#free-transfer-select div.choice-box {padding: 4px}
div#free-transfer-select div.choice-box {border-top: 2px solid #CCC}

div.process-summary table td:first-child, div.transaction-personal-details table td:first-child {font-weight: bold; }

div#share-disposal table td {width: 30%}

div#exercise-payment-details table, div.process-summary table, div.transaction-persoanl-details table  {width: 70%}
div#exercise-payment-details table td:first-child, div.process-summary table td:first-child, div.transaction-personal-details table td:first-child {width: 30%; font-weight:bold}








.icon-mail-open {background-image: url("../images/ui-icons_03519f_256x240.png"); height: 16px; width: 16px; background-position: -96px -96px;}
.icon-mail-closed {background-image: url("../images/ui-icons_03519f_256x240.png"); height: 16px; width: 16px; background-position: -80px -96px;}
.icon-info {background-image: url("../images/ui-icons_03519f_256x240.png"); height: 16px; width: 16px; background-position: -16px -144px;}
.icon-circle-plus {background-image: url("../images/ui-icons_03519f_256x240.png"); height: 16px; width: 16px; background-position: -0px -192px;}


div.legend {padding: 10px}

table#option-table td.exercise-action {vertical-align: middle;}
table#option-table td.exercise-action { padding: 10px}
table#option-table th.exercise-action { padding: 4px 10px 0 10px}

input.hasDatepicker {width: 5em}

div#personal-details table {width: 100%}
div#personal-details table td:first-child {font-weight: bold; width: 30%}

div#personal-details table td:last-child, div#personal-details table td.last-child  {width: 20%; text-align: right}
div#personal-details table td:last-child a.button, div#personal-details table td.last-child a.button {display: inline}

div#exercise label {color: #666666;}


span.update-info-success {color: green}
span.update-info-error {color: red}


div#fps table {width: 100%}
table.psForm td:first-child {width: 30%}
table#buttons {padding: 5px 0 0 0;margin: 1em 0 0 0; border-top:1px solid #ececec}
table#buttons td {padding: 5px 0 0 0;text-align:right}

td#fps_main_subheader {border-bottom: solid 1px #ECECEC; color: #038aa8; padding: 2em 0 0 0}

div#fps h4 {color: #03519f;border-bottom: 1px solid #ECECEC; margin: 2em 0 0 0 }
div#fps label {color: #666666;}


div#dividend-voucher table#dividend-tax-voucher {width: 100%; border: 1px solid #D6D6D6; background-color: #FAFAFA; margin: 1em 0 0 0;}
div#dividend-voucher table#dividend-tax-voucher td {padding: 10px}

div#disposal-chooseshares table.stripeme {width: auto}

div.login-page {width: 80%; margin: auto}

.e-detail table {width: 100%}
.e-detail table td:first-child {font-weight: bold}

.print-only {display:none}

div#dealing-clearance table {width: 100%}
div#dealing-clearance table td:last-child, div#dealing-clearance table td.last-child {text-align: right}

table#charity-SAYE {width: 100%}
table#charity-SAYE td:last-child, table#charity-SAYE td.last-child {text-align: right}

div#saye-exercise table#spouse-details tr {background-color: white}

div#saye-exercise .ui-icon-info:hover {cursor:pointer}
div#saye-exercise fieldset { border: none; padding: 1em   }
div#saye-exercise fieldset legend {text-transform: uppercase; font-weight: bold; font-size: 0.8em }

table#exercise-options-SAYE {border-collapse: collapse; margin-bottom: 1em  }
table#exercise-options-SAYE td {padding: 1em}
table#exercise-options-SAYE tr {border-top: 1px solid  #cccccc; }
table#exercise-options-SAYE table tr {border: none  }

input[disabled=disabled], a.disabled {background-color: #C6C6C6; border: none; }
input[disabled=disabled]:hover, a.disabled:hover  {cursor: default; background-color:#C6C6C6 }

div#header a#share-price {color:#03519f}
td.dps  {vertical-align: top; padding: 5px}

#cc-notification
{
position: fixed !important;
z-index: 99999998 !important;
left: 0 !important;
width: 100% !important;
background:#03519F !important;
border-bottom: 1px dotted #CCC !important;
text-align:center;
height:45px;
vertical-align:middle !important;
color: #fff;
padding-top: 5px;
}
#cc-notification.cc-top
{
top: 0 !important;
}
#cc-notification a {color: #fff}
