.page-authorised-users .inner .authorised-user .details .name {
    width: 40% !important;
}
header 	{
	background: #001CB0 !important;
	border-top-color: #001CB0 !important;
}
body {
	font-family: 'Open Sans', sans-serif !important;
  background-image: none !important;
  background-color: #e7e7e7 !important;
}
body.page-sign-in.form.not-logged-in, body.page-.form.not-logged-in {
  background-image: url(/Content/images/myaccount-bg.jpg) !important;
}
/* start: use lighter text */
body.page-sign-in.form.not-logged-in > div.holder > section.container > div > form > div.form-header {
  color: #ffffff;
}
body.page-sign-in.form.not-logged-in > div.holder > section.container > div > form > div.two-column-form > h3 {
  color: #ffffff;
}
body.page-sign-in.form.not-logged-in > div.holder > section.container > div > form > div.form-header > div > h3 {
  color: #ffffff;
}
body.page-.form.not-logged-in > div.holder > section.container > div > form > div.form-header {
  color: #ffffff;
}
body.page-.form.not-logged-in > div.holder > section.container > div > form > div.two-column-form > h3 {
  color: #ffffff;
}
body.page-.form.not-logged-in > div.holder > section.container > div > form > div.form-header > div > h3 {
  color: #ffffff;
}
body.page-.form.not-logged-in > div.holder > section.container > div > form > div.form-header > h3 {
  color: #ffffff;
}
body.page-.form.not-logged-in > div.holder > section.container > div > form > div.form-header > h4 {
  color: #ffffff;
}
/* end: use lighter text */
header .mainnav, header .user-nav {
  font-size: 1em !important;
}
body > div.holder > section.intro > div > h1 {
  font-size: 2em;
}
header .mainnav a {
    background: #e7e7e7;
    color: #8a8a8a;
    border-radius: 3px 3px 0 0;
}
.page-youraccount .menu-youraccount a .type, .page-yourservice .menu-youraccount a .type, .page-sign-in .menu-sign-in a .type, .page-customer-details .menu-yourdetails a .type, .page-change-email .menu-yourdetails a .type, .page-change-password .menu-yourdetails a .type, .page-change-avatar .menu-yourdetails a .type, .page-info1 .menu-Info1 a .type, .page-info2 .menu-Info2 a .type, .page-info3 .menu-Info3 a .type, .page-info4 .menu-Info4 a .type, .page-info5 .menu-Info5 a .type, .page-info6 .menu-Info6 a .type, .page-info7 .menu-Info7 a .type, .page-info8 .menu-Info8 a .type, .page-info9 .menu-Info9 a .type, .page-info10 .menu-Info10 a .type, .mainnav .active .type, .mainnav .active a:hover .type, .user-nav .active .type, header .user-nav .active .type, .page-payaccount .menu-pay-online-tab a .type {
    border-color: #00DFED !important;
}
/* Can just apply this to #EmailAddress and #Password if desired */
input:hover, input:focus, textarea:hover, textarea:focus {
    box-shadow: 0 1px 2px #e7e7e7 inset;
    border-color: #e7e7e7;
    outline: none;
    color: #333;
}
input:focus, textarea:focus {
    background: #e5edf3;
}
input:hover, textarea:hover {
    background: #f2f6f9;
}
/* button styles */

.button, .wpwl-button {
    background-color: #00DFED;
    box-shadow: none;
    font-size: 1em;
    border: none;
}
.button:hover, .button:focus, .wpwl-button:hover, .wpwl-button:focus {
  background-color: #33C0BB;
  box-shadow: none;
  font-size: 1em;
  border: none;
}

.button.secondary-button {
    background-color: #e7e7e7;
    border: 3px solid #00DFED;
    color: #333;
    text-transform: none;
}
footer {
    background-color: #001CB0;
}
/* this is already being applied in the base style, explicitly set here in case the base changes */
h2.account-name {
  font-color: #001CB0;
  font-weight: 600;
}
/*
-- this is already controlled in SiteCss and reflects the primary colour selection.
body > div.holder > div.container > section.account-lists > div.inner > ul.nav > li.panel > a.header:hover {
  background-color: #001CB0
}
*/

.main-figures div.heading
{
  font-weight: normal !important;
}
.main-figures div.figure
{
  font-weight: bold !important;
  font-size: 28px !important;
}
.main-figures div.footer
{
  font-size: 1em !important;
  font-weight: normal !important;
}
.status-message {
  background: #e5edf3 !important;
  border: 1px solid #00DFED !important;
  color: #00DFED !important;
}
.chosen-account .account-name {
  line-height: 1.3 !important;
  font-size: 1.8em !important;
  font-weight: normal !important;
}
.page-account .chosen-account table tr td h4 {
  font-size: 1.2em !important;
  font-weight: normal !important;
}
.page-account .chosen-account .change-account {
  font-size: 1em;
  text-decoration: underline;
  font-weight: 600;
  color: #001CB0
}
.notifications .heading {
  color: #001CB0 !important;
  font-weight: 700 !important;
  line-height: 1.8 !important;
}
.notifications .message {
  font-weight: normal !important;
}
.button.sidr-rightmenu {
  background-color: #00DFED;
  border: none;
  font-size: 1.4em;
}
.inner .form-body ul li .radio-prompt {
  font-weight: 600;
}
header a.logo > img {
  width: 105%;
  margin-top: -2em;
  margin-bottom: -2em;
}
.main-heading h1 {
  font-size: 2em !important;
}
body > div.holder > section.intro > div > h1 {
  margin: 0.67em 0;
}
.main-heading .title h1 {
    margin: 0;
    margin-left: 0.5em;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}
/*
div.inner > form {
  padding-top: 1em;
}
body > div.holder > section.container > div > form > div.two-column-form > h3 {
  -padding-bottom: 1em;
}*/
.page-account .chosen-account .change-account {
    font-weight: normal;
    -color: #001CB0;
}
#statement-chart > svg > rect.hovered {
  fill: #00DFED !important;
}
/* Responsive image */
img.ri
{
	position: absolute;
	max-width: 80%;
	top: 10%;
	left: 10%;
	border-radius: 3px;
	box-shadow: 0 3px 6px rgba(0,0,0,0.9);
}
img.ri:empty
{
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
@media screen and (orientation: portrait) {
    img.ri { max-width: 90%; }
}
@media screen and (orientation: landscape) {
    img.ri { max-height: 90%; }
}

.card-payment-container {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
    overflow: hidden;
}
.card-payment-iframe {
    flex-grow: 1;
    border: none;
    margin: 0;
    padding: 0;
    min-width: 100%;
}
/*#cust-extras-app .two-column-form {*/
    /*float: none;*/
    /*width: auto;*/
/*}*/

.wpwl-wrapper-submit {
    border-top: 1px solid #ddd;
    margin-top: 1em;
    padding: 2em 0 0;
    width: 100%;
}
.wpwl-form {
    margin: 0;
}
.wpwl-label {
    padding-right: 0;
}

.card-payment.two-column-form .form-body li:nth-child(2n) {
    margin-top: 0;
}
.card-payment.two-column-form .form-body ul {
    margin: 0;
    padding: 0;
}


.direct-debit-request-container {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
    overflow: hidden;
}

.portal-iframe {
    flex-grow: 1;
    border: none;
    margin: 0;
    padding: 0;
}