install.css

/* Installer CSS */
body {background:#5ba3b9 url(splash.jpg) no-repeat center -250px; font-size:75%; min-width:260px}
body, input, select, textarea, table {font-family:arial, helvetica, sans-serif}
input, select, textarea {font-size:100%}
#container {margin:0 auto 50px auto; max-width:660px; background:#f5f5ff; background:rgba(245, 245, 255, 0.75); border:1px solid #96b3c9; -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px); padding:20px; line-height:1.4}
h1 {margin:0 0 10px; font-size:175%; font-weight:normal; color:#32517e}
h1 img {vertical-align:middle; height:30px; margin:-5px 15px auto auto; -webkit-filter:drop-shadow(1px 2px 0 #96b3c9); filter:drop-shadow(1px 2px 0 #96b3c9)}
p.lead {font-size:110%}
a {text-decoration:none; color:#00f}
a:hover {text-decoration:underline; color:#000}
pre {overflow:auto; padding-bottom:5px}
li {margin-bottom:1em}
hr.aboveToggle {margin-top:3px; border:solid #96b3c9; border:solid rgba(50,81,126,0.25); border-width:1px 0 0}

/* Navbar */
#header {max-width:700px; margin:0 auto}
#header ul {width:fit-content; position:relative; z-index:1; margin:0 auto -1px auto; padding:0; list-style-type:none}
#header ul > li {display:inline-block; margin:0; padding:0}
#header ul > li a {display:block; font-size:100%; padding:5px 10px; height:14px; color:#32517e; background-color:#e9eff8; border:1px solid #96b3c9; border-right:0}
#header ul > li:last-child a {border:1px solid #96b3c9}
#header ul > li a.active, #header ul > li a:hover {height:15px; margin-bottom:-1px; border-bottom:0}
#header ul > li a.active {font-weight:bold}
#header ul > li a:hover {text-decoration:none}

/* Inputs and other form elements */
form, .form {margin:0; padding:0}
input.text, textarea {background:#fff; border:1px solid #aaa; box-shadow:inset 0 1px 3px #ccc; padding:2px}
input.text:focus, textarea.text:focus {border-color:#777}
input::placeholder {color:#aaa}
.placeholder {color:#aaa}
input.checkbox, input.radio {padding:0; margin:0 5px 1px 0; vertical-align:-2px}
label.checkbox, label.radio {cursor:pointer}
.form label {width:16em; float:left; text-align:right; margin:0 1em 1px 0}
.form div label {float:none; width:auto; text-align:left; margin:0}
.form label.long {width:100%; text-align:left}
.form label.radio {text-align:left; cursor:pointer}
.form input.text, .form select {width:17em; margin:0; float:left; font-size:130%}
.form div {float:left}
.form div input.text, .form div select {float:none}
.form li {margin-bottom:4px; overflow:hidden; list-style:none; display:block; zoom:1}
.form small {color:#888; font-size:90%}
.form small a {color:#55f}
/* myesoBB */
.form input#forumURL {width:12em}
.form p#forumDomain {float:left; font-size:125%; margin:1px 0 0 3px}

/* Fieldsets */
fieldset {margin:10px 0 10px 0; padding:0 15px 15px; border:1px solid #96b3c9; border:1px solid rgba(50,81,126,0.25)}
fieldset p {margin:0 0 1em}
legend {font-size:140%; font-weight:bold; padding:5px 10px 10px; color:#000}
fieldset legend a {color:#000}
fieldset.hidden {margin:10px 0 5px 0; padding:0 16px 0; border-width:1px 0 0}
fieldset.hidden legend a {color:#32517e}
fieldset li:last-child {border-bottom:none!important; margin-bottom:0!important}
fieldset > .warning:last-child {margin:0}

/* Messages */
.msg {padding:5px 10px; background:#ddd; box-shadow:inset 0 5px 10px rgba(255, 255, 255, 0.4); margin:0 0 1em 0; line-height:1.4}
.form .msg {font-size:95%; padding:3px 5px; margin:0; margin-left:204px; float:left; clear:left; width:19em; width:calc(17rem - 11px)}
.info {background:#fad163; box-shadow:inset 0 5px 10px rgba(255, 255, 255, 0.4)}
.success {background:#cf0; box-shadow:inset 0 5px 10px rgba(255, 255, 255, 0.4)}
.warning {background:#c00; box-shadow:inset 0 5px 10px rgba(255, 255, 255, 0.4); color:#fff}
.warning a, .warning a:hover {color:#fff; text-decoration:underline}

/* Footer and buttons */
hr.separator {color:#bbf; border:dashed #96b3c9; border:dashed rgba(50,81,126,0.25); border-width:1px 0 0; height:1px; margin:15px -20px 0 -20px}
#version {font-size:90%; font-weight:bold; text-transform:uppercase; color:#32517e; margin:5px 0 0}
#footer .button {font-size:130%; margin-bottom:0}
#footer input.button, #footer .button del {display:inline-block; padding:2px 10px 1px 10px; height:25px}
#footer input.button {color:#fff; text-shadow:#046b9e 0 -1px; background:linear-gradient(#9dcade 25%, #44a2c9 50%, #1e77af 50%, #37dcee 100%); border:1px solid #1a6b9d; border-radius:5px; box-shadow:inset 0 1px 1px #eeeeee,1px 2px 0 #96b3c9}
#footer input.button:hover {text-decoration:none; box-shadow:inset 0 0 0 2px rgba(255, 255, 255, 0.5),inset 0 1px 1px #eeeeee,1px 2px 0 #96b3c9}
#footer input.button:active {box-shadow:inset 0 0 25px 2px rgba(0, 0, 0, 0.25),inset 0 1px 1px #eeeeee,1px 2px 0 #96b3c9}
#footer .button del {color:#999; text-decoration:none; cursor:not-allowed; text-shadow:#fff 0 1px; background:linear-gradient(#e9ebe8 25%, #d8dad6 50%, #cbceca 50%, #f8faf7 100%); border:1px solid #b2b4b1; border-radius:5px; box-shadow:inset 0 1px 0 #ffffff,1px 2px 0 #96b3c9}

/* Other styles */
.overflowDiv {margin-top:3px}
#emailConfig > a {width:16em; text-align:right; margin:2px 1em 0 0; display:block}
#advanced input.text {font-size:100%; width:22em}

/* Mobile support */
@media only screen and (max-width:800px) {
  body {margin:0; background:#5ba3b9}
  #container {width:unset; margin:unset; background:#f5f5ff}
}

@media only screen and (max-width:650px) {
  .form input.text, .form select, .form div {clear:left}
  .form label {text-align:left; width:auto}
  .form .msg {margin:0}
  #emailConfig a {width:auto; text-align:left}
}

@media only screen and (max-width:400px) {
  .form input.text {width:100%!important; width:-moz-fill-available!important; width:-webkit-fill-available!important; width:stretch!important}
  .form select {width:100%}
  .form .msg {width:auto; width:-moz-fill-available; width:-webkit-fill-available; width:stretch}
  /* myesoBB */
  .form input#forumURL {width:calc(100% - 85px)!important}
}