/**
 * README:
 *
 * CONTRIBUTING:
 *   - Make sure to update the table of contents with any new components or large chunks of styles added.
 *   - Try to refrain from the use of px in the file in order to maximize page responsiveness.
 *   
 * Table of contents:
 *  1.0 WEM RESETS
 *  2.0 CORE RESETS
 *    2.1 GENERAL STYLES
 *  3.0 RESPONSIVE BANNER
 *  4.0 ARIA
 *  5.0 TOGG
 *  6.0 OVERLAY
 *  7.0 MOBILE ACCORDION
 *  8.0 READ MROE
 */


/**
 * 1.0 WEM RESETS
 */

.vui-preview button:hover,
.vui-preview .buttons a:hover {
  color: #1a4d78;
}

section {
  margin: 0;
}


/**
 * 1.0.1 WEM RESETS END
 */


/**
 * 2.0 CORE RESETS
 */

figure {
  margin: 0;
}


/**
 * 2.0.1 END CORE RESETS
 */


/**
 * 2.1 GENERAL STYLES
 */

.lower-roman {
  list-style: lower-roman;
}

.lower-alpha {
  list-style: lower-alpha;
}


/**
 * 2.1.1 END GENERAL STYLES
 */


/**
 * 3.0 RESPONSIVE BANNER
 */

.banner-copy {
  position: absolute;
  top: 50%;
  left: 5%;
  max-width: 58%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

@media all and (max-width: 767px) {
  .banner-copy {
    position: static;
    max-width: initial;
    padding-left: 1.3333rem;
    padding-right: 1.3333rem;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
}

html.ie8 .banner-copy {
  top: 25%;
}


/**
 * 3.0.1 END RESPONSIVE BANNER
 */


/**
 * 4.0 ARIA
 */

[aria-hidden="true"] {
/*  display: none;*/
}

.ariaHiddenDisplay {
  display: initial;
}

[role="button"] {
  cursor: pointer;
}


/**
 * 4.0.1 END ARIA
 */


/**
 * 5.0 TOGG
 */

.togg-control {
  padding-left: 0;
  border: none;
}

.terms-toggle {
  color: #0079c1;
  text-decoration: none;
}

.terms-toggle:hover {
  color: #0079c1;
  text-decoration: underline;
}

@media all and (min-width: 768px) and (max-width: 1199px) {
  .togg-control {
    padding-left: 1rem;
  }
}

@media all and (max-width: 767px) {
  .togg-control {
    padding-left: 1em;
    text-align: left;
  }
}


/**
 * 5.0.1 END TOGG
 */


/**
 * 6.0 OVERLAY
 */

.a-overlay {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

.a-overlay-shadow[role="presentation"] {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #000;
  opacity: .5;
  z-index: 0;
  cursor: pointer;
}

.a-overlay-content {
  position: absolute;
  top: 50%;
  left: 50%;
  padding: 2rem 1rem;
  max-width: 90%;
  min-width: 50%;
  border: .025rem;
  border-radius: 1rem;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: #fff;
}

.a-overlay-close,
.a-overlay-close:focus,
.a-overlay-close:hover {
  position: absolute;
  top: 0;
  right: 0;
  padding: 0;
  height: 1.5rem;
  width: 1.5rem;
  line-height: 1;
  -webkit-transform: translate(25%, -25%);
  transform: translate(25%, -25%);
  border: .075rem solid #0079c1;
  border-radius: 50%;
  background: #0079c1;
  color: #fff;
  font-size: 1.4666em;
  overflow: visible;
}

html.ie8 .a-overlay-content {
  top: 25%;
  left: 25%;
}


/**
 * 6.0.1 END OVERLAY
 */


/**
 * 7.0 MOBILE ACCORDION
 */

.mobile-accordion-control {
  pointer-events: none;
}

@media all and (max-width: 767px) {
  .mobile-accordion {
    padding-bottom: .5em;
    border-bottom: .1em solid #cacaca;
  }
  .mobile-accordion-control {
    position: relative;
    padding-top: .5em;
    padding-bottom: .25em;
    padding-right: 1em;
    text-align: left;
    cursor: pointer;
    border-top: .1em solid #cacaca;
    pointer-events: auto;
    font-size: 1.3em;
  }
  .mobile-accordion-control:after {
    content: attr(data-symbol);
    display: block;
    position: absolute;
    width: 1.25rem;
    height: 1.25rem;
    top: 60%;
    right: 0;
    border: .025em solid #0079c1;
    border-radius: 50%;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
    background: #0079c1;
    line-height: 1.1;
    color: #fff;
    text-align: center;
  }
  .mobile-accordion.columns:not(.nowrap) > .copy {
    padding: 0;
  }
  .mobile-accordion-control.copy {
    padding-bottom: 0;
  }
}


/**
 * 7.0.1 END MOBILE ACCORDION
 */


/**
 * 8.0 READ MORE
 */

.hr-read-more hr {
  margin-left: .6666rem;
  margin-right: .6666rem;
}

.read-text {
  position: relative;
  display: block;
  min-width: 6.6666rem;
  left: 50%;
  top: .2666rem;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}


/**
 * 8.0.1 END READ MORE
 */

html.ie8 .read-text {
  left: 25%;
}

ul.align,
ol.align {
  padding-left: 1rem;
}

.no-list {
  list-style: none;
}

.desktop-centered {
  text-align: center;
}

.attention {
  color: #ed1b24;
}

.no-wrap {
  white-space: nowrap;
}

.columns.one.twohalf >:first-child {
  margin: 0 0 0 17.25%;
}

.columns.one.twohalf > * {
  width: 65.5%;
}

.columns.two > .vertical-divide:first-child,
.columns.aside > .vertical-divide:first-child {
  border-right: 1px solid #cacaca;
}

@media all and (max-width: 767px) {
  .desktop-centered {
    text-align: initial;
  }
  .mobile-centered {
    text-align: center;
  }
  .icon-block > div {
    float: left;
  }
  .icon-block .copy-block {
    text-align: left;
    width: 75%;
    padding: 5px 0 0 15px;
  }
  .icon-block .copy-block.single-line {
    padding-top: 12px;
  }
  .columns.one.twohalf >:first-child {
    margin: inherit;
  }
  .columns.one.twohalf > * {
    width: inherit;
  }
  .columns.two > .vertical-divide:first-child,
  .columns.aside > .vertical-divide:first-child {
    border-right: none;
    border-bottom: 1px solid #cacaca;
    padding-bottom: 30px;
    margin-bottom: 30px;
  }
  .columns.two > .vertical-divide-no-mobile:first-child,
  .columns.aside > .vertical-divide-no-mobile:first-child {
    border: none;
    padding-bottom: inherit;
    margin-bottom: inherit;
  }
}

@media all and (min-width: 768px) {
  .desktop-flush-top {
    padding-top: 0;
  }
  .desktop-flush-right {
    padding-right: 0;
  }
  .desktop-flush-bottom {
    padding-bottom: 0;
  }
  .desktop-flush-left {
    padding-left: 0;
  }
}


.style-guide .columns > .vertical-divide:first-child {
  border-right: none;
  border-bottom: 1px solid #cacaca;
  margin-bottom: 30px;
}

.style-guide .columns > .vertical-divide.no-mobile:first-child {
  border: none;
  padding-bottom: inherit;
  margin-bottom: inherit;
}

@media screen and (min-width: 40em) {
  .style-guide .columns > .vertical-divide.medium-12:first-child {
    border-right: none;
    border-bottom: 1px solid #cacaca;
    margin-bottom: 30px;
  }
  .style-guide .columns > .vertical-divide.no-tablet:first-child {
    border: none;
    padding-bottom: inherit;
    margin-bottom: inherit;
  }
}

@media screen and (min-width: 64em) {
  .style-guide .columns > .vertical-divide:not(.large-12):first-child,
  .style-guide .columns > .vertical-divide:not(.medium-12):first-child {
    border-right: 1px solid #cacaca;
    border-bottom: none;
  }
}

