body[data-color-scheme="light"] .desktop-container {
	background-color: #fff !important;
}
body[data-color-scheme="dark"] .desktop-container {
	background-color: #000 !important;
}

body[data-color-scheme="dark"] .mobile-container,
body[data-color-scheme="dark"] .section.light {
	background-color: #000 !important;
	color: #fff !important;
}

body[data-color-scheme="dark"] {
	--mcfly-main-background: #000;
	--mcfly-card-background: #333;
	--text-color: rgb(245, 245, 247);
	--link-color: rgb(41, 151, 255);
}

@media only screen and (max-width: 734px) {
	body[data-color-scheme="light"],
	body[data-color-scheme="light"] .desktop-container,
	body[data-color-scheme="light"] .mobile-container,
	body[data-color-scheme="light"] .dark {
		background-color: #fff;
	}
}

body[data-color-scheme="light"] .desktop-container img:not(a.cta img),
body[data-color-scheme="light"] .mobile-container img:not(a.cta img) {
	border: none !important;
}

#main > div > table > tbody > tr:nth-child(1) > td > div > table > tbody > tr > td > table > tbody > tr > td {
	background-color: var(--mcfly-main-background) !important;
}


body[data-color-scheme='dark'] html-button.btn-base.btn.btn-primary {
	color: #fff;
	border-radius: 999px;
}

body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td,
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td,
body[data-color-scheme="dark"].hello-dev #main > div > div.mobile-container > div > div > div.row {
	background-color: var(--mcfly-main-background) !important;
	border-radius: inherit !important;
}

/* MAIN BACKGROUND - More specific to override card styles when inside 66% area */
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td[align="center"]:has(td[width="66%"]),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td[align="center"]:has(td[width="66%"]) > table > tbody > tr > td:has(h4):has(img) td,
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td[align="center"] td[width="66%"],
/* FORCE main background for ALL headings inside 66% area */
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td[align="center"] td[width="66%"] *:has(h1),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td[align="center"] td[width="66%"] *:has(h2),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td[align="center"] td[width="66%"] *:has(h3),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td[align="center"] td[width="66%"] *:has(h4),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td[align="center"] td[width="66%"] *:has(h5),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td[align="center"] td[width="66%"] *:has(h6),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td[align="center"] td[width="66%"] td {
	background-color: var(--mcfly-main-background) !important;
	/* background-color: green !important; */
}

/* CARDS - Only apply to elements OUTSIDE the 66% area */
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h6):has(img):not(:has(td[width="66%"])),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h5):has(img):not(:has(td[width="66%"])),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h4):has(img):not(:has(td[width="66%"])),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h3):has(img):not(:has(td[width="66%"])),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h2):has(img):not(:has(td[width="66%"])),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h1):has(img):not(:has(td[width="66%"])),
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h6):has(img):not(:has(td[width="66%"])) td,
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h5):has(img):not(:has(td[width="66%"])) td,
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h4):has(img):not(:has(td[width="66%"])) td,
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h3):has(img):not(:has(td[width="66%"])) td,
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h2):has(img):not(:has(td[width="66%"])) td,
body[data-color-scheme="dark"].hello-dev #main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td:has(h1):has(img):not(:has(td[width="66%"])) td {
	background-color: var(--mcfly-card-background) !important;
	/* border-radius: 18px; */
}
body[data-color-scheme="dark"].hello-dev #main > div > div.mobile-container > div > div > div.row > div > div.nestedColumn > div {
	background-color: var(--mcfly-main-background);
}

body[data-color-scheme="dark"] #main > div > div.mobile-container > div > div > div.row > div > div.nestedColumn .col {
	background-color: var(--mcfly-main-background) !important;
}

body[data-color-scheme="dark"] #main > div > div.mobile-container > div > div > div.row > div > div.nestedColumn > div.col div {
	background-color: var(--mcfly-main-background) !important;
}

