css: add new custom css for new app

css/css.css

@@ -562,79 +562,52 @@ tbody .large {
 }
 
 /* ======================== CUSTOM CSS ===================================*/
-/* green */
-.vert {
-  color: #79AC21;
-}
-/* no idea why it's center */
-html div.ui-page div.ui-content div.ui-content-element {
-  text-align: left;
+/* override grid */
+.ui-listview.responsive.custom_grid li {
+  width: 100%;
 }
-/* white background */
-.ui-page-theme-slapos-white, .ui-page-theme-slapos-white .ui-panel-wrapper {
-  background: none repeat scroll 0 0 #FFFFFF;
-  color: #aaa;
+.mockup_image {
+  border-radius: .6em;
+  -webkit-border-radius: .6em;
+  border: 1px solid #AAAAAA;
+  float: right;
 }
-html .ui-page-theme-slapos-white .ui-input-clear:active,
-html .ui-page-theme-slapos-white .ui-input-clear.ui-btn-active,
-html .ui-page-theme-slapos-white .ui-input-action:active,
-html .ui-page-theme-slapos-white .ui-input-action.ui-btn-active {
-  background: #fff !important;
+.mockup_text {
+  margin: 0;
+  width: 50%;
+  max-width: auto;
+  display: block;
+  float: left;
+  clear: none !important;
+  height: 203px;
 }
-/* override responsive text blocks in grid WHY, breaks!*/
-.ui-listview.responsive .ui-li-has-thumb p, .ui-listview.responsive .ui-li-has-icon p {
-  /*
-  display: inline-block;
-  max-width: 46%;
-  min-height: 25%;
-  padding: 0 0.5em;
-  */
-}
-/* position aside */
-.ui-listview.responsive .ui-li-aside {
-  background: transparent;
-  bottom: 0;
-  top: auto;
-  font-size: 80%;
+.mockup_text, .mockup_image {
+  margin-top: .25em !important;
 }
-@media ( min-width: 48em ) {
-  .ui-listview.responsive .ui-li-aside {
-    background: #fff;
-    right: 0;
-    top: 0;
-    bottom: auto;
+@media (max-width: 40em) {
+  .mockup_image, .mockup_text {
+    float: none;
+    clear: both;
   }
-}
-/* hide crumbs on mobile */
-@media (max-width: 48em) {
-  .crumbs {
-    display: none;
+  .mockup_image {
+    width: 100%;
+    padding-bottom: .5em;
+  }
+  .mockup_text {
+    height: auto;
+    width: auto;
+    margin: 0 !important;
   }
 }
-/* decorate header */
-.job_headline {
-  font-size: 200%;
-  text-align: left;
-}
-/* decorate location */
-.job_locator {
-  line-height: 3.5em;
-  vertical-align: middle;
-}
-/* job_logo */
-.job_logo {
-  margin: 7px 0;
-  max-height: 2.5em;
-  padding: 0 0.5em 0 0;
-}
-/* content-element */
-html div.ui-page div.ui-content .ui-content-element {
-  margin: auto;
+.ui-page-theme-slapos-white, .ui-page-theme-slapos-white .ui-panel-wrapper {
+  background: none repeat scroll 0 0 #DDDDDD;
+  color: #fff;
 }
-/* alignment */
-.dyno > .ui-controlbar,
-.dyno > .ui-controlbar ~ .ui-controlbar {
-  text-align: center;
+html .ui-page-theme-slapos-white .ui-input-clear:active,
+html .ui-page-theme-slapos-white .ui-input-clear.ui-btn-active,
+html .ui-page-theme-slapos-white .ui-input-action:active,
+html .ui-page-theme-slapos-white .ui-input-action.ui-btn-active {
+  background: #DDDDDD !important;
 }