html {
  background-color: #f2f4f5; /* --color-grey2 */
  font-size: 62.5%;
  min-height: 100vh;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  font-family: XfinityStandard, Helvetica, Arial, sans-serif;
}

body {
  display: flex;
  flex-direction: column;
  font-size: 1.6rem;
  margin: 0;
  min-height: 100vh;
}

:focus {
  outline: none;
  border-radius: 0.3rem;
  border: 0.1rem dashed var(--color-blue-sky);
  transition:
    border 0.15s ease-in,
    outline 0.15s ease-in;
}

main:focus {
  outline: none;
}

#main {
  z-index: 2;
}

xc-header {
  background: #000000; /* --color-black */
  display: block;
  flex: 0 1 auto;
}

xc-footer {
  display: block;
  flex: 1 0 auto;
}

/* pages */
section + section {
  padding-top: 3.2rem;
}

/* layout */
.card {
  background-color: #FFFFFF; /* --color-white */
  border-radius: 0.3rem;
  padding: 1.8rem 1.8rem 2.4rem;
}

/* typography */
a {
  color: #0272B6; /* --color-blue-sky */
  outline: none;
  text-decoration: none;
}

a:hover:not([is="xhs-button"]):not(.xc-header--navigation-link):not(.xc-header--slim-navigation-link):not(.xc-header--dropdown-li a),
a:focus:not([is="xhs-button"]):not(.xc-header--navigation-link):not(.xc-header--slim-navigation-link):not(.xc-header--dropdown-li a) {
  color: #2b9cd8; /* --color-blue-genie */
  text-decoration: underline;
}

a:active:not([is="xhs-button"]) {
  color: #015383; /* --color-blue-moon */
}

h2 {
  color: #191919; /* --color-grey10 */
  font-size: 2rem;
  font-weight: 200; /* --font-weight-extralight */
  letter-spacing: 0.05rem; /* --letter-spacing-wide */
  line-height: 1.5;
  margin: 1.2rem 0;
  text-transform: none;
}

@media only screen and (min-width: 102.4rem) {
  h2 {
    font-size: 2.4rem;
    line-height: 1.5
  }
}

h3 {
  color: #191919; /* --color-grey10 */
  font-size: 1.8rem;
  font-weight: 500; /* --font-weight-medium */
  letter-spacing: 0.05rem; /* --letter-spacing-wide */
  line-height: 1.5;
  margin: 0;
  text-transform: none;
}

p {
  margin-top: 0.4rem;
}

@media only screen and (min-width: 102.4rem) {
  h3 {
    font-size: 2rem;
    line-height: 1.5
  }
}

@font-face {
  font-family: XFINITYStandard;
  font-weight: 100;
  font-style: normal;
  font-display: swap;
  src: url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Thin.woff2") format("woff2"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Thin.woff") format("woff"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Thin.ttf") format("truetype");
}

@font-face {
  font-family: XFINITYStandard;
  font-weight: 200;
  font-style: normal;
  font-display: swap;
  src: url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-ExtraLight.woff2") format("woff2"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-ExtraLight.woff") format("woff"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-ExtraLight.ttf") format("truetype");
}

@font-face {
  font-family: XFINITYStandard;
  font-weight: 300;
  font-style: normal;
  font-display: swap;
  src: url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Light.woff2") format("woff2"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Light.woff") format("woff"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Light.ttf") format("truetype");
}

@font-face {
  font-family: XFINITYStandard;
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  src: url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Regular.woff2") format("woff2"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Regular.woff") format("woff"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Regular.ttf") format("truetype");
}

@font-face {
  font-family: XFINITYStandard;
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Medium.woff2") format("woff2"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Medium.woff") format("woff"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Medium.ttf") format("truetype");
}

@font-face {
  font-family: XFINITYStandard;
  font-weight: bold;
  font-style: normal;
  font-display: swap;
  src: url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Bold.woff2") format("woff2"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Bold.woff") format("woff"),
    url("https://sdx.xfinity.com/fonts/latest/Xfinity_Standard/XfinityStandard-Bold.ttf") format("truetype");
}