@media (min-width: 768px) {
  /* 
        Setting the pageContentContainer height. This div contains everything between the header and footer elements
        The calculation sets the minimum height of the pageContentContainer to 
        height of the page minus the combined height of the footer and header. 
        We use the min-height atrribute so that if the page contents are longer than the window height then 
        the section is not truncated as it would be if we used the height attribute.
    */
  #pageContentContainer {
    min-height: -webkit-calc calc(100vh - 299px);
    min-height: -moz-calc calc(100vh - 299px);
    min-height: calc(100vh - 225px);
  }
}

.fade-in {
  animation: fadeIn ease 1s;
  -webkit-animation: fadeIn ease 1s;
  -moz-animation: fadeIn ease 1s;
  -o-animation: fadeIn ease 1s;
  -ms-animation: fadeIn ease 1s;
}

@-moz-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-o-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@-ms-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.my-quickfinder-label {
  font-family: gilmer-medium,sans-serif;
  font-weight: 400;
  font-size: .9375rem;
}

a.remove-link {
  font-size: .875rem;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2034%2034%22%3E%3Crect%20x%3D%227.48%22%20y%3D%226.59%22%20width%3D%2219.03%22%20height%3D%2225.22%22%20rx%3D%222.09%22%20fill%3D%22%23fff%22%20stroke%3D%22%23CAE1EF%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%2F%3E%3Crect%20x%3D%2213.34%22%20y%3D%222.37%22%20width%3D%227.32%22%20height%3D%225.83%22%20rx%3D%220.62%22%20fill%3D%22%23fff%22%20stroke%3D%22%23CAE1EF%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%2F%3E%3Crect%20x%3D%226.38%22%20y%3D%225.45%22%20width%3D%2221.25%22%20height%3D%223.94%22%20rx%3D%220.87%22%20fill%3D%22%23fff%22%20stroke%3D%22%23CAE1EF%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2213.23%22%20x2%3D%2212%22%20y2%3D%2227.98%22%20fill%3D%22none%22%20stroke%3D%22%23CAE1EF%22%20stroke-linecap%3D%22round%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%2F%3E%3Cline%20x1%3D%2217%22%20y1%3D%2213.23%22%20x2%3D%2217%22%20y2%3D%2227.98%22%20fill%3D%22none%22%20stroke%3D%22%23CAE1EF%22%20stroke-linecap%3D%22round%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%2F%3E%3Cline%20x1%3D%2222%22%20y1%3D%2213.23%22%20x2%3D%2222%22%20y2%3D%2227.98%22%20fill%3D%22none%22%20stroke%3D%22%23CAE1EF%22%20stroke-linecap%3D%22round%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%2F%3E%3C%2Fsvg%3E");

}

.my-help-text {
  color: #54565b !important;
  font-family: gilmer-regular,sans-serif !important;
  font-weight: 400 !important;
  font-style: normal !important;
  margin-top: 0 !important;
  margin-bottom: .5rem !important;
  font-size: .9375rem !important;
}

/*****Beneficiaries ***********/

.beneficiaryContainer {
  border: 1px solid #CAE1EF;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  padding: 10px;
  background-color: #FFFFFF !important;
  height: 385px;
  text-align: center;
  position: relative;
  margin-right: 15px;
  margin-bottom: 15px;
  float: left;
}


  .beneficiaryContainer > span {
    display: block;
    width: 100%;
    font-size: 14px;
    border: 0px solid white;
    margin-bottom: 5px;
  }

  .beneficiaryContainer > label.standardLabel {
    display: block;
    width: 100%;
    padding: 5px 0 5px 5px;
    font-size: 14px;
    background-color: rgba(0,0,0,0.25);
    font-weight: 500;
  }

  .beneficiaryContainer label.deleteLabel {
    display: block;
    margin-left: 5px;
    padding: 5px 0 5px 5px;
    font-size: 14px;
    background-color: rgba(0,0,0,0.25);
    width: 60px;
  }

.beneficiaryCheckbox {
  position: absolute;
  left: -10px;
}

.beneficiaryContainer span.Name {
  height: 75px;
}

.beneficiaryContainer span.Address {
  height: 50px;
}

.beneficiaryContainer span.Name, .beneficiaryContainer span.NominatedPercentage {
  font-size: 22px !important;
}


