updated CSS for fieldlist (required inputs, etc)

css/css.css

+/* ======================== form field validation ========================= */
 html body .ui-input-text.invalid,
 html body .ui-select .ui-btn.invalid,
 html body .required.invalid ~ label {
   border: 1px solid red !important;
 }
+html body label.required_label:after {
+  content: "*";
+  position: absolute;
+  width: 100%;
+}
 html body input ~ .ui-invalid-label {
   display: none;
 }
@@ -16,6 +22,7 @@ html body input.invalid ~ .ui-invalid-label {
   padding: 0px 1em;
   position: absolute;
 }
+/* ======================== generic things ========================= */
 .bold {
   font-weight: bold;
 }
@@ -347,7 +354,7 @@ html body form input.secure_form {
   width: 100%;
 }
 .loader_icon:after {
-  font-size: 2.5em;
+  font-size: 2em;
 }
 .loader_message {
   text-align: center;
@@ -359,7 +366,6 @@ html body form input.secure_form {
   -moz-animation-duration: 375ms;
   animation-timing-function: ease-in;
   animation-duration: 375ms;
-
 }
 @-webkit-keyframes fadeout {
     0% { opacity: 1; }

css/fontawesome.css

@@ -1408,7 +1408,13 @@ html .ui-btn:after {
 /* iconsize, positioning */
 html .ui-btn[class*="ui-icon-"]:after,
 html .ui-btn[class*="ui-icon-"]:after {
-  font-size: 1.5em;
+  font-size: 1.25em;
+}
+@media (max-width: 30em) {
+  html .ui-btn[class*="ui-icon-"]:after,
+  html .ui-btn[class*="ui-icon-"]:after {
+    font-size: 1.5em;
+  }
 }
 html .ui-header .ui-btn[class*="ui-icon-"]:after,
 html .ui-header .ui-btn[class*="ui-icon-"]:after {

css/themes.css

@@ -322,7 +322,7 @@ html .ui-page-theme-slapos-white .ui-collapsible-set .ui-collapsible h1 a.ui-btn
 
 
 
-/* slapos-black */header
+/* slapos-black */
 /*-----------------------------------------------------------------------------------------------------------*/
 /* Bar: Toolbars, dividers, slider track */
 hr {
@@ -736,7 +736,9 @@ html .ui-page-theme-slapos-black .ui-controlbar .ui-btn:active,
 html .ui-page-theme-slapos-black .ui-controlbar .ui-btn.ui-btn-active,
 /* Tab Buttons */
 html .ui-page-theme-slapos-black .ui-collapsible-set .ui-collapsible h1 a.ui-btn:active,
-html .ui-page-theme-slapos-black .ui-collapsible-set .ui-collapsible h1 a.ui-btn.ui-btn-active {
+html .ui-page-theme-slapos-black .ui-collapsible-set .ui-collapsible h1 a.ui-btn.ui-btn-active,
+/* LOADER */
+html .ui-loader.ui-body-loader-active {
   background-color: #94f2f1;
   background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0fbabd), to(#94f2f1));
   background:        -webkit-linear-gradient(bottom, #0fbabd, #94f2f1);
@@ -1004,7 +1006,12 @@ html div.ui-page div.ui-content .ui-content-element > .ui-btn {
   margin: 1em auto 0;
   display: block;
 }
-
+html div.ui-page div.ui-content .ui-content-element .ui-controlgroup {
+  margin: .5em 0;
+}
+html div.ui-page div.ui-content .ui-content-element .ui-controlgroup .ui-btn:after {
+  margin-top: -11px;
+}
 
 .panel .ui-panel-inner .panel_element {
   margin-left: -1em;