/* body[data-color-scheme="dark"] #main > div > div.mobile-container * {
	border-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
} */

/* body[data-color-scheme="dark"] #main > div > div.mobile-container img {
	border-radius: 18px !important;
} */


/* END CARDS */

body[data-color-scheme="dark"].hello-dev #main > div > table > tbody a:not(.html-button),
body[data-color-scheme="dark"].hello-dev #main > div > div.mobile-container > div > div > div.row > div > div.nestedColumn > div > div > a:not(.html-button),
body[data-color-scheme="dark"].hello-dev #main p a:not(.html-button) {
	color: var(--link-color);
}

body[data-color-scheme="dark"] .mobile-container p,
body[data-color-scheme="dark"] .mobile-container h1,
body[data-color-scheme="dark"] .mobile-container h2,
body[data-color-scheme="dark"] .mobile-container h3,
body[data-color-scheme="dark"] .mobile-container h4,
body[data-color-scheme="dark"] .mobile-container h5,
body[data-color-scheme="dark"] .mobile-container h6,
body[data-color-scheme="dark"] .desktop-container p,
body[data-color-scheme="dark"] .desktop-container h1,
body[data-color-scheme="dark"] .desktop-container h2,
body[data-color-scheme="dark"] .desktop-container h3,
body[data-color-scheme="dark"] .desktop-container h4,
body[data-color-scheme="dark"] .desktop-container h5,
body[data-color-scheme="dark"] .desktop-container h6 {
	color: var(--text-color) !important;
}

body[data-color-scheme="dark"] .mobile-container p.outBold,
body[data-color-scheme="dark"] .mobile-container h1.outBold,
body[data-color-scheme="dark"] .mobile-container h2.outBold,
body[data-color-scheme="dark"] .mobile-container h3.outBold,
body[data-color-scheme="dark"] .mobile-container h4.outBold,
body[data-color-scheme="dark"] .mobile-container h5.outBold,
body[data-color-scheme="dark"] .mobile-container h6.outBold,
body[data-color-scheme="dark"] .desktop-container p.outBold,
body[data-color-scheme="dark"] .desktop-container h1.outBold,
body[data-color-scheme="dark"] .desktop-container h2.outBold,
body[data-color-scheme="dark"] .desktop-container h3.outBold,
body[data-color-scheme="dark"] .desktop-container h4.outBold,
body[data-color-scheme="dark"] .desktop-container h5.outBold,
body[data-color-scheme="dark"] .desktop-container h6.outBold,
body[data-color-scheme="dark"] #main > div > div.mobile-container > div > div > div.row > div > div.nestedColumn > div > div.copy:first-of-type,
body[data-color-scheme="dark"] #main > div > div.mobile-container > div > div > div.row > div > div.copy > p {
	color: var(--text-color) !important;
	/* opacity: 0.5; */
}

body[data-color-scheme="dark"] .light,
body[data-color-scheme="dark"] .light h1,
body[data-color-scheme="dark"] .light h1 a,
body[data-color-scheme="dark"] .light h1 a:hover,
body[data-color-scheme="dark"] .light h1 a:visited,
body[data-color-scheme="dark"] .light h2,
body[data-color-scheme="dark"] .light h2 a,
body[data-color-scheme="dark"] .light h2 a:hover,
body[data-color-scheme="dark"] .light h2 a:visited,
body[data-color-scheme="dark"] .light h3,
body[data-color-scheme="dark"] .light h3 a,
body[data-color-scheme="dark"] .light h3 a:hover,
body[data-color-scheme="dark"] .light h3 a:visited,
body[data-color-scheme="dark"] .light h4,
body[data-color-scheme="dark"] .light h4 a,
body[data-color-scheme="dark"] .light h4 a:hover,
body[data-color-scheme="dark"] .light h4 a:visited {
	color: var(--text-color);
}

body[data-color-scheme="dark"] .keyline {
	border-color: #ddd !important;
}

/* img[src="/click/images/mcfly/14_chevron_2997ff_2x.png"] {
} */

html {
	font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

body .desktop-container,
body .mobile-container,
body .t-body,
body p,
body td,
body .desktop-container p,
body .mobile-container p,
body .desktop-container td,
body .mobile-container td {
	font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

body:lang(ja) .desktop-container,
body:lang(ja) .mobile-container,
body:lang(ja) .t-body,
body:lang(ja) p,
body:lang(ja) td,
body:lang(ja) .desktop-container p,
body:lang(ja) .mobile-container p,
body:lang(ja) .desktop-container td,
body:lang(ja) .mobile-container td {
	letter-spacing: 0em;
	font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

body:lang(ko) .desktop-container,
body:lang(ko) .mobile-container,
body:lang(ko) .t-body,
body:lang(ko) p,
body:lang(ko) td,
body:lang(ko) .desktop-container p,
body:lang(ko) .mobile-container p,
body:lang(ko) .desktop-container td,
body:lang(ko) .mobile-container td {
	letter-spacing: 0em;
	font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

body:lang(zh-CN) .desktop-container,
body:lang(zh-CN) .mobile-container,
body:lang(zh-CN) .t-body,
body:lang(zh-CN) p,
body:lang(zh-CN) td,
body:lang(zh-CN) .desktop-container p,
body:lang(zh-CN) .mobile-container p,
body:lang(zh-CN) .desktop-container td,
body:lang(zh-CN) .mobile-container td {
	letter-spacing: 0em;
	font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

body,
input,
textarea,
select,
button {
	font-synthesis: none;
	-moz-font-feature-settings: "kern";
	font-feature-settings: "kern";
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	direction: ltr;
	text-align: left;
}

body[data-color-scheme="dark"] .main-bg-override {
	background-color: var(--mcfly-main-background) !important;
}

body[data-color-scheme="dark"] .card-bg-override {
	background-color: var(--mcfly-card-background) !important;
}

td {
	overflow: hidden !important;
}

/* Link color fix */
html > body[data-color-scheme="dark"] main div.mobile-container a,
html > body[data-color-scheme="dark"] main table a {
	color: #0066cc !important;
}

html > body[data-color-scheme="dark"] main div.mobile-container a.btn-primary,
html > body[data-color-scheme="dark"] main table a.btn-primary {
	color: #fff !important;
}

html > body[data-color-scheme="dark"] main a img[src="/click/images/mcfly/14_chevron_2997ff_2x.png"],
html > body[data-color-scheme="dark"] main a img[src="/click/images/mcfly/17_chevron_2997ff_2x.png"] {
	filter: brightness(0.8) !important;
}

/* Safari line fix */
html > body > main#main > div.main-content tr,
html > body > main#main > div.main-content td,
html > body > main#main > div.main-content table {
	box-sizing: border-box !important;
	margin: 0 !important;
	overflow: hidden !important;
}

/* html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table > tbody > tr > td.col > table.col > tbody > tr > td > table > tbody > tr > td.col,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table > tbody > tr > td.col > table.col > tbody > tr > td > table > tbody > tr > td.col,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table > tbody > tr > td.col > table.col > tbody > tr > td > table > tbody > tr > td.col,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table > tbody > tr > td.col > table.col > tbody > tr > td > table > tbody > tr > td.col,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > div > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td > table > tbody > tr > td,
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > div.desktop-container > table > tbody > tr > td > table > tbody > tr.section > td.light > table > tbody > tr.row > td > table > tbody > tr > td.col > table.col > tbody > tr > td > table > tbody > tr > td.col,
html > body[data-color-scheme="dark"] > main > div > table > tbody > tr > td > table, */
html > body[data-color-scheme="dark"].hello-dev > main#main > div.main-content > table > tbody > tr > td > table.shared-footer.m-s039823.footer-dark {
	background-color: #fff !important;
}