website/css/search.css

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