website/css/search.css

   1
   2
   3 form {
   4   width: 100%;
   5   padding: 1em 15px;
   6 }
   7 form #q {
   8   min-width: 500px;
   9 }
  10 @media (max-width: 850px) {
  11 form #q {
  12   min-width: 400px;
  13 }
  14 }
  15 form .checkbox-inline {
  16   margin-left: 10px;
  17 }
  18 form label {
  19   font-weight: normal;
  20 }
  21
  22 .search-type-link {
  23   display: inline;
  24   margin-right: 2em;
  25   position: absolute;
  26   right: 0
  27 }
  28
  29 .sidebar {
  30   width: 25%;
  31   padding: 15px;
  32   padding-top: 0;
  33   display: inline-block;
  34   float: left;
  35 }
  36
  37
  38 #map-wrapper {
  39   position: relative;
  40   min-height: 700px;
  41   width: 75%;
  42   padding-right: 20px;
  43   display: inline-block;
  44   float: left;
  45 }
  46
  47 #map {
  48   height: 100%;
  49   min-height: 700px;
  50   background:#eee;
  51 }
  52
  53 #map-position {
  54   display: none;
  55   position: absolute;
  56   top: 0;
  57   right: 20px;
  58   padding: 0 5px;
  59   color: #333;
  60   font-size: 11px;
  61   background-color: rgba(255, 255, 255, 0.7);
  62   z-index: 100;
  63 }
  64
  65 #map-position-close {
  66   text-align: right;
  67 }
  68
  69 .result {
  70   font-size: 0.8em;
  71   margin: 5px;
  72   margin-top:0px;
  73   padding: 4px 8px;
  74   border-radius: 2px;
  75   background:#F0F7FF;
  76   border: 2px solid #D7E7FF;
  77   cursor:pointer;
  78   min-height: 5em;
  79 }
  80
  81
  82 .result.highlight {
  83   background-color: #D9E7F7;
  84   border-color: #9DB9E4;
  85 }
  86 .result.highlight .details {
  87   margin: 10px auto;
  88   display: block;
  89   max-width: 10em;
  90 }
  91 .result img{
  92   float: right;
  93 }
  94 .result .type{
  95   color: gray;
  96   font-size: 0.8em;
  97 }
  98 .result .details {
  99   display: none;
 100 }
 101 .noresults{
 102   text-align: center;
 103   padding: 1em;
 104 }
 105
 106 .more{
 107   text-align:center;
 108   margin-top: 1em;
 109 }
 110
 111 footer {
 112   text-align: center;
 113   padding: 2em 0;
 114   font-size: 0.8em;
 115   clear: both;
 116   color: #333;
 117 }
 118
 119 footer p {
 120   margin: 1em;
 121 }
 122
 123 @media (max-width: 768px) {
 124   #content {
 125     top: 0;
 126     position: relative;
 127   }
 128   #map-wrapper {
 129     width: 100%;
 130     max-height: 300px;
 131     padding: 20px;
 132   }
 133   #map-position {
 134     top: 20px;
 135     right: 20px;
 136   }
 137   #map {
 138     height: 300px;
 139   }
 140   .sidebar {
 141     width: 100%;
 142   }
 143   .search-button-group {
 144     display: inline
 145   }
 146 }