/*hss 1.0*/html{scroll-behavior:smooth;}body{--acti:#008080;--back:#0f368f;--canc:#fbb220;font-size:15px;--high:#fb8320;margin:0;overflow-y:scroll;padding:82px 32px 32px 32px;--text:#fff;--warn:#d50000;}*{box-sizing:border-box;font-family:'Trebuchet MS',sans-serif;font-size:15px;line-height:1.38em;outline:none;}.shadow{box-shadow:4px 4px 4px 0px rgba(0,0,0,0.38);transition:box-shadow ease 0.38s;}.shadown{box-shadow:2px 2px 2px 0px rgba(0,0,0,0.38);}nav>ul{align-items:stretch;background:var(--back);box-shadow:0 4px 4px 0px rgba(0,0,0,0.38);display:flex;height:50px;left:0;list-style:none;margin:0;padding:0;position:fixed;right:0;top:0;z-index:1;}nav>ul>li{align-items:stretch;display:flex;}nav>ul>li:first-child{margin-right:auto;}nav>ul>li>a,nav>ul>li>span{align-items:center;background:var(--back);color:#fff;cursor:pointer;display:flex;padding:0 16px;text-decoration:none;transition:background ease 0.38s;}nav>ul>li>a:hover,nav>ul>li>a.on,nav>ul>li>span:hover,nav>ul>li>span.on,body.demo>ul li.step>div>div fieldset>button:hover{background:var(--high);}body.demo>ul{align-items:center;display:flex;flex-direction:column;list-style:none;margin:0;padding:0;}body.demo>ul>li+li{margin-top:64px;}body.demo>ul li.step{display:flex;justify-content:stretch;width:68%;}body.demo>ul li.step>span{color:var(--back);font-family:monospace;font-size:96px;}body.demo>ul li.step>div{align-items:stretch;display:flex;flex:1;flex-direction:column;margin-left:32px;position:relative;}body.demo>ul li.step>div>p{background:var(--warn);color:#fff;padding:4px 8px;position:absolute;right:0;top:0;}body.demo>ul li.step>div>div>p{line-height:1.38em;margin:1em 0 0 0;}body.demo>ul li.step>div>div>p:nth-child(1){color:var(--back);font-size:24px;margin-top:8px;}body.demo>ul li.step>div>div pre{font-family:monospace;line-height:1.38em;}body.demo>ul li.step>div>div pre .var{background:var(--high);color:#fff;font-family:monospace;padding:0 4px;}body.demo>ul li.step>div>div fieldset{align-items:flex-start;border:none;display:flex;justify-content:center;margin-top:1em;padding:0;}body.demo>ul li.step>div>div fieldset>button{background:var(--acti);border:none;color:#fff;cursor:pointer;min-height:32px;padding:4px 8px;transition:background ease 0.38s;}body.demo>ul li.step>div>div fieldset>button:hover+input,body.demo>ul li.step>div>div fieldset>button:hover+textarea{border-color:var(--high);}body.demo>ul li.step>div>div fieldset>input{background:#fff;border:1px solid var(--acti);font-family:monospace;min-height:32px;padding:6px 10px;transition:border-color ease 0.38s;width:384px;}body.demo>ul li.step>div>div fieldset>textarea{background:#fff;border:1px solid var(--acti);font-family:monospace;height:6em;min-height:32px;padding:6px 10px;transition:border-color ease 0.38s;width:384px;}