* {box-sizing:border-box;line-height:1em;font-size:16px;}
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, sub, sup, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, main, nav, section, time, mark, audio, video {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;color:#1d1f20;}
article, aside, figure, footer, header, hgroup, nav, section, main {display:block;}
div, ul, li {position:relative;}
img, object, embed {max-width: 100%;}
html {overflow-y: scroll;}
body {-webkit-text-size-adjust:100%;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%;}
html, body {height:100%;}
h1, h2, h3, h4 {color:#194684;line-height:1.25em;font-weight:500;text-transform:capitalize;font-family:'Encode',sans-serif;}
ul li,ol li{list-style-position:outside;list-style-type:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:'';content:none;}
a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; outline:none; text-decoration: none;}
del {text-decoration:line-through;}
abbr[title], dfn[title] {border-bottom:1px dotted #1d1f20;cursor:help;}
table {border-collapse:collapse;border-spacing:0;}
th {font-weight:bold;vertical-align:bottom;}
td {font-weight:normal;vertical-align:top;}
hr {display:block;height:1px;border:0;border-top:1px solid #c9d0dd;margin:1em 0;padding:0;}
pre {white-space:pre;white-space:pre;word-wrap:break-word;}
table {font-size:inherit;font:100%;}
small {font-size:85%;}
strong {font-size:inherit;}
strong, th {font-weight:bold;}
td, td img {vertical-align:top;} 
sub, sup {font-size:75%;line-height:0;position:relative;}
sup {top:-0.5em;}
sub {bottom:-0.25em;}
pre, code, kbd, samp {font-family:monospace, sans-serif;} input, select {vertical-align:middle;}
select, input, textarea {-webkit-appearance:none;}
input, textarea, select, a {outline:none;}
input[type='radio'] {vertical-align:text-bottom;}
input[type='checkbox'] {vertical-align:bottom;vertical-align:baseline;-webkit-appearance:auto;}
.clickable, input[type=button], input[type=submit], button {cursor:pointer;}
button, input, select, textarea {margin:0;}
button {width:auto; overflow:visible;}
fieldset {border:0;margin:0;padding:0;}
textarea {resize:none;} @font-face {
font-family:'Muli';
src: url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/muli-300/muli-300.eot),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/muli-300/muli-300.woff2) format('woff2'),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/muli-300/muli-300.woff) format('woff'),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/muli-300/muli-300.ttf) format('truetype'),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/muli-300/muli-300.svg#Muli-Light) format('svg');
font-weight:300;
font-display:block;
}
@font-face {
font-family:'Muli';
src: url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/muli-700/muli-700.eot),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/muli-700/muli-700.woff2) format('woff2'),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/muli-700/muli-700.woff) format('woff'),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/muli-700/muli-700.ttf) format('truetype'),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/muli-700/muli-700.svg#Muli-Bold) format('svg');
font-weight:700;
font-display:block;
}
@font-face {
font-family:'Encode';
src: url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/encode-400/encode-400.eot),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/encode-400/encode-400.woff2) format('woff2'),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/encode-400/encode-400.woff) format('woff'),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/encode-400/encode-400.ttf) format('truetype'),
url(//aicodingeducator.com/wp-content/themes/aice-theme/static/fonts/encode-400/encode-400.svg#Quicksand-Medium) format('svg');
font-weight:500;
font-display:block;
} @media print {
* {background: transparent !important;color: #1d1f20 !important;box-shadow: none !important;text-shadow: none !important;}
a, a:visited {text-decoration: underline;}
pre, blockquote {border: 1px solid #999;page-break-inside: avoid;}
thead {display: table-header-group; }
tr, img {page-break-inside: avoid;}
img {max-width: 100% !important;}
@page {margin: 0.5cm;}
p, h2, h3 {orphans: 3;widows: 3;}
h2, h3 {page-break-after: avoid;}
footer, aside, .catbox, ul#social, menu-top-nav-container, #top form, .menu-icon, a.print {display:none !important;}
#top {position:relative !important;}
#top a, #top a:visited {text-decoration: none;}
.box {margin-bottom: 0 !important;padding-bottom:0 !important;}
#main-block {padding-top:1.875rem !important;}
#content {padding:1.875rem 0 !important;}
.text {margin-bottom: 0 !important;}
#main-title h1 {padding-top:0 !important;}
} html {scroll-behavior: smooth;}
body {font-family:'Muli', sans-serif;width:100%;font-weight:normal;position:relative;background:#194684;margin:0;padding:0;font-size: 1rem;}
.wrapper {max-width:46.125rem;margin:0 auto;}
.inside {padding:0 1.5rem;width:100%;}
#main-block {width:100%;clear:both; background:#dae0ea;}
#content {padding:1.5rem 0;overflow:hidden;}
.top-pad {padding-top: 1.5rem;}
#content *::selection {background-color:#dfe5ee;}
.desktop {display:block;}
.mobile {display:none;}
.video-wrapper {position:relative;padding-bottom:56.25%;padding-top:1.563rem;height:0;}
.video-wrapper iframe {position:absolute;top:0;left:0;width:100%;height:100%;}
img.social-logo {position:absolute;top:-120%;}
figure {overflow:hidden;margin:0 !important;}
.zero {margin:0 !important;}
.margin-top {margin-top: 1.5rem;} a {color:#526dbc;letter-spacing:0.03rem;}
a.active {color:#1d1f20;}
a:hover {color:#1d1f20;}
a:hover, a:active {outline:none;} #top {width:100%;height:3.75rem;background:#194684;padding:0;clear:both;position:fixed;z-index:99999;-webkit-transition: all 300ms ease-out;-o-transition: all 300ms ease-out;transition: all 300ms ease-out;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.top-buttons {height:3.75rem;width:100%;}
.top-buttons .inside {height: 3.75rem;display: flex;align-items: center;justify-content:space-between;}
a.logo {display:block;float:left;font-size:1.6rem;color:#fff;padding-bottom:0.125rem;padding-top:0.063rem;}
a.logo:hover {color:#fff;}
button.menu-icon {width:2.25rem;height:2.25rem;text-indent:-9999px;background: url(/wp-content/themes/aice-theme/static/images/switch.svg) no-repeat center center;line-height:1em;float:right;-webkit-transition: all 100ms ease-out;-o-transition: all 100ms ease-out;transition: all 100ms ease-out;transform:rotate(45deg);margin-left: auto;border:none;}
button.menu-icon.close-icon {transform:rotate(0deg);}
img.construction {margin-left:10px;}
button.page-icon {width:2.25rem;height:2.25rem;text-indent:-9999px;background: url(/wp-content/themes/aice-theme/static/images/switch-dark.svg) no-repeat center center;line-height:1em;float:right;-webkit-transition: all 100ms ease-out;-o-transition: all 100ms ease-out;transition: all 100ms ease-out;transform:rotate(45deg);margin-left: auto;border:none;}
button.page-icon.close-icon {transform:rotate(0deg);} nav {visibility:hidden;opacity:0;position:absolute;position:fixed;top:0;margin-top:3.75rem;padding-bottom:11.25rem;right:auto;height:100%;width:100%;overflow:hidden;overflow-y:auto;background:#234f8b;letter-spacing:0.1em;-webkit-transition: all 200ms ease-out;-moz-transition: all 200ms ease-out;-o-transition: all 200ms ease-out;transition: all 200ms ease-out;-webkit-overflow-scrolling:touch;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.mobile-nav-show {opacity:1;visibility:visible;}
nav ul {display:block;margin:0;padding:0;}
nav ul li {text-align:center;display:block;margin:0;}
nav ul li:has(ul) > a:before {content:'+ ';}
nav ul li a {font-size:2em;line-height:1em;display:block;text-decoration:none;background:#234f8b;color:#fff;padding:1rem 0 1.125rem;}
nav ul li a:hover {color:#fff;}
nav ul li ul li {padding-left:0;}
nav ul li ul li a {font-size:1.5em;background:#2f5993;padding:0.875rem 0 1rem 0;border-bottom: 1px solid #194684;}
nav ul li ul li ul li {padding-left:0;}
nav ul li ul li ul li a {font-size:1.25em;background:#3b649c;padding:0.75rem 0 0.938rem 0;border-bottom: 1px solid #194684;}
nav ul li ul li ul li ul li {padding-left:0;}
nav ul li ul li ul li ul li a {font-size:1.25em;background:#4970a5;padding:0.75rem 0 0.938rem 0;border-bottom: 1px solid #194684;} a.button {border:1px solid #526dbc;background:#526dbc;text-align:center;display:inline-block;color:#fff;height:auto;font-size:1em;text-transform:uppercase;padding:0.813rem 1.5rem 0.875rem 1.5rem;font-weight:700;letter-spacing:0.1em;line-height:1.5em;}
a.button:hover {background:#000;}
a.button.secondary {border:1px solid #526dbc;color:#526dbc;background:#fff;}
a.button:hover {background:#000;color:#fff;}
input[type=submit]#wp-submit, #password-reset-form input[type=submit], #register-custom input[type=submit], #pass-submit {text-transform:uppercase;width:100%;background:#526dbc;border: none;padding: 1rem 2rem;line-height: 1em;display: inline-block;height:100%;font-size: 1.125rem;font-weight: 300;color:white;font-family:'Muli', sans-serif;}
input[type=submit]#wp-submit:hover, #password-reset-form input[type=submit]:hover, #register-custom input[type=submit]:hover {background:#1d1f20;} #main-title {width:100%;display:flex;justify-content: center;background:#ffffff;border-bottom: 1px solid #c9d0dd;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
#main-title h1 {font-size:2.6em;line-height:1.125em;padding: 6.25rem 0 2.5rem 0;text-transform: capitalize;}
#main-title h1.home {font-size:3rem;padding-bottom:0.313rem;line-height:1em;}
#main-title h2 {font-size:1.4rem;padding-bottom: 2.5rem;color:#1d1f20;}
#grid {width: 100%;border-collapse: collapse;position:absolute;top:0;left:0;background:#ffffff;}
.cell {width: 1%;height: 1%;transition: background-color 0.3s;} .container {position:relative;opacity:0;}
.box {position:absolute;width:100%;padding:1.125rem;padding-bottom:1.25rem;margin-bottom:1.5rem;background:#fcfcfc;border:1px solid #c9d0dd;overflow:hidden;}
header h2 {font-size:1.5em;margin-bottom:1.25rem;}
header h2 a {line-height:1.125em;}
.text {width:100%;height:auto;overflow:hidden;}
.text p {font-weight: 300;font-size:1.125em;line-height:1.25em;margin-bottom:1.875rem;padding:0;}
.text p:last-child {margin:0;}
.text hr.wp-block-separator {border:none;height:1px;width:100%;background:#ccc;margin:0;margin:1.875rem 0;}
.text blockquote {border-left:3px solid #194684;;padding:0.7em 2em 0.8em 2em;margin-bottom: 1.875rem;overflow:hidden;}
.text blockquote p {padding:0;font-size:1.25em;}
.text blockquote cite {padding-top:1.125rem;float:right;}
.text img {width:100%;height:auto;padding-right:0;float:left;margin-bottom:1.563rem;}
.text h2 {font-size:2.2em;margin:3rem 0 1.563rem 0;}
.text h2.no-top-margin {margin-top:0;}
.text h3 {font-size:1.6em;margin:3rem 0 1.563rem 0;}
.text h3.no-top-margin {margin-top:0;}
.text ul, .text ol {padding:1.25rem 1.25rem 1.5rem 3.125rem;margin:0;margin-bottom:2.5rem;border: 1px solid #c9d0dd;background: #f8f9fa;}
.text ul.no-top-margin, .text ol.no-top-margin {margin-top:0;}
.text li {margin-bottom:1.5rem;font-size:1.25em;line-height:1.5em;list-style-type: disc;}
.text li::marker {color:#5a6f95;}
.text li:last-child {margin:0;}
.text a {line-height:1.5em;font-weight:400;text-decoration: underline;}
.text pre {background:#f8f9fa;padding:1rem 1.25rem;margin-bottom:2.5rem;border:1px solid #c9d0dd;overflow: auto;tab-size: 4;}
.text .pre-wrapper {position: relative;}
.text div.pre-wrapper:last-child pre {margin-bottom: 1rem;}
.text .pre-wrapper.left-gradient-visible::before {content: '';position: absolute;top: 0;left: -1px;height: 100%;width: 5rem;background: linear-gradient(to left, rgba(255,255,255,0) 10%, rgba(255,255,255,1) 98%);display: block;}
.text .pre-wrapper.right-gradient-visible::after {content: '';position: absolute;top: 0;right: -1px;height: 100%;width: 5rem;background: linear-gradient(to right, rgba(255,255,255,0) 10%, rgba(255,255,255,1) 98%);display: block;}
.text code {font-size:1.25rem;line-height:1.5em;}
img.featured {padding-bottom:1rem;width:100%;height:auto;}
.text table {border-collapse: collapse;width: 100%;margin-bottom: 1.875rem;border: 1px solid #c9d0dd;border-bottom: none;}
.text thead {background-color: #f8f9fa;}
.text th, .text td {text-align: left;padding: 1rem;border-bottom: 1px solid #c9d0dd;}
.byline {clear:both;padding-top:1.25rem;overflow:hidden;}
.byline-time {font-size:1.25em;line-height:1.8em;float:left;margin-right:1.875rem;color:#194684;}
.byline-author {font-size:1.25em;line-height:1.8em;float:left;color:#194684;}
#paginate {position:relative;left:0;font-size:1.5em;overflow:hidden;margin: 2rem 0 0.6rem 0;}
.older{float:left;}
.newer{float:right;}
.read-more {display:inline;}
#page-nav {padding:1rem 1.5rem;background:#fcfcfc;border: 1px solid #c9d0dd;display: flex;justify-content: space-between;margin-bottom: 1.5rem;}
ul.breadcrumbs {width:100%;overflow:hidden;padding:0.313rem 0;}
ul.breadcrumbs li {float:left;font-weight: 300;font-size:1.125em;line-height:1.375em;}
ul.subpages {margin:0;}
ul.subpages li {font-family: 'Encode',sans-serif;font-size: 1.5rem;}
.sitemap {width:100%;overflow:hidden;}
.sitemap h2 {font-size:2.2em;margin:3rem 0 1.563rem 0;}
.sitemap ul {margin:0;}
.sitemap li {font-weight: 300;font-size:20px;line-height:1.375em;}
.sitemap li a {display:block;margin-bottom:0.75rem;}
.sitemap li > ul {margin-left:1.625rem;}
.page-box {display:none;margin:1.5rem 0 1rem 0.438rem;}
.pagemap {width:100%; }
.pagemap ul {width:100%;margin-left: 1.5rem; }
.pagemap.visible {opacity: 1;margin-left: 0;}
.pagemap.visible ul { }
.pagemap li {font-weight: 300;font-size:20px;line-height:1.375em;}
.pagemap li a {display:block;margin-bottom:0.75rem;}
.pagemap li a.current-page {color:#000000;}
.page h2:first-of-type {margin-top: 0;}
#tooltip {position: absolute;display: inline-block;background-color: #526dbc;color:#fff;border: 1px solid #fcfcfc;padding: 5px 8px 7px 8px;z-index: 1000;}
#tooltip:hover {background:#000;} .box-single {width:100%;padding:1.5rem;background:#fcfcfc;border: 1px solid #c9d0dd;}
.box-single img.featured {margin-bottom:2.5rem;padding:0;}
.box-single .text p {line-height:1.8em;font-size:1.25em;}
.box-single .text p.highlight {font-size:1.5rem;color:#526dbc;}
#toc ul {background: #f8f9fa;padding:1rem;padding-left:2.5rem;}
#toc ul li {margin:0;font-size:1.125em;line-height:1em;list-style-type:circle;}
#toc ul ul {border: none;padding:0;padding-left:1.5rem;margin-bottom:0.5rem;}
#toc ul ul:last-child {margin:0;} .box-page {width:100%;padding:1.5rem;background:#fcfcfc;border:1px solid #c9d0dd;}
.box-page .text p {line-height:1.25em;font-size:1.25em;}
.box-page .text p.highlight {font-size:1.5rem;color:#526dbc;}
.box-page ul:last-child {margin-bottom:0;}
#user_login, #user_pass, #username_input, #email_input, #password_input, #confirm_password_input, #pass1, #pass2 {padding: 0.75rem 1rem;background: #fcfcfc;font-size: 1.125rem;font-weight: 300;line-height: 1.5em;color: #1d1f20;width: 100%;height: auto;border: 1px solid #526dbc;font-family: 'Muli', sans-serif;-webkit-border-radius: 0;border-radius: 0;}
#user_login::placeholder, #user_pass::placeholder, #username_input::placeholder, #email_input::placeholder, #password_input::placeholder, #confirm_password_input::placeholder, #pass1::placeholder, #pass2::placeholder {font-style: italic;color: #7b8cac;}
.login-username, .login-password, .login-remember, #password-reset-form #user_login, #username_input, #email_input, #password_input, #confirm_password_input, #pass1, #pass2 {margin-bottom:1.5rem;}
.login-remember {text-align:center;font-size: 1.125rem;}
.login-submit {margin-bottom:1.5rem;}
.form-box-links {display:flex;justify-content:space-between;font-size: 1.25rem;}
p.error {padding: 0.75rem 1rem;margin: 0;margin-bottom: 1.5rem;border: 1px solid #ddc9c9;background: #fef8f8;color:#730000;font-size: 1.125rem;font-weight: 400;line-height: 1.5em;}
p.complete {padding: 0.75rem 1rem;margin: 0;margin-bottom: 1.5rem;border: 1px solid #c9c9dd;background: #f8f8fe;color: #000573;font-size: 1.125rem;font-weight: 400;line-height: 1.5em;}
.account-links {font-size: 1.25rem;}
.lessons {display:flex;align-items: center; justify-content: space-between;}
.lessons a {font-weight: 700;}
.related-articles { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid #c9d0dd; }
.related-articles p { margin: 0 0 1rem; font-size: 1.6em;color: #194684;}
.related-articles ul { margin: 0; padding-left: 1.375rem; }
.related-articles li { margin-bottom: 1rem; list-style-type: disc;font-size: 1.125em;line-height: 1.375em;}
.related-articles li:last-child { margin-bottom: 0.5rem; } #gptBox {margin-top:1.5rem;padding:1.5rem;background: #fcfcfc;border: 1px solid #c9d0dd;}
h2.gptBoxHeading {font-size:2.2em;margin-bottom:1.5rem;}
#gptBox #gptInput {background:#fcfcfc;}
#gptOutput {width: 100%;font-size: 1.25em;}
#gptOutput * {line-height: 1.8em;}
#gptOutput div *:last-child {margin-bottom: 0.375rem;}
#gptOutput div {background: #f8f9fa;padding: 1rem 1.25rem;border: 1px solid #c9d0dd;margin-bottom:1.5rem;}
#gptOutput div.demo {background: #f8f9fa;border: 1px solid #e5ebf5;}
#gptOutput div p {margin-bottom:1.875rem;}
#gptOutput div ul, #gptOutput div ol {margin-bottom:1.875rem;padding-left: 1.5rem;}
#gptOutput div li {list-style-type:disc;}
#gptOutput div pre {margin-bottom:1.875rem;background: #eef2f5;padding: 1rem 1.25rem;border: 1px solid #c9d0dd;overflow: auto;tab-size: 4;}
#inputWrapper {display: grid;grid-template-columns: 10fr auto;}
#gptInput {padding: 0.75rem 1rem;background: #f8f9fa;font-size: 1.125rem;font-weight: 300;line-height: 1.5em;color: #1d1f20;height: auto;border: 1px solid #526dbc;font-family:'Muli', sans-serif;-webkit-border-radius:0;border-radius:0;}
#gptInput::placeholder {color: #7b8cac;font-style: italic;height: 100%;}
#gptSubmit {text-transform:uppercase;background: #526dbc;border: none;padding: 0 1rem 0.125rem 1rem;line-height: 0;display: inline-block;height: 100%;font-size: 1rem;font-weight: 700;font-size: 1.125em;color:white;font-family:'Muli', sans-serif;}
#gptSubmit:hover {background:#1d1f20;} #buttonBox {position:relative;top:1px;z-index:2;}
.codeButton {text-transform:uppercase;color:#526dbc;background:#fcfcfc;border: 1px solid #c9d0dd;border-bottom:0;padding:0.625rem 1rem 0rem 1rem;font-family:'Muli', sans-serif;font-weight:700;}
#buttons {float:right;width:auto;column-count: 1;clear: none;padding: 6px 0 1rem 0;}
.codeButtonPage {text-transform:uppercase;border:none;color:#fff;background: #526dbc;padding:0.5rem 1rem 0.625rem 1rem;font-family:'Muli', sans-serif;margin-left:0.5rem;width:auto;float:none;font-weight:700;}
.codeButtonPage:hover {background:#1d1f20;}
#codeBox {width: 100%;padding: 1.5rem;background:#fcfcfc;border: 1px solid #c9d0dd;}
#codeBox.codeBoxSingle {margin-top:1.5rem;padding: 1.5rem;}
h2.codeBoxHeading {font-size:2.2em;margin-bottom:1.5rem;padding-right:24px;float:left;}
#htmlInput, #cssInput {width:100%;height:auto;min-height:3.625rem;background:#f8f9fa;padding: 0.75rem 1rem 0.875rem 1rem;margin-bottom:1rem;border: 1px solid #c9d0dd;font-size: 1.25rem;line-height: 1.5em;font-family: monospace, sans-serif;resize: none;overflow: hidden;}
#htmlInput::placeholder, #cssInput::placeholder {color: #7b8cac;font-family:'Muli', sans-serif;font-size: 1.25rem;font-style:italic;}
#codeOutput {width:100%;background:#f8f9fa;border:1px solid #c9d0dd;overflow:hidden;min-height:3.625rem;padding: 1rem;box-sizing:content-box;width: calc(100% - 2.125rem);} .aice-demo {width:100%;margin-top:1.5rem;padding:1.5rem;background:#fcfcfc;border:1px solid #c9d0dd;}
.aice-demo__header {display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.5rem;}
.aice-demo__title {margin:0;font-size:2.2rem;}
.aice-demo__controls {display:flex;flex-wrap:wrap;justify-content:flex-end;gap:0.5rem;}
.aice-demo__controls .codeButtonPage {float:none;width:auto;margin:0;}
.aice-demo__controls .codeButtonPage[aria-pressed="true"] {background:#194684;}
.aice-demo__stage {display:flex;width:100%;min-height:11rem;padding:1.5rem;overflow:hidden;background:#f8f9fa;border:1px solid #c9d0dd;}
.aice-demo__example {display:flex;flex:1;width:100%;}
.aice-demo__row {display:flex;flex-wrap:wrap;align-items:flex-start;gap:0.75rem;}
.aice-demo__stack {display:grid;gap:0.75rem;}
.aice-demo__center {display:grid;place-items:center;}
.aice-demo__box {padding:1.5rem;background:#fcfcfc;border:1px solid #c9d0dd;}
.aice-demo__example > .aice-demo__box {display:flex;align-items:center;justify-content:center;flex:1;width:100%;}
.aice-demo__box--accent {background:#eaf1fe;border-color:#526dbc;}
.aice-demo__text {margin:0;font-size:1.5rem;line-height:1.25em;text-align:center;}
.aice-demo__label {display:inline-block;font-weight:700;}
.aice-demo__is-hidden {display:none !important;}
.border-demo__box {border:2px solid #526dbc;border-radius:0;}
.border-demo__box--wide {border-width:5px;}
.border-demo__box--dashed {border-style:dashed;}
.border-demo__box--rounded {border-radius:2rem;}
.html-demo__content {flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:1.5rem;}
.html-demo__item {display:none;margin:0;text-align:center;}
.html-demo__item--visible {display:block;}
.html-demo__heading {font-size:2.75rem;}
.html-demo__paragraph {font-size:1.5rem;line-height:1.5em;}
.html-demo__button {padding:1rem 2rem;background:#526dbc;border:2px solid #194684;color:#fff;font-size:1.5rem;font-weight:700;}
.block-demo__content {align-items:stretch;}
.block-demo__panel {display:none;width:100%;min-height:11rem;}
.block-demo__content.show-block .block-demo__block {display:flex;}
.block-demo__content.show-inline .block-demo__inline {display:flex;}
.block-demo__block {flex-direction:column;justify-content:center;gap:0.75rem;}
.block-demo__block div {width:100%;padding:1rem;background:#eaf1fe;border:2px solid #526dbc;font-size:1.25rem;text-align:center;}
.block-demo__inline {align-items:center;justify-content:center;background:#fcfcfc;border:2px solid #c9d0dd;}
.block-demo__inline-row {font-size:0;text-align:center;}
.block-demo__inline span {display:inline;padding:0 0.75rem;background:#eaf1fe;border:2px solid #526dbc;font-size:1.25rem;line-height:2.75em;}
.boxes-demo__outer {display:flex;flex:1;flex-direction:column;justify-content:center;gap:1rem;width:100%;min-height:11rem;padding:1.5rem;background:transparent;border:3px solid transparent;}
.boxes-demo__outer.show-outer {background:#dfe5ee;border-color:#194684;}
.boxes-demo__inner {width:100%;padding:1rem;background:transparent;border:2px solid transparent;font-size:1.25rem;line-height:1.25em;text-align:center;}
.boxes-demo__inner.show-inner {background:#fcfcfc;border-color:#526dbc;}
.heading-demo__content {flex-direction:column;justify-content:center;gap:0.75rem;}
.heading-demo__content h2,.heading-demo__content h3,.heading-demo__content h4 {margin:0;text-align:left;}
.heading-demo__content.show-hierarchy h2 {font-size:2.75rem;}
.heading-demo__content.show-hierarchy h3 {font-size:2rem;}
.heading-demo__content.show-hierarchy h4 {font-size:1.4rem;}
.heading-demo__content.show-flat h2,.heading-demo__content.show-flat h3,.heading-demo__content.show-flat h4 {font-size:1.75rem;}
.paragraph-demo__content {align-items:center;justify-content:center;}
.paragraph-demo__inline,.paragraph-demo__paragraphs {display:none;width:100%;max-width:38rem;}
.paragraph-demo__content--inline .paragraph-demo__inline {display:block;}
.paragraph-demo__content--paragraphs .paragraph-demo__paragraphs {display:block;}
.paragraph-demo__inline {font-size:1rem;line-height:1.2em;}
.paragraph-demo__inline span {display:inline;margin:0;padding:0;}
.paragraph-demo__paragraphs {font-family:Georgia,serif;font-size:1.35rem;line-height:1.6em;}
.paragraph-demo__paragraphs p {margin:0;}
.paragraph-demo__paragraphs p:not(:last-child) {margin-bottom:1.5rem;}
.list-demo__content {align-items:center;justify-content:center;padding:1.5rem;}
.list-demo__unordered,.list-demo__ordered {display:none;width:100%;max-width:28rem;margin:0;padding-left:2.5rem;font-size:1.5rem;line-height:1.8em;}
.list-demo__content--unordered .list-demo__unordered {display:block;}
.list-demo__content--ordered .list-demo__ordered {display:block;}
.list-demo__unordered li {list-style-position:outside;list-style-type:disc;}
.list-demo__ordered li {list-style-position:outside;list-style-type:decimal;}
.list-demo__unordered li,.list-demo__ordered li {padding:0.5rem 0 0.5rem 0.5rem;}
.list-demo__unordered li::marker,.list-demo__ordered li::marker {color:#194684;font-size:1em;font-weight:700;}
.table-demo__content {align-items:center;}
.table-demo__table {width:100%;border-collapse:collapse;background:#fcfcfc;font-size:1.125rem;text-align:center;}
.table-demo__table th,.table-demo__table td {padding:1rem 0.5rem;border:2px solid #526dbc;}
.table-demo__table th {font-weight:700;}
.table-demo__content.show-header thead th {background:#194684;color:#fff;}
.table-demo__content.show-row tbody tr:nth-child(2) td {background:#194684;color:#fff;font-weight:700;}
.table-demo__content.show-column tr > *:nth-child(2) {background:#194684;color:#fff;font-weight:700;}
.inline-demo__content {align-items:center;justify-content:center;padding:1.5rem;background:#fcfcfc;border:2px solid #c9d0dd;}
.inline-demo__content p {width:100%;margin:0;font-size:1.5rem;line-height:2.25em;text-align:center;}
.inline-demo__content span {padding:0.25rem 0.5rem;background:#eaf1fe;border:2px solid #526dbc;font-weight:700;}
.inline-demo__content.show-inline span {display:inline;}
.inline-demo__content.show-block span {display:block;width:100%;margin:0.75rem 0;line-height:1.5em;}
.link-demo__content {align-items:stretch;}
.link-demo__panel {display:none;align-items:center;justify-content:center;width:100%;text-align:center;}
.link-demo__content.show-text .link-demo__text {display:flex;}
.link-demo__content.show-button .link-demo__button {display:flex;}
.link-demo__content.show-card .link-demo__card {display:flex;}
.link-demo__text p {margin:0;font-size:1.5rem;line-height:1.5em;}
.link-demo__text a {color:#194684;font-weight:700;text-decoration:underline;}
.link-demo__text a:hover {color:#000000;}
.link-demo__button a {display:inline-block;padding:1rem 1.5rem;background:#194684;border:none;color:#fff;font-size:1.25rem;font-weight:700;text-decoration:none;}
.link-demo__button a:hover {background:#000000;}
.link-demo__card a {display:block;width:100%;max-width:26rem;padding:1.5rem;background:#fcfcfc;border:3px solid #194684;color:#194684;text-decoration:none;}
.link-demo__card strong,.link-demo__card span {display:block;}
.link-demo__card strong {margin-bottom:0.5rem;font-size:1.5rem;}
.link-demo__card span {font-size:1.125rem;line-height:1.4em;}
.format-demo__content {align-items:stretch;}
.format-demo__panel {display:none;align-items:center;justify-content:center;width:100%;text-align:center;}
.format-demo__content.show-bold .format-demo__bold {display:flex;}
.format-demo__content.show-italic .format-demo__italic {display:flex;}
.format-demo__content.show-mark .format-demo__mark {display:flex;}
.format-demo__content.show-script .format-demo__script {display:flex;}
.format-demo__panel p {margin:0;font-size:1.75rem;line-height:1.5em;}
.format-demo__bold strong {font-weight:800;}
.format-demo__italic em {font-style:italic;}
.format-demo__mark mark {padding:0.2rem 0.4rem;background:#ffe36e;color:#000;}
.format-demo__script sub,.format-demo__script sup {font-size:0.7em;font-weight:700;}
.input-demo__content {align-items:stretch;}
.input-demo__content input {-webkit-appearance: auto;}
.input-demo__panel {display:none;align-items:center;justify-content:center;width:100%;}
.input-demo__content.show-text .input-demo__text {display:flex;}
.input-demo__content.show-checkbox .input-demo__checkbox {display:flex;}
.input-demo__content.show-radio .input-demo__radio {display:flex;}
.input-demo__content.show-button .input-demo__button {display:flex;}
.input-demo__text {flex-direction:column;gap:0.75rem;}
.input-demo__text label {font-size:1.25rem;font-weight:700;}
.input-demo__text input {width:100%;max-width:24rem;padding:1rem;background:#fff;border:3px solid #194684;font-size:1.25rem;}
.input-demo__checkbox label,.input-demo__radio label {display:flex;align-items:center;gap:0.75rem;font-size:1.5rem;font-weight:700;}
.input-demo__checkbox input,.input-demo__radio input {width:2rem;height:2rem;accent-color:#194684;}
.input-demo__radio {gap:2rem;}
.input-demo__button button {padding:1rem 2rem;background:#194684;border:none;color:#fff;font-size:1.5rem;font-weight:700;}
.input-demo__button button:hover {background:#000000;}
.css-demo__content {align-items:center;justify-content:center;}
.css-demo__card {width:100%;max-width:28rem;}
.css-demo__card h3,.css-demo__card p {margin-top:0;}
.css-demo__card p {line-height:1.5em;}
.css-demo__content.show-plain .css-demo__card {padding:0;background:transparent;border:0;border-radius:0;color:#222;text-align:left;}
.css-demo__content.show-plain .css-demo__card h3 {margin-bottom:0.75rem;font-size:1.75rem;color:#222;}
.css-demo__content.show-plain .css-demo__card p {margin-bottom:0.75rem;font-size:1rem;}
.css-demo__content.show-plain .css-demo__card a {color:#0000ee;font-size:1rem;text-decoration:underline;}
.css-demo__content.show-styled .css-demo__card {padding:2rem;background:#eaf1fe;border:4px solid #194684;border-radius:1.5rem;color:#194684;text-align:center;}
.css-demo__content.show-styled .css-demo__card h3 {margin-bottom:1rem;font-size:2.25rem;color:#194684;}
.css-demo__content.show-styled .css-demo__card p {margin-bottom:1.5rem;font-size:1.25rem;}
.css-demo__content.show-styled .css-demo__card a {display:inline-block;padding:0.75rem 1.25rem;background:#194684;color:#fff;font-size:1.125rem;font-weight:700;text-decoration:none;}
.selector-demo__content {align-items:center;justify-content:center;padding:1.5rem;}
.selector-demo__page {display:flex;flex-direction:column;gap:0.75rem;width:100%;max-width:38rem;}
.selector-demo__page h3,.selector-demo__page h4,.selector-demo__page p {margin:0;}
.selector-demo__page h3 {font-size:2rem;}
.selector-demo__page h4 {font-size:1.35rem;}
.selector-demo__page p {padding:0.75rem;font-size:1.125rem;line-height:1.4em;}
.selector-demo__page #signup {align-self:flex-start;padding:0.75rem 1.25rem;background:#526dbc;border:3px solid #526dbc;color:#fff;font-size:1.125rem;font-weight:700;}
.selector-demo__card {padding:1rem;background:#f1f3f6;border:2px solid #c9d0dd;}
.selector-demo__page--element p {background:#194684;color:#fff;outline:4px solid #8fb4f4;}
.selector-demo__page--class .important {background:#194684;color:#fff;outline:4px solid #8fb4f4;}
.selector-demo__page--id #signup {background:#194684;border-color:#8fb4f4;outline:4px solid #8fb4f4;}
.selector-demo__page--descendant .selector-demo__card p {background:#194684;color:#fff;outline:4px solid #8fb4f4;}
.box-model-demo__example {align-items:stretch;}
.box-model-demo__margin {position:relative;display:flex;flex:1;width:100%;min-height:11rem;padding:1.5rem;background:#e7e9ee;}
.box-model-demo__border {position:relative;display:flex;flex:1;padding:0.5rem;background:#526dbc;}
.box-model-demo__padding {position:relative;display:flex;flex:1;padding:2rem;background:#d8e2f5;}
.box-model-demo__content-box {display:flex;align-items:center;justify-content:center;flex:1;min-height:4rem;background:#fcfcfc;border:2px solid #8b93a1;font-size:1.5rem;font-weight:700;text-align:center;}
.box-model-demo__label {position:absolute;padding:0.2rem 0.4rem;background:#fff;border:1px solid #8b93a1;font-size:0.8rem;font-weight:700;line-height:1.2em;}
.box-model-demo__margin-label {top:0.25rem;left:0.25rem;}
.box-model-demo__border-label {top:0.25rem;left:0.25rem;}
.box-model-demo__padding-label {top:0.25rem;left:0.25rem;}
.box-model-demo__example.show-content .box-model-demo__content-box {background:#194684;border-color:#194684;color:#fff;}
.box-model-demo__example.show-padding .box-model-demo__padding {background:#8fb4f4;}
.box-model-demo__example.show-border .box-model-demo__border {background:#194684;}
.box-model-demo__example.show-margin .box-model-demo__margin {background:#8fb4f4;}
.size-demo__content {align-items:center;justify-content:center;}
.size-demo__box {display:flex;align-items:center;justify-content:center;width:45%;height:5rem;padding:1rem;background:#eaf1fe;border:3px solid #526dbc;transition:width 0.3s ease,height 0.3s ease;}
.size-demo__box--wide {width:100%;}
.size-demo__box--tall {height:11rem;}
.margin-demo__content {flex-direction:column;justify-content:center;background:#dfe5ee;border:2px solid #8b93a1;}
.margin-demo__box,.margin-demo__middle {display:flex;align-items:center;justify-content:center;width:100%;min-height:3rem;padding:0.75rem;background:#fcfcfc;border:2px solid #526dbc;font-size:1.125rem;font-weight:700;text-align:center;}
.margin-demo__middle {background:#eaf1fe;border:3px solid #194684;}
.margin-demo__middle--spaced {margin:2rem 0;}
.padding-demo__content {align-items:stretch;}
.padding-demo__box {display:flex;align-items:stretch;justify-content:stretch;flex:1;width:100%;min-height:11rem;padding:0.5rem;background:#8fb4f4;border:3px solid #194684;transition:padding 0.3s ease;}
.padding-demo__box--spaced {padding:3rem;}
.padding-demo__inner {display:flex;align-items:center;justify-content:center;flex:1;background:#fcfcfc;border:2px solid #526dbc;font-size:1.5rem;font-weight:700;text-align:center;}
.position-demo__content {position:relative;align-items:flex-start;gap:1rem;padding:1.5rem;background:#dfe5ee;border:2px solid #8b93a1;}
.position-demo__box {display:flex;align-items:center;justify-content:center;flex:1;min-height:5rem;padding:1rem;background:#fcfcfc;border:2px solid #526dbc;font-size:1.25rem;font-weight:700;text-align:center;}
.position-demo__target {background:#eaf1fe;border:3px solid #194684;}
.position-demo__content.show-static .position-demo__target {position:static;}
.position-demo__content.show-relative .position-demo__target {position:relative;top:3rem;left:2rem;z-index:1;}
.position-demo__content.show-absolute .position-demo__target {position:absolute;right:1.5rem;bottom:1.5rem;width:30%;}
.layout-demo__content {display:grid;gap:0.75rem;width:100%;min-height:11rem;}
.layout-demo__box {display:flex;align-items:center;justify-content:center;min-width:0;padding:1rem;background:#eaf1fe;border:3px solid #526dbc;font-size:1.25rem;font-weight:700;text-align:center;}
.layout-demo__content--stack {grid-template-columns:1fr;}
.layout-demo__content--columns {grid-template-columns:repeat(2,1fr);}
.layout-demo__content--row {grid-template-columns:repeat(4,1fr);}
.display-demo__content {align-items:stretch;}
.display-demo__canvas {width:100%;min-height:11rem;padding:1.5rem;background:#fcfcfc;border:2px solid #c9d0dd;text-align:center;}
.display-demo__item {padding:0.75rem;background:#eaf1fe;border:3px solid #526dbc;font-size:1.125rem;font-weight:700;text-align:center;}
.display-demo__content--block .display-demo__item {display:block;width:100%;margin-bottom:0.75rem;}
.display-demo__content--inline .display-demo__item {display:inline;width:8rem;height:4rem;margin:0;}
.display-demo__content--inline-block .display-demo__item {display:inline-block;width:7rem;height:4rem;margin:0.5rem;vertical-align:middle;}
.display-demo__content--none .display-demo__item {display:inline-block;width:7rem;height:4rem;margin:0.5rem;vertical-align:middle;}
.display-demo__content--none .display-demo__hidden-item {display:none;}
.flex-demo__content {display:flex;align-items:stretch;width:100%;min-height:11rem;padding:1rem;background:#dfe5ee;border:2px solid #8b93a1;}
.flex-demo__item {display:flex;align-items:center;justify-content:center;width:5rem;min-height:3rem;padding:1rem;background:#eaf1fe;border:3px solid #526dbc;font-size:1.5rem;font-weight:700;text-align:center;}
.flex-demo__content--row {flex-direction:row;}
.flex-demo__content--column {flex-direction:column;}
.flex-demo__content--column .flex-demo__item {width:100%;}
.flex-demo__content--gap {gap:1.25rem;}
.flex-demo__content--spread {justify-content:space-between;}
.grid-demo__content {display:grid;width:100%;min-height:11rem;background:#dfe5ee;border:2px solid #8b93a1;}
.grid-demo__item {display:flex;align-items:center;justify-content:center;min-width:0;padding:1rem;background:#eaf1fe;border:3px solid #526dbc;font-size:1.5rem;font-weight:700;text-align:center;}
.grid-demo__content--two {grid-template-columns:repeat(2,1fr);}
.grid-demo__content--three {grid-template-columns:repeat(3,1fr);}
.grid-demo__content--gap {gap:1.25rem;padding:1rem;}
.grid-demo__content--span .grid-demo__item:first-child {grid-column:span 2;background:#194684;color:#fff;}
.float-demo__content {align-items:stretch;}
.float-demo__canvas {width:100%;min-height:11rem;padding:1.5rem;overflow:auto;background:#fcfcfc;border:2px solid #c9d0dd;}
.float-demo__box {display:flex;align-items:center;justify-content:center;width:7rem;height:7rem;background:#eaf1fe;border:3px solid #526dbc;font-size:1.25rem;font-weight:700;text-align:center;}
.float-demo__canvas p {margin:0;font-size:1.125rem;line-height:1.6em;}
.float-demo__content--none .float-demo__box {float:none;margin:0 auto 1rem;}
.float-demo__content--left .float-demo__box {float:left;margin:0 1.25rem 0.75rem 0;}
.float-demo__content--right .float-demo__box {float:right;margin:0 0 0.75rem 1.25rem;}
.clear-demo__content {align-items:stretch;}
.clear-demo__canvas {width:100%;min-height:11rem;padding:1.5rem;overflow:auto;background:#fcfcfc;border:2px solid #c9d0dd;}
.clear-demo__float {display:flex;align-items:center;justify-content:center;float:left;width:8rem;height:8rem;margin:0 1rem 0.75rem 0;background:#eaf1fe;border:3px solid #526dbc;font-size:1.25rem;font-weight:700;text-align:center;}
.clear-demo__canvas p {margin:0 0 0.75rem;font-size:1.125rem;line-height:1.5em;}
.clear-demo__next {padding:1rem;background:#194684;border:3px solid #194684;color:#fff;font-size:1.25rem;font-weight:700;text-align:center;}
.clear-demo__content--uncleared .clear-demo__next {clear:none;}
.clear-demo__content--cleared .clear-demo__next {clear:both;}
.typography-demo__content {align-items:center;justify-content:center;padding:1.5rem;background:#eaf1fe;border:2px solid #526dbc;}
.typography-demo__text {width:100%;margin:0;font-family:Georgia,serif;font-size:1rem;font-weight:400;line-height:1.2em;text-align:left;transition:font-size 0.3s ease,line-height 0.3s ease;}
.typography-demo__text--font {font-family:Arial,Helvetica,sans-serif;}
.typography-demo__text--large {font-size:1.75rem;}
.typography-demo__text--bold {font-weight:800;}
.typography-demo__text--spaced {line-height:2em;}
.typography-demo__text--centered {text-align:center;}
.background-demo__content {align-items:center;justify-content:center;width:100%;min-height:11rem;padding:1.5rem;background-position:center;background-size:cover;border:3px solid #194684;}
.background-demo__label {padding:1rem 1.5rem;background:#fcfcfc;border:3px solid #194684;color:#194684;font-size:1.5rem;font-weight:700;text-align:center;}
.background-demo__content--color {background-color:#8fb4f4;background-image:none;}
.background-demo__content--image {background-color:#194684;background-image:linear-gradient(rgba(25,70,132,0.2),rgba(25,70,132,0.2)),url(https://aicodingeducator.com/cat.jpg);}
.background-demo__content--gradient {background-color:#8fb4f4;background-image:linear-gradient(135deg,#194684,#8fb4f4,#eaf1fe);}
.color-demo__content {align-items:stretch;}
.color-demo__card {display:flex;align-items:center;justify-content:center;flex:1;flex-direction:column;width:100%;min-height:11rem;padding:1.5rem;border:3px solid #194684;text-align:center;}
.color-demo__card h3 {margin:0 0 0.75rem;font-size:2rem;}
.color-demo__card p {margin:0;font-size:1.25rem;line-height:1.4em;}
.color-demo__content--text .color-demo__card {background:#fcfcfc;color:#194684;}
.color-demo__content--background .color-demo__card {background:#ffe36e;color:#222;}
.color-demo__content--contrast .color-demo__card {background:#194684;color:#fff;}
.presence-demo__content {align-items:center;justify-content:center;gap:1rem;padding:1.5rem;background:#dfe5ee;border:2px solid #8b93a1;}
.presence-demo__item {display:flex;align-items:center;justify-content:center;flex:1;min-height:6rem;padding:0.75rem;background:#fcfcfc;border:3px solid #526dbc;font-size:1.125rem;font-weight:700;text-align:center;transition:opacity 0.3s ease;}
.presence-demo__target {background:#eaf1fe;border-color:#194684;color:#194684;}
.presence-demo__content--visible .presence-demo__target {opacity:1;visibility:visible;}
.presence-demo__content--opacity .presence-demo__target {opacity:0.2;}
.presence-demo__content--visibility .presence-demo__target {visibility:hidden;}
.presence-demo__content--display .presence-demo__target {display:none;}
.presence-demo__content--stack .presence-demo__target {position:relative;left:2.5rem;z-index:2;background:#194684;color:#fff;}
.presence-demo__content--stack .presence-demo__last {position:relative;left:-2.5rem;z-index:1;}
.events-demo__content {align-items:center;justify-content:center;background:#eaf1fe;border:2px solid #526dbc;}
.events-demo__target {min-width:14rem;padding:1.25rem 2rem;background:#fcfcfc;border:4px solid #526dbc;border-radius:0;color:#194684;font-size:1.5rem;font-weight:700;text-align:center;}
.events-demo__target--normal {background:#fcfcfc;border-color:#526dbc;color:#194684;transform:none;}
.events-demo__target--hover {background:#194684;border-color:#194684;color:#fff;transform:translateY(-0.5rem);}
.events-demo__target--focus {background:#fcfcfc;border-color:#194684;color:#194684;outline:0.4rem solid #8fb4f4;outline-offset:0.35rem;}
.events-demo__target--active {background:#102f5c;border-color:#102f5c;color:#fff;transform:scale(0.88);}
.hover-demo__content {align-items:center;justify-content:center;background:#eaf1fe;border:2px solid #526dbc;}
.hover-demo__target {display:flex;align-items:center;justify-content:center;width:70%;min-height:7rem;padding:1.5rem;background:#fcfcfc;border:4px solid #526dbc;border-radius:0;color:#194684;font-size:1.5rem;font-weight:700;text-align:center;}
.hover-demo__target:hover,.hover-demo__target--active {width:100%;min-height:11rem;background:#194684;border-color:#194684;border-radius:2rem;color:#fff;font-size:2rem;}
.hover-trigger-demo__content {align-items:stretch;}
.hover-trigger-demo__card {display:flex;align-items:center;justify-content:center;flex:1;flex-direction:column;gap:1rem;width:100%;min-height:11rem;padding:1.5rem;background:#eaf1fe;border:4px solid #526dbc;}
.hover-trigger-demo__parent {font-size:2rem;font-weight:700;color:#194684;text-align:center;}
.hover-trigger-demo__child {visibility:hidden;width:80%;padding:1rem;background:#194684;border:3px solid #194684;color:#fff;font-size:1.5rem;font-weight:700;text-align:center;opacity:0;}
.hover-trigger-demo__card:hover .hover-trigger-demo__child,.hover-trigger-demo__card--active .hover-trigger-demo__child {visibility:visible;opacity:1;}
.hover-trigger-demo__card:hover,.hover-trigger-demo__card--active {background:#8fb4f4;border-color:#194684;}
.transition-demo__content {align-items:stretch;}
.transition-demo__track {display:flex;align-items:center;width:100%;min-height:11rem;padding:1rem;background:#dfe5ee;border:2px solid #8b93a1;}
.transition-demo__box {display:flex;align-items:center;justify-content:center;width:6rem;height:6rem;background:#194684;border:3px solid #194684;border-radius:0;color:#fff;font-size:1.25rem;font-weight:700;text-align:center;transform:translateX(0);}
.transition-demo__track--instant .transition-demo__box {transition:none;}
.transition-demo__track--smooth .transition-demo__box {transition:transform 1.2s ease,background 1.2s ease,border-radius 1.2s ease;}
.transition-demo__track--moved .transition-demo__box {background:#526dbc;border-radius:50%;transform:translateX(20rem);}
.breakpoint-demo__content {align-items:center;justify-content:center;background:#dfe5ee;border:2px solid #8b93a1;}
.breakpoint-demo__viewport {display:flex;flex-direction:column;gap:0.75rem;min-height:10rem;padding:0.75rem;background:#fcfcfc;border:4px solid #194684;transition:width 0.4s ease;}
.breakpoint-demo__bar {padding:0.75rem;background:#194684;color:#fff;font-size:1.125rem;font-weight:700;text-align:center;}
.breakpoint-demo__grid {display:grid;flex:1;gap:0.75rem;}
.breakpoint-demo__grid div {display:flex;align-items:center;justify-content:center;min-height:3rem;padding:0.75rem;background:#eaf1fe;border:2px solid #526dbc;font-size:1.125rem;font-weight:700;}
.breakpoint-demo__viewport--phone {width:35%;}
.breakpoint-demo__viewport--phone .breakpoint-demo__grid {grid-template-columns:1fr;}
.breakpoint-demo__viewport--tablet {width:65%;}
.breakpoint-demo__viewport--tablet .breakpoint-demo__grid {grid-template-columns:repeat(2,1fr);}
.breakpoint-demo__viewport--desktop {width:100%;}
.breakpoint-demo__viewport--desktop .breakpoint-demo__grid {grid-template-columns:repeat(3,1fr);} .search .search-grid {display:grid;grid-template-columns: 10fr auto;}
.search input {flex-grow: 1;padding: 0.75rem 1rem;background: #f8f9fa;font-size: 1.125rem;font-weight: 300;line-height: 1.5em;color:#1d1f20;height: auto;border: 1px solid #c9d0dd;font-family:'Muli', sans-serif;-webkit-border-radius:0;border-radius:0;}
.search input, .search input[type="search"] {border-radius:0;-webkit-appearance:none;}
.search input::placeholder {color: #7b8cac;font-style: italic;height: 100%;}
.search input:focus-visible {outline-color: #808080;outline-offset: -3px;}
.search button {text-transform:uppercase;background:#526dbc;border: none;padding: 0 1rem;line-height: 0;display: inline-block;height:100%;font-size: 1.125rem;font-weight: 300;color:white;font-family:'Muli', sans-serif;font-weight:700;}
.search button:hover {background:#1d1f20;}
.search button img {filter: invert(100%);width:1.125rem;max-width: none;} footer {background:#194684;padding:2.5rem 0 3rem 0;clear:both;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-align:center;}
footer a {color:#fff;text-decoration:underline;}
footer a:hover {color:#fff;text-decoration:none;}
footer p {color:#fff;} .ace-hero { position: relative; padding-top: 3.75rem; overflow: hidden; background: #ffffff; border-bottom: 1px solid #c9d4e3; }
.ace-hero-animation { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.ace-hero-inner { position: relative; z-index: 1; padding: 5rem 1.5rem 5.5rem 1.5rem; max-width: 75rem; margin: 0 auto; }
.ace-hero-kicker { margin: 0 0 1.625rem; color: #788dab; font-size: 0.8125rem; font-weight: 800; line-height: 1.2; letter-spacing: 0.11em; text-transform: uppercase; }
.ace-hero h1 { margin: 0 0 1.5rem; color: #1f4f8d; font-size: 3rem; font-weight: 400; line-height: 1.125; letter-spacing: -0.055em; }
.ace-hero-lead { margin: 0 0 1.875rem; color: #526dbc; font-size: 1.25rem; font-weight: 700; line-height: 1.55; }
.ace-hero-support { margin: 0 0 2.5rem; color: #333; font-size: 1.125rem; line-height: 1.55; }
.ace-hero-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin: 0 0 1.5rem; }
.ace-hero-links { display: flex; flex-wrap: wrap; align-items: center; gap: 0.625rem; color: #6b7b95; font-size: 0.9375rem; font-weight: 800; }
.ace-hero-links a { color: #526bbd;text-decoration:underline;}
.ace-hero-links a:hover { text-decoration: underline; }
.ace-intro { background: #f2f6fb; border-bottom: 0.0625rem solid #c9d4e3; }
.ace-intro-inner { display: flex; gap: 2.25rem;margin: 0 auto; padding: 4rem 1.5rem; max-width: 75rem;}
.ace-intro h2 { margin: 0 0 1.5rem; color: #1f4f8d; font-size: 2.125rem; font-weight: 400; line-height: 1.125; letter-spacing: -0.055em; }
.ace-intro-copy p { margin: 0 0 1rem; color: #000000; font-size: 1.125rem; font-weight: 500; line-height: 1.6; }
.ace-intro-card { align-self: flex-start; background: #ffffff; border: 0.0625rem solid #c9d4e3; box-shadow: 0 0.625rem 1.625rem rgba(31, 79, 141, 0.08); min-width:20rem;}
.ace-intro-card-row { padding: 1.4375rem 1.5rem; border-bottom: 0.0625rem solid #d7dfec; }
.ace-intro-card-row:last-child { border-bottom: 0; }
.ace-intro-card h3 { margin: 0 0 0.5625rem; color: #526bbd; font-size: 0.8125rem; font-weight: 850; line-height: 1.2; letter-spacing: 0.08em; text-transform: uppercase; }
.ace-intro-card p { margin: 0; color: #1f4f8d; font-size: 0.9375rem; font-weight: 850; line-height: 1.35; }
.ace-intro a.button {margin-top: 1.5rem;}
.ace-everyday { background: #ffffff; border-bottom: 0.0625rem solid #c9d4e3; }
.ace-everyday-inner { max-width: 73.75rem; margin: 0 auto; padding: 4.25rem 1rem; max-width: 75rem; margin: 0 auto;}
.ace-everyday-header { margin: 0 0 2.625rem; }
.ace-everyday h2 { margin: 0 0 1.5rem; color: #194684; font-size: 2.125rem; font-weight: 400; line-height: 1.125; letter-spacing: -0.045em; }
.ace-everyday-header p { margin: 0; color: #000000; font-size: 1.125rem; font-weight: 500; line-height: 1.6; }
.ace-everyday-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 0.125rem; margin: 0 0 1.75rem; }
.ace-everyday-card { background: #194684; padding: 1.875rem 1.625rem 2rem; }
.ace-everyday-card span { display: inline-flex; align-items: center; justify-content: center; min-width: 2.125rem; min-height: 1.625rem; margin: 0 0 1.25rem; background: #526dbc; color: #ffffff; font-size: 0.75rem; font-weight: 800; line-height: 1; letter-spacing: 0.06em; }
.ace-everyday-card h3 { margin: 0 0 0.75rem; color: #ffffff; font-size: 1.25rem; font-weight: 400; line-height: 1.25; }
.ace-everyday-card p { margin: 0; color: rgba(255, 255, 255, 0.82); font-size: 1rem; font-weight: 500; line-height: 1.55; }
.ace-everyday-link { display: inline-flex; color: #526bbd; font-size: 1rem; font-weight: 800; line-height: 1.3; text-decoration: underline;  }
.ace-everyday-link:hover { color: #194684;  }
.ace-tools { background: #f2f6fb; border-bottom: 0.0625rem solid #c9d4e3; }
.ace-tools-inner { padding: 4.25rem 1rem; max-width: 75rem; margin: 0 auto;}
.ace-tools-header { margin: 0 0 2.75rem; }
.ace-tools h2 { margin: 0 0 1.5rem; color: #194684; font-size: 2rem; font-weight: 400; line-height: 1.125; letter-spacing: -0.045em; }
.ace-tools-header p { margin: 0; color: #000000; font-size: 1.125rem; font-weight: 500; line-height: 1.55; }
.ace-tools-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.ace-tools-card { background: #ffffff; border: 0.0625rem solid #c9d4e3; padding: 2.125rem 2rem 1.75rem; }
.ace-tools-kicker { margin: 0 0 1rem; padding: 0 0 0.875rem; border-bottom: 0.0625rem solid #c9d4e3; color: #526bbd; font-size: 0.8125rem; font-weight: 850; line-height: 1.2; letter-spacing: 0.11em; text-transform: uppercase; }
.ace-tools-card h3 { margin: 0 0 0.875rem; color: #194684; font-size: 1.3125rem; font-weight: 400; line-height: 1.18; }
.ace-tools-card p:not(.ace-tools-kicker) { margin: 0 0 1.5rem; color: #000000; font-size: 1rem; font-weight: 500; line-height: 1.55; }
.ace-start { background: #ffffff; border-bottom: 0.0625rem solid #c9d4e3; }
.ace-start-inner { padding: 4.875rem 1rem; max-width: 75rem; margin: 0 auto;}
.ace-start-header { margin: 0 0 2.75rem; }
.ace-start h2 { margin: 0 0 1.5rem; color: #194684; font-size: 2rem; font-weight: 400; line-height: 1.125; letter-spacing: -0.045em; }
.ace-start-header p { margin: 0; color: #000000; font-size: 1.125rem; font-weight: 500; line-height: 1.55; }
.ace-start-list { display: grid; grid-template-columns: 1fr; border: 0.0625rem solid #c9d4e3; }
.ace-start-item { display: grid; grid-template-columns: 3.75rem 1fr; background: #ffffff; border-bottom: 0.0625rem solid #c9d4e3; }
.ace-start-item:last-child { border-bottom: 0; }
.ace-start-number { display: flex; align-items: center; justify-content: center; background: #194684; color: #ffffff; font-size: 1.375rem; font-weight: 800; line-height: 1; }
.ace-start-content { padding: 1.75rem 1.75rem 1.625rem; background: #f2f6fb;}
.ace-start-content h3 { margin: 0 0 0.625rem; color: #194684; font-size: 1.125rem; font-weight: 400; line-height: 1.25; }
.ace-start-content p { margin: 0 0 1rem; color: #000000; font-size: 1rem; font-weight: 500; line-height: 1.55; }
.ace-start-content a { color: #526bbd; font-size: 0.9375rem; font-weight: 800; line-height: 1.3; text-decoration: underline;  }
.ace-start-content a:hover { color: #194684;}
.ace-final-cta { background: #194684; border-bottom: 0.0625rem solid #c9d4e3; }
.ace-final-cta-inner { padding: 5rem 1rem; max-width: 75rem; margin: 0 auto; text-align: center; }
.ace-final-cta h2 { margin: 0 auto 1.5rem; color: #ffffff; font-size: 2rem; font-weight: 400; line-height: 1.125; letter-spacing: -0.05em; }
.ace-final-cta p { margin: 0 auto 2.375rem; color: rgba(255, 255, 255, 0.84); font-size: 1.125rem; font-weight: 400; line-height: 1.55; }
.ace-final-cta-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem; }
.ace-final-cta-actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 3rem; padding: 0 1.75rem; border: 0.0625rem solid rgba(255, 255, 255, 0.48); font-size: 0.9375rem; font-weight: 800; line-height: 1; text-decoration: none; }
.ace-final-cta-actions a:hover {} @media (max-width:60rem){
.ace-everyday-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width:48rem){
.desktop {display:none;}
.mobile {display:block;}
.inside {padding:0 1rem;}
#content {padding:1rem 0;}
.top-pad {padding-top: 1rem;}
.box {margin-bottom:1rem;padding-bottom:1.375rem;}
.box-single {padding: 1rem;}
.box-single img.featured {margin-bottom: 1.5rem;}
.box-single .text p {line-height:1.5em;margin-bottom:1.5rem;}
.text p {font-size: 1.25rem;line-height:1.25em;}
.text h2 {font-size:1.8em;margin:2.5rem 0 1.5rem 0;}
.text h3 {font-size:1.5em;margin: 1.75rem 0 1.5rem 0;}
.text ul, .text ol {padding-left:2.5rem;}
.text li {margin-bottom: 1.25rem;font-size:1.375rem;line-height:1.375em;}
#main-title h1 {font-size:2em;line-height:1.25em;padding: 5.25rem 0 1.5rem 0;}
#main-title h1.home {font-size:2.6rem;line-height:1.125em;padding-bottom:0.313rem;}
#main-title h2 {font-size:1.25rem;padding-bottom: 1.5rem;color:#1d1f20;}
.ace-hero-inner {padding: 4rem 1.5rem 4.5rem 1rem;}
.ace-hero h1 {font-size: 2.5rem;} 
.ace-intro-inner { display:block; padding: 4rem 1rem 4.5rem 1rem; }
.ace-intro-card {margin-top:3.5rem;}
.ace-everyday-inner { padding: 4rem 1rem 4.5rem 1rem; }
.ace-tools-inner { padding: 4rem 1rem 4.5rem 1rem; }
.ace-tools-grid { grid-template-columns: 1fr; gap: 1.5rem; }
.ace-start-inner { padding: 4rem 1rem 4.5rem 1rem }
.ace-start-item { grid-template-columns: 3.75rem 1fr; }
.ace-start-content { padding: 1.75rem 2rem 1.625rem; }
.ace-final-cta-inner { padding: 4rem 1rem 4.5rem 1rem; }
.aice-demo {padding:1rem;}
.aice-demo__header {display:block;}
.aice-demo__title {margin-bottom:1rem;font-size:1.8rem;}
.aice-demo__controls {width:100%;justify-content:flex-start;}
.aice-demo__controls .codeButtonPage {flex:1 1 auto;width:auto;}
.aice-demo__stage {min-height:12rem;padding:1rem;}
.aice-demo__example {min-height:10rem;}
.aice-demo__example > .aice-demo__box {min-height:10rem;}
.aice-demo__text {font-size:1.25rem;}
.html-demo__heading {font-size:2.25rem;}
.html-demo__paragraph {font-size:1.25rem;}
.html-demo__button {font-size:1.25rem;}
.paragraph-demo__paragraphs {font-size:1.2rem;}
.list-demo__content {padding:1rem;}
.list-demo__unordered,.list-demo__ordered {padding-left:2rem;font-size:1.25rem;}
.input-demo__radio {flex-direction:column;gap:1rem;}
.box-model-demo__margin {padding:1.25rem;}
.box-model-demo__padding {padding:1.75rem 1.25rem 1.25rem;}
.box-model-demo__label {font-size:0.7rem;}
.size-demo__box {width:55%;}
.size-demo__box--wide {width:100%;}
.size-demo__box--tall {height:10rem;}
.padding-demo__box--spaced {padding:2rem;}
.position-demo__content {gap:0.5rem;padding:1rem;}
.position-demo__box {min-height:4rem;padding:0.5rem;font-size:1rem;}
.position-demo__content.show-relative .position-demo__target {top:3rem;left:1rem;}
.position-demo__content.show-absolute .position-demo__target {right:1rem;bottom:1rem;width:35%;}
.layout-demo__content {gap:0.5rem;}
.layout-demo__box {padding:0.75rem 0.25rem;font-size:1rem;}
.display-demo__canvas {padding:1rem;}
.display-demo__content--inline-block .display-demo__item,.display-demo__content--none
.display-demo__item {width:5rem;margin:0.25rem;}
.selector-demo__content {padding:1rem;}
.selector-demo__page h3 {font-size:1.7rem;}
.selector-demo__page p {font-size:1rem;}
.flex-demo__content {padding:0.75rem;}
.flex-demo__item {width:4rem;padding:0.75rem;}
.flex-demo__content--gap {gap:0.75rem;}
.grid-demo__content--gap {gap:0.75rem;padding:0.75rem;}
.grid-demo__item {padding:0.75rem;font-size:1.25rem;}
.float-demo__canvas {padding:1rem;}
.float-demo__box {width:5.5rem;height:5.5rem;font-size:1rem;}
.float-demo__canvas p {font-size:1rem;}
.clear-demo__canvas {padding:1rem;}
.clear-demo__float {width:6rem;height:6rem;font-size:1rem;}
.clear-demo__canvas p {font-size:1rem;}
.typography-demo__content {padding:1rem;}
.typography-demo__text--large {font-size:1.5rem;}
.background-demo__content {padding:1rem;}
.background-demo__label {font-size:1.25rem;}
.color-demo__card h3 {font-size:1.75rem;}
.color-demo__card p {font-size:1.125rem;}
.presence-demo__content {gap:0.5rem;padding:1rem;}
.presence-demo__item {min-height:5rem;padding:0.5rem;font-size:0.9rem;}
.presence-demo__content--stack .presence-demo__target {left:1.5rem;}
.presence-demo__content--stack .presence-demo__last {left:-1.5rem;}
.events-demo__target {min-width:11rem;padding:1rem;font-size:1.25rem;}
.hover-demo__target {width:80%;font-size:1.25rem;}
.hover-demo__target:hover,.hover-demo__target--active {font-size:1.6rem;}
.hover-trigger-demo__parent {font-size:1.6rem;}
.hover-trigger-demo__child {width:100%;font-size:1.25rem;}
.transition-demo__box {width:5rem;height:5rem;font-size:1rem;}
.transition-demo__track--moved .transition-demo__box {transform:translateX(9rem);}
.breakpoint-demo__viewport--phone {width:45%;}
.breakpoint-demo__viewport--tablet {width:72%;}
.breakpoint-demo__bar,.breakpoint-demo__grid div {font-size:0.9rem;}
}
@media (max-width:36rem){
#buttons {float:none;clear:both;column-count:2;}
.codeButtonPage {width:100%;float:left;margin:0;}
.ace-everyday-grid { grid-template-columns: 1fr; }
.ace-hero-inner {padding: 3rem 1.5rem 3.5rem 1rem;}
.ace-intro-inner { display:block; padding: 3rem 1rem 3.5rem 1rem; }
.ace-everyday-inner { padding: 3rem 1rem 3.5rem 1rem; }
.ace-tools-inner { padding: 3rem 1rem 3.5rem 1rem; }
.ace-start-inner { padding: 3rem 1rem 3.5rem 1rem; }
.ace-final-cta-inner { padding: 3rem 1rem 3.5rem 1rem; }
}
@media (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
*,
*::before,
*::after {
animation-duration: 0.001ms !important;
animation-iteration-count: 1 !important;
scroll-behavior: auto !important;
transition-duration: 0.001ms !important;
}
}