.toBeDeleted {
  background-color: #CCCCCC !important;
}

  .toBeDeleted span.Name {
    text-decoration: line-through;
  }


.beneficiaryContainer .addButton {
  color: #CAE1EF;
  background-color: rgba(255,255,255,0);
  background: transparent;
  border: 8px solid #CAE1EF;
  border-radius: 50%;
  height: 106px;
  width: 106px;
  position: relative;
  top: 33%;
  font-family: Arial,Verdana,Helvetica,Sans-Serif;
  line-height: 1em;
}

  .beneficiaryContainer .addButton,
  .beneficiaryContainer .addButton:hover {
    background-color: rgba(255,255,255,0);
  }

.beneficiaryContainer > .addButton:hover {
  color: #000000;
  border: 8px solid #000000;
  border-radius: 50%;
  height: 106px;
  width: 106px;
  position: relative;
  top: 33%;
  font-family: Arial,Verdana,Helvetica,Sans-Serif;
  line-height: 1em;
}

.beneficiaryContainer > .addButton:focus {
  color: #000000;
  border: 8px solid #000000;
  border-radius: 50%;
  height: 106px;
  width: 106px;
  position: relative;
  top: 34%; /* This is 1% more than 'standard' above to give the impression of being pressed */
  font-family: Arial,Verdana,Helvetica,Sans-Serif;
  line-height: 1em;
}

.beneficiaryContainer .addButton:hover > span {
  color: #000000;
  border-color: #000000;
}

.beneficiaryContainer > .addButton > span {
  font-size: 115px;
  position: relative;
  top: 18px;
}

.deleteMessage {
  margin-top: 5px;
  font-size: 14px;
  font-style: italic;
}

div.NominatedBeneficiaries {
  background-color: #FFFFFF;
  border: 1px solid #D0D4D8;
  margin-bottom: 15px;
  margin-left: 15px;
  margin-right: 15px;
  padding: 15px;
}


  div.NominatedBeneficiaries table.data_table {
    display: none;
  }

  div.NominatedBeneficiaries div.controls {
    display: none;
  }

  div.NominatedBeneficiaries p {
    padding-left: 10px;
    padding-right: 10px;
    font-size: 14px;
  }

.hidden {
  display: none;
}

/******************************* Additional AVC chart colours added by Rupert Tazewell, Procentia 25/11/2020 ***************************************/
.clear-table.avcs-investment-breakdown th.fund-title.procentia1:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia1:before {
  background-color: #CAE1EF;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia2:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia2:before {
  background-color: #c20114;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia3:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia3:before {
  background-color: #adacab;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia4:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia4:before {
  background-color: #005faa;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia5:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia5:before {
  background-color: #26ae76;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia6:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia6:before {
  background-color: #A2EAF2;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia7:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia7:before {
  background-color: #FFBFBF;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia8:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia8:before {
  background-color: #A0EFA7;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia9:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia9:before {
  background-color: #FFE2B2;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia10:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia10:before {
  background-color: #CE93CE;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia11:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia11:before {
  background-color: #FFF07F;
}

.clear-table.avcs-investment-breakdown th.fund-title.procentia12:before, .clear-table.avcs-latest-funds-value-table th.fund-title.procentia12:before {
  background-color: #6D8AFF;
}

/******************************* End of Additional AVC chart colours ******************************************************************************/

.procentiaviewbutton {
  padding: 0 .75rem;
  border-radius: 999px;
  background-color: #e7e6e4;
  height: 2.4375rem;
  font-size: .875rem;
  line-height: 2.35rem;
  font-family: gilmer-medium, sans-serif;
  font-weight: 400;
}


/************ Addition of Arrow to Menu Header in dropdown section  **************/
.primary-navigation-sub-menu h2 {
  display: inline-block;
  background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2055.41%2029.83%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M52.55%2012.17L40.63.25l-2.74%202.74%209.99%209.99H1.18v3.87h46.7l-9.99%209.99%202.74%202.74%2011.92-11.92%202.75-2.75-2.75-2.74z%22%2F%3E%3C%2Fsvg%3E);
  background-repeat: no-repeat;
  background-position: top 70% right;
  background-size: 25px 25px;
  padding-right: 2.0625rem;
}


ul.basiclist li {
  list-style: disc;
}



/*** CSS added from scheme site for Complaints ****/
h4.red {
  color: #c20114;
}

ul.contact-icons {
  border-left: none;
  margin-left: 0
}

  ul.contact-icons li {
    background-repeat: no-repeat;
    background-size: 40px 40px;
    padding-left: 4.125rem
  }

    ul.contact-icons li.email {
      background-image: url(/resources/client/Assets/img/icon-email.svg)
    }

    ul.contact-icons li.letter {
      background-image: url(/resources/client/Assets/img/icon-envelope.svg)
    }

    ul.contact-icons li.phone {
      background-image: url(/resources/client/Assets/img/icon-phone.svg)
    }

    ul.contact-icons li.laptop {
      background-image: url(/resources/client/Assets/img/icon-laptop.svg)
    }

    ul.contact-icons li:before {
      content: '';
      display: none
    }
/*** End of CSS added from scheme site for portal Complaints ****/

.search-field-mobile {
  color: #FFFFFF !important;
}

/* Striped Info Table */

table.striped-info-table {
  border-width: 5px 0 0 0;
  border-collapse: collapse;
  border-top-color: #CAE1EF;
  border-style: solid;
  background-color: #CAE1EF;
}

  table.striped-info-table > thead > tr,
  table.striped-info-table > tbody > tr {
    border-color: #CAE1EF;
  }

    table.striped-info-table > thead > tr.even,
    table.striped-info-table > tbody > tr.even {
      background-color: #FFFFFF;
    }


    table.striped-info-table > thead > tr.odd,
    table.striped-info-table > tbody > tr.odd {
      background-color: rgba(123,201,206,.15);
    }
/* End of Striped Info Table */

/* Switch */
div.dark ul {
  color: #FFFFFF;
}

  div.dark ul li {
    list-style: disc;
  }


/* End of Switch */

/* Your AVCs */

.YourAVCs .panel-internal {
  padding: 0px;
}

.YourAVCs .panel-header {
  margin-left: 0;
  margin-right: 0;
  background-color: #CAE1EF;
  border-radius: 18px 18px 0 0;
}

.YourAVCs .panel-content {
  margin-left: 1.25rem;
  margin-right: 1.25rem;
}

section.YourAVCs h3 {
  margin-bottom: 0.5rem;
}

.YourAVCs .panel-with-header.header-dark .panel-header h3 {
  font-size: 1.75rem;
  color: #fff;
  font-family: gilmer-medium,sans-serif;
  font-weight: 400;
  margin-bottom: 0;
}



.YourAVCs .panel-with-header .panel-header {
  padding: 1.75rem 2.75rem 2rem 2.75rem;
  border-radius: 18px 18px 0 0;
  margin-left: 0;
  margin-right: 0;
}


.YourAVCs .accordion table, .accordion tbody, .accordion tfoot, .accordion thead {
  border: none;
  font-size: 1.125rem;
}


/* End of Your AVCs */

/* Fund factsheets */
.fundfactsheets .accordion-content p {
  margin-bottom: 15px;
}

.fundfactsheets .accordion-content .button {
  margin-top: 15px;
}

/* End of Fund factsheets */

/*

footer {
  background-color: #021B41;
}



.button, .button.disabled, .button.disabled:focus, .button.disabled:hover, .button[disabled], .button[disabled]:focus, .button[disabled]:hover {
  background-color: #2E5C99;
  color: #FFF;
}

.button:focus, .button:hover {
  background-color: #CAE1EF;
  color: #021B41;
}

  .button.secondary:focus, .button.secondary:hover {
    background-color: #2E5C99;
    color: #fff;
  }




.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  color: #021B41;
}


.panel--account p {
  color: #021B41;
}

.panel--account__input {
  color: #021B41;
}

  .panel--account__input:focus {
    color: #7A2016;
    border-color: #7A2016;
  }

.panel--account {
  border: solid 1px #2E5C99;
  box-shadow: 0 5px 18px 0 rgba(46,92,153,.31);
}


.panel--account__password-toggle {
  
}

*/

.sub-header {
  background-color: transparent;
}

header img {
  height: 50%;
}



h2, h2.h1, strong {
  font-family: OpenSans-bold,sans-serif;
  font-weight: 700
}

ul.includeBulletPoints {
  list-style-type: disc;
  list-style-position: outside;
}

  ul.includeBulletPoints li::before {
    content: '-' ;
    position: absolute;
    top: 0;
    left: -1.25rem;
  }