:root{--bg-color: #5695e6;--bg-alt: #6c9ad5;--male: #79B1FC;--male-alt-1: #c2f6e9;--male-alt-2: #57e8db;--female: #FDB9B4;--female-alt-1: #ffcfcb;--female-alt-2: #e0c3fb;--header-gradient-1: #69A9FC;--header-gradient-2: --bg-color}html{font-size:13px}body{background-color:#efefef;color:#0e0e0e;font-family:'Roboto',Helvetica,Arial, sans-serif;letter-spacing:0.025em}header{background-image:repeating-linear-gradient(var(--header-gradient-1), var(--header-gradient-2));width:100%;position:relative;text-align:center;margin:0 auto;overflow:hidden;box-sizing:border-box}header a{text-decoration:none;display:block;margin:0;padding:1.75%;height:100%;color:black}header a:link{color:black}header h1{display:block;color:#333;text-shadow:1px -1px 0 white,-1px 1px 0 white,-1px -1px 0 white,1px 1px 0 white,0 3px 6px rgba(0,0,0,0.4);font-size:2.70em;text-transform:uppercase;font-weight:bold;line-height:1.75em;margin:0}.headerimg{width:850px;margin:0 auto;max-width:100%;height:100%;box-sizing:border-box;-webkit-filter:drop-shadow(3px 3px 5px rgba(255,255,255,0.23));filter:drop-shadow(3px 3px 5px rgba(255,255,255,0.23))}.headerlink{display:block}#wrapper{width:1000px;max-width:100%;margin:auto;box-sizing:border-box;box-shadow:2px 2px 20px #00000045;border:1px solid #00000075;position:relative;background-color:var(--bg-color)}#wrapper::before{content:"";width:100%;height:100%;display:block;top:0;left:0;pointer-events:none;position:absolute;box-shadow:inset 0 0 80px -70px black;box-sizing:border-box;z-index:100}nav{font-size:0.95em;width:100%;background-image:repeating-linear-gradient(rgba(255,255,255,0.368627), rgba(255,255,255,0.231373) 2.5em);padding:0;margin:0 auto;overflow:hidden;align-content:stretch;display:grid;box-sizing:border-box;grid-template-columns:repeat(auto-fill, minmax(13ch, 1fr))}nav a{height:2.5em;text-align:center;padding:0;flex-grow:1;border-right:1px solid #799dcd;background-image:repeating-linear-gradient(rgba(255,255,255,0.368627), rgba(255,255,255,0.231373) 100%);margin-right:-1px;color:#0d0d0d;text-decoration:none;padding:0 0.25em;line-height:2.5em;box-sizing:border-box;display:block;text-align:center}nav a:hover{display:block;color:#ffffff;background-color:rgba(0,0,0,0.2)}nav a:focus{outline-color:#83b8fa;outline-style:auto;outline-width:6px;cursor:pointer}nav a.selected{background-color:rgba(3,52,104,0.64);color:white}input[type="radio"]{width:20px;height:20px;margin-left:0;margin-top:0.5em;display:inline-block;cursor:pointer}input[type="radio"]:focus{outline-color:#83b8fa;outline-style:auto;outline-width:6px;cursor:pointer}h3{font-size:1.0em}main{width:100%;max-width:100%;margin:0 auto;text-align:center;padding-bottom:0.0em;box-sizing:border-box;box-shadow:inset 0 2px 2px -2px #00000059}.infotext{max-width:1280px;padding:1em;margin:0 auto}.infotext div,.infotext ol,.infotext p,.infotext section,.infotext ul{padding-bottom:0.5em}#content{width:100%;max-width:1024px;box-sizing:border-box;margin:0 auto;background:inherit;font-size:1em;text-align:justify;padding:0.5em 1em;display:flex;flex-wrap:wrap;flex-direction:column}#content ul{margin:10px}#content li{margin-bottom:5px}.copied{position:absolute;left:0;top:0;right:0;text-align:center;opacity:0;transform:translateY(0em);color:#303030;font-size:0.8em;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.copied.done{animation:fadeaway 2.5s ease-in-out}#names{width:100%;display:flex;flex-wrap:wrap;text-align:center;margin:1em auto;gap:1em}#names h3,#names h4{font-family:Georgia, "Times New Roman", Times, serif;font-weight:normal}#names h3{margin:0;font-size:1.25em;margin-top:-0.33em}#names h4{margin-top:0.33em;font-size:1em;font-style:italic;opacity:75%}#female,#male{height:10em;flex:1;margin:0 auto;width:100%;max-width:100%;min-width:22em;box-sizing:border-box;display:flex;margin:0 auto;flex-direction:column;justify-content:center;box-shadow:-4px 4px 15px #00000033}#male{background-color:var(--male)}#male .fade::selection{background-color:var(--female)}#female{background-color:var(--female)}#female .fade::selection{background-color:var(--male)}#forms{margin:0 auto;width:100%;font-size:1.20em;text-align:center;padding-bottom:1em;display:flex;flex-direction:column;box-sizing:border-box}#selectradios{display:flex;font-size:0.75em;flex-wrap:wrap;margin:1em 0 0;gap:1em}#selectradios input[type="radio"]{width:1.5em;height:1.5em;margin-top:0.5em;margin-bottom:0.5em}#selectradios fieldset{border-radius:3px;background-color:#ffffff0d;border:none;padding-top:2.1em;position:relative;box-sizing:border-box;margin:0;color:#313131;flex:1;min-width:14em}#selectradios fieldset>div{display:flex;justify-content:center;gap:1em}#selectradios fieldset>div>div{display:flex;flex-direction:column}#selectradios fieldset.emptyfieldset{background-color:transparent}#selectradios fieldset legend{padding:0.25em;border-radius:2px;top:0.5em;left:0;position:absolute;width:100%;box-sizing:border-box}@media all and (min-width: 480px){#selectradios fieldset#nsfw{background-color:#00000012;color:#ffffff82;opacity:0.5;transition:all 0.2s ease-in-out}#selectradios fieldset#nsfw:hover{color:#e3e3e3;opacity:1;background-color:#673ab71f}}input[type="submit"],button{min-height:3em;margin:0 auto;border-radius:8px;box-shadow:0 0 20px -10px black;font-size:1em;padding:1em;border-radius:2px;background:#0f1d6c;color:#ffffff;border:1px solid #1129af}button#gen_button{cursor:pointer;font-family:inherit;letter-spacing:inherit}button#gen_button:focus{outline-color:#83b8fa;outline-style:auto;outline-width:8px;animation-fill-mode:forwards;animation:buttoncolour 1.25s ease-in-out}button#gen_button:active{box-shadow:-3px -3px 5px -1px black}footer{width:100%;max-width:1024px;text-align:center;margin:0 auto;padding-bottom:0.5em;font-size:0.7em;margin-top:0;padding-top:1em;line-height:1.1em;box-sizing:border-box}footer p{margin:0}footer a{color:#00266c;text-decoration:none}footer a:hover{text-decoration:none;color:#ffffff;background-color:#233248}code{text-decoration:none;background-color:#eee;color:#333;display:block;font-family:monospace;margin-top:1em;font-size:1.1em;width:calc(100% - 1em);padding:0;word-break:break-word}code a{text-decoration:none;color:#333;display:block;font-family:monospace;padding:0.5em;word-break:break-word}code a:hover{text-decoration:none;background-color:#ddf}#female-name,#male-name{position:relative}.fade{animation:fadein 0.5s;text-shadow:3px 3px 20px #fff3, -3px 3px 20px #fff3, 3px -3px 20px #fff3, -3px -3px 20px #fff3}#disclaimer{font-size:0.9em;font-style:italic}#disclaimer h3{display:inline;font-style:normal;margin-right:0.75ch}#disclaimer p{display:inline}.js-on{display:none}.switch{position:relative;display:inline-block;width:60px;height:34px;margin-top:0.5em}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;-webkit-transition:0.4s;transition:0.4s;box-shadow:0 0 1px}.slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:white;-webkit-transition:0.4s;transition:0.4s}input:checked+.slider{background-color:#1d6eaf}input:focus+.slider{box-shadow:0 0 1px #2196F3}input:checked+.slider:before{-webkit-transform:translateX(26px);-ms-transform:translateX(26px);transform:translateX(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}@media only screen and (max-width: 989px){nav{grid-template-columns:repeat(auto-fill, minmax(12ch, 1fr))}}@media only screen and (min-width: 934px){nav{grid-template-columns:repeat(auto-fill, minmax(13ch, 1fr))}}@media only screen and (min-width: 1280px){nav{grid-template-columns:repeat(auto-fill, minmax(15ch, 1fr))}}@media only screen and (max-width: 1279px) and (min-width: 990px){nav{grid-template-columns:repeat(auto-fill, minmax(14ch, 1fr))}}@media only screen and (min-width: 1280px) and (min-height: 700px){html{font-size:14px}#wrapper{width:1200px}}@media only screen and (min-width: 1680px) and (min-height: 700px){html{font-size:16px}.headerimg{width:950px}#wrapper{width:1400px}#content{max-width:1200px}nav{font-size:1rem}#names{margin-bottom:2em}}@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1), only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-width: 834px) and (max-device-width: 1112px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2){html{font-size:15px;height:100%}body{background-color:var(--bg-color);display:flex;flex-direction:column;height:100%;margin:0}#wrapper{display:flex;flex-direction:column}header{display:flex;flex-direction:column}nav{grid-template-columns:repeat(auto-fill, minmax(7em, 1fr))}main{font-size:1.1em;height:100%;flex:1}#wrapper{flex:1;border:none;width:100%}#content{height:100%;justify-content:space-between;max-width:100%}#names{flex-direction:row}#female,#male{height:8em}form#forms{flex-direction:column-reverse;padding:1em;gap:1em;z-index:2}form#forms button#gen_button{margin-right:0;min-width:323px;width:323px}}@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1), only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2){nav{grid-template-columns:repeat(auto-fill, minmax(10em, 1fr))}#content{height:calc(100% - 50px)}#names{flex-direction:column;font-size:0.9em}#female,#male{padding:1em;height:8em}form#forms{flex-direction:column-reverse;gap:1.5em}}@media only screen and (min-device-width: 1025px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape){nav{grid-template-columns:repeat(auto-fill, minmax(9em, 1fr))}}@media only screen and (min-device-width: 834px) and (max-device-width: 1112px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait), only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait){nav{font-size:1.2em;grid-template-columns:repeat(auto-fill, minmax(10em, 1fr))}}@media only screen and (min-width: 1024px) and (min-height: 700px){#content{min-height:400px;justify-content:space-evenly}.infotext{flex:0 0 90%}button#gen_button{margin:1em auto}}@media only screen and (max-width: 767px){#selectradios fieldset.emptyfieldset{flex:0;min-width:50px}}@media only screen and (max-width: 680px){#selectradios fieldset.emptyfieldset{display:none}}@media only screen and (max-width: 556px){#selectradios #doppelnamen{order:2}#selectradios #vornamen{order:3}#selectradios #american,#selectradios #classicscand,#selectradios #nsfw,#selectradios .emptyfieldset{order:1;flex:0 0 100%}}@media only screen and (max-width: 480px){body{margin:0;background-color:var(--bg-color)}#wrapper{border:none;box-shadow:none;height:100%;display:flex;flex-direction:column;min-height:calc(100vh - 90px);justify-content:flex-start}#wrapper::before{box-shadow:none}#content,main{display:flex;flex-direction:column;justify-content:space-between;flex:1}nav{font-size:0.9em}#forms{padding-bottom:2em;flex:1;justify-content:flex-end;font-size:1em}#selectradios{font-size:0.7em;gap:2px;justify-content:flex-end}#gen_button{width:100%;order:2;margin-top:0.75em}}@media only screen and (max-width: 480px) and (min-height: 650px) and (max-height: 740px){#wrapper{min-height:calc(100vh - 150px)}}@media only screen and (max-width: 480px) and (max-height: 720px){#female,#male{height:inherit;padding:1em 0.5em}#names{font-size:0.85em;margin:0.75em auto;gap:0.75em}footer{position:inherit}}@media only screen and (max-width: 360px){html{font-size:12px}#female,#male{min-width:100%}}@media only screen and (max-width: 340px){html{font-size:12px}}@media only screen and (max-height: 500px){body,html{width:100%;height:100%}html{font-size:11px}body{margin:0}header a{padding:1%}.headerimg{max-width:500px;max-height:20px}nav{font-size:0.9em;grid-template-columns:repeat(auto-fill, minmax(9em, 1fr))}#female,#male{height:7.5em}form#forms{padding:0.5em;gap:0.5em}}@media only screen and (max-height: 400px){html{font-size:10px}}@media only screen and (max-height: 500px) and (orientation: landscape){nav{font-size:0.8em}}@keyframes fadein{from{opacity:0}to{opacity:1}}@keyframes fadeaway{0%{opacity:0;transform:translateY(0)}15%{opacity:0}33%{opacity:1;transform:translateY(-1.2em)}50%{opacity:1;transform:translateY(-1.2em)}100%{opacity:0;transform:translateY(-1.2em)}}@keyframes buttoncolour{0%{background:#192ea4 radial-gradient(circle, transparent 1%, #0f1d6c 1%) center/1%}50%{background:#0f1d6c radial-gradient(circle, transparent 1%, #0f1d6c 1%) center/15000%}51%{background:#0f1d6c}100%{background:#0f1d6c}}