﻿html, body, input, textarea, select, button { font-size: 20px; font-family: 'Nunito', sans-serif; }

h2 { font-size: 40px; }

a.mox-login-button, 
.mox-login fieldset input[type="submit"], 
.mox-login fieldset button.save,
.mox-content fieldset input[type="submit"], 
.mox-content fieldset button.save,
.mox-button { height: 70px; border-radius: 35px; line-height: 70px; white-space: nowrap; padding: 0 30px; text-align: center; min-width: 150px; font-weight: bold; box-sizing: border-box; }

a.mox-login-button, 
.mox-login fieldset input[type="submit"], 
.mox-login fieldset button.save,
.mox-content fieldset input[type="submit"], 
.mox-content fieldset button.save { background-color: #2dab61; }

a.mox-login-button:hover, 
.mox-login fieldset input[type="submit"]:hover, 
.mox-login fieldset button.save:hover,
.mox-content fieldset input[type="submit"]:hover, 
.mox-content fieldset button.save:hover { background-color: #1f8a4b; }

.mox-content fieldset input[type="submit"].delete, 
.mox-content fieldset button.delete,
.mox-button.delete { background-color: #e84848; color: #fff; }

.mox-content fieldset input[type="submit"].delete:hover, 
.mox-content fieldset button.delete:hover,
.mox-button.delete:hover { background-color: #ae2727; color: #fff; }


.mox-login fieldset p input[type="text"],
.mox-login fieldset p input[type="password"],
.mox-login fieldset p textarea,
.mox-content fieldset p input[type="color"],
.mox-content fieldset p input[type="date"],
.mox-content fieldset p input[type="datetime"],
.mox-content fieldset p input[type="datetime-local"],
.mox-content fieldset p input[type="email"],
.mox-content fieldset p input[type="month"],
.mox-content fieldset p input[type="number"],
.mox-content fieldset p input[type="password"],
.mox-content fieldset p input[type="search"],
.mox-content fieldset p input[type="tel"],
.mox-content fieldset p input[type="text"],
.mox-content fieldset p input[type="time"],
.mox-content fieldset p input[type="url"],
.mox-content fieldset p input[type="week"],
.mox-content fieldset p select,
.mox-content fieldset p textarea { border-radius: 5px; height: 60px; padding: 0 18px; border: 1px solid #707070; }

.mox-content fieldset p textarea { padding: 18px; height: auto; resize: vertical; }

.flex-columns { display: flex; }
.flex-columns > * { flex: 1 1 100%; }
.flex-columns > * + * { margin-left: 20px; }
.flex-noflex { flex: 0; }
.flex-center { display: flex; align-items: center; }

.field-validation-error { font-size: 16px; }
label { font-size: 16px; font-weight: bold; }

.mox-content fieldset .flex-columns { margin-top: 1em; margin-bottom: 1em; }
.mox-content fieldset .flex-columns > p { margin-top: 0; margin-bottom: 0; }

@media only screen and (max-width: 640px) {
    .flex-columns:not(.locked) { flex-direction: column; }
    .flex-columns:not(.locked) > * + * { margin: 0; }
    .mox-content fieldset .flex-columns:not(.locked) > p { margin-bottom: 1em; }
    .mox-content fieldset .flex-columns:not(.locked) > p:last-of-type { margin-bottom: 0; }
    .flex-center { justify-content: center; }
}