html {
  margin: 0;
  padding: 0; }

body {
  margin: 0 auto;
  padding: 0 0 10px 0;
  font: normal 14px/20px Helvetica, sans-serif;
  color: #484848;
  -webkit-user-select: none;
  -webkit-text-size-adjust: none;
  background: #ffba00 url(iphone/yellowbricks.png) top left repeat;
  overflow-x: hidden;
  width: 320px; }

a {
  color: #9e1565;
  font-weight: bold;
  text-decoration: none; }
  a img {
    border: 0; }
  a:focus, a:active {
    outline: none; }

h1 {
  margin: -1px 10px 10px 10px;
  padding: 0;
  height: 54px;
  background: white;
  border-bottom-left-radius: 8px;
  border-bottom-left-radius: 8px;
  -webkit-border-bottom-left-radius: 8px;
  -webkit-border-bottom-right-radius: 8px;
  -moz-border-radius-bottomleft: 8px;
  -moz-border-radius-bottomright: 8px; }
  h1 a {
    display: block;
    height: 38px;
    width: 146px;
    margin: 0 auto;
    padding: 8px 10px;
    background: url(iphone/logo.png) center center no-repeat;
    text-indent: -3000em; }

h2 {
  margin: 20px 18px -5px 18px;
  padding: 0;
  color: black;
  font-size: 24px;
  font-weight: normal;
  text-align: center;
  text-shadow: #484848 1px 1px 1px; }

#footer {
  text-align: center;
  margin: 20px 0 0 0; }
  #footer a {
    font-weight: bold;
    color: white;
    text-decoration: none;
    font-size: 16px;
    text-shadow: black 2px 2px 2px; }

.menu {
  margin: 10px;
  padding: 0;
  list-style: none;
  background: #9e1565;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px; }
  .menu li {
    margin: 0;
    padding: 0; }
    .menu li a {
      display: block;
      margin: 0;
      padding: 10px 25px 10px 10px;
      font-size: 20px;
      color: white;
      text-decoration: none;
      border-bottom: 2px solid #6d0341;
      position: relative;
      font-weight: bold;
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden; }
      .menu li a:after {
        display: block;
        content: " ";
        background: url(iphone/go.png);
        height: 13px;
        width: 8px;
        position: absolute;
        right: 10px;
        top: 13px; }
      .menu li a:active, .menu li a:focus {
        background-color: #6d0341; }
    .menu li:first-child a {
      -webkit-border-top-left-radius: 8px;
      -webkit-border-top-right-radius: 8px; }
    .menu li:last-child a {
      border-bottom: 0;
      -webkit-border-bottom-left-radius: 8px;
      -webkit-border-bottom-right-radius: 8px; }
  .menu .fastfood a {
    background: url(iphone/fastfood-icon.png) 10px 13px no-repeat;
    padding-left: 42px; }
  .menu .restaurants a {
    background: url(iphone/restaurant-icon.png) 15px 11px no-repeat;
    padding-left: 42px; }

.main.menu {
  background: #14899d; }
  .main.menu li a {
    border-color: #0f5b6b; }
    .main.menu li a:active, .main.menu li a:focus {
      background: #14899d; }

.collapsable {
  background: #14899d; }
  .collapsable li a {
    border-color: #0f5b6b; }
    .collapsable li a.open {
      border-bottom: 0; }
      .collapsable li a.open:after {
        background-image: url(iphone/collapse.png);
        width: 13px;
        height: 8px;
        top: 16px;
        right: 13px; }
    .collapsable li a:active, .collapsable li a:focus {
      background: #14899d;
      color: white !important; }
  .collapsable ol {
    background: #a1ccd5;
    border: 2px solid #14899d;
    border-top: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    display: none; }
  .collapsable li:last-child ol, .collapsable li:last-child ul {
    border-bottom: 0; }
  .collapsable ol li a {
    color: #484848;
    border-bottom: 2px solid #14899d;
    padding: 10px 8px;
    border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important; }
  .collapsable ol a:after {
    background-image: url(iphone/go-black.png); }
  .collapsable ol li:last-child a {
    border-bottom: 0; }
  .collapsable li:last-child ol li:last-child a, .collapsable li:last-child ul li:last-child a {
    border-bottom: 2px solid #14899d; }
  .collapsable.restaurants {
    background: #484848; }
    .collapsable.restaurants li a {
      color: white;
      border-color: black; }
      .collapsable.restaurants li a:active, .collapsable.restaurants li a:focus {
        background: black; }
    .collapsable.restaurants ol {
      background: #f4f4f4;
      border-color: #484848; }
      .collapsable.restaurants ol li {
        height: 20px;
        margin: 0;
        padding: 20px 10px 0 10px;
        font-size: 12px;
        position: relative; }
      .collapsable.restaurants ol a {
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        padding: 5px 30px 15px 35px;
        height: 20px;
        color: black;
        font-weight: bold;
        text-decoration: none;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        width: 230px;
        font-size: 16px; }
        .collapsable.restaurants ol a:focus, .collapsable.restaurants ol a:active {
          font-size: 20px;
          line-height: 34px;
          font-weight: normal; }
      .collapsable.restaurants ol .rating {
        display: block;
        position: absolute;
        width: 25px;
        height: 26px;
        line-height: 26px;
        text-align: center;
        color: white;
        font-size: 12px;
        background: url(iphone/company-rating.png) top left no-repeat;
        font-weight: normal;
        position: absolute;
        top: 8px;
        left: 3px; }
      .collapsable.restaurants ol address {
        display: block;
        font-style: normal;
        margin: 0 0 0 25px;
        padding: 0 15px 0 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis; }
    .collapsable.restaurants li:last-child ol li:last-child a, .collapsable.restaurants li:last-child ul li:last-child a {
      border-color: #484848; }

#search fieldset {
  margin: 10px;
  padding: 10px;
  border: 0;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  background: #9e1565; }
  #search fieldset p {
    margin: 0;
    padding: 0; }
  #search fieldset input[type=text] {
    border: 3px solid #6d0341;
    height: 24px;
    margin: 0;
    padding: 4px 0 0 30px;
    color: #999999;
    font: italic 18px/26px Georgia, sans-serif;
    background: url(iphone/query.png) top left no-repeat;
    width: 165px; }
  #search fieldset input[type=submit] {
    width: 75px;
    height: 37px;
    background: url(iphone/search-button.png) top left no-repeat;
    border: 0;
    text-indent: -3000em;
    float: right;
    margin: 1px 0 0 0;
    position: relative;
    z-index: 10; }

.toplist {
  margin: 10px;
  padding: 0;
  list-style: none;
  background: white;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px; }
  .toplist li {
    display: block;
    margin: 0;
    padding: 20px 10px 0 10px;
    color: #484848;
    border-bottom: 2px solid #f4f4f4;
    position: relative;
    height: 20px; }
    .toplist li:last-child {
      border-bottom: 0; }
    .toplist li a {
      display: block;
      position: absolute;
      left: 0;
      top: 0;
      padding: 5px 30px 15px 10px;
      height: 30px;
      color: black;
      font-weight: bold;
      text-decoration: none;
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
      width: 250px; }
      .toplist li a img[src*=lekker] {
        position: relative;
        top: 2px; }
      .toplist li a .distance {
        font-size: 12px;
        color: #484848; }
        .toplist li a .distance:after {
          content: " - "; }
      .toplist li a:after {
        display: block;
        content: " ";
        background: url(iphone/go-black.png);
        height: 13px;
        width: 8px;
        position: absolute;
        right: 0;
        top: 15px; }
    .toplist li .extra-info {
      display: block;
      padding: 0 15px 0 0;
      font-size: 12px;
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden; }

.information {
  margin: 10px;
  padding: 10px;
  background: white;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  font-size: 13px; }
  .information table {
    border-collapse: collapse;
    width: 100%;
    border-top: 1px solid #f4f4f4; }
    .information table th, .information table td {
      text-align: left;
      vertical-align: top;
      border-bottom: 1px solid #f4f4f4; }
    .information table ul {
      margin: 0 0 0 19px;
      padding: 0; }

.reviews {
  margin: 0;
  padding: 0;
  list-style: none; }

.review {
  margin: 10px 10px -5px 10px;
  padding: 10px;
  background: #faf4f8;
  border: 1px solid #9e1364;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px; }
  .review h3 {
    margin: -5px 0 5px 0;
    padding: 0;
    font-weight: bold;
    color: #9e1364;
    font-size: 14px;
    position: relative; }
    .review h3 .rating {
      position: absolute;
      right: -5px;
      top: 0;
      display: block;
      width: 25px;
      height: 26px;
      font-size: 12px;
      line-height: 26px;
      font-weight: normal;
      text-align: center;
      color: white;
      background: url(iphone/company-rating.png) center center no-repeat; }
  .review blockquote {
    margin: 0;
    padding: 0;
    font-size: 12px; }
    .review blockquote .description p {
      margin: 0 0 5px 0; }
    .review blockquote .metadata {
      color: #9e1364;
      margin: 10px 0 -5px 0;
      font-weight: bold;
      text-align: right; }
    .review blockquote .scores {
      color: black; }

.pages {
  overflow: hidden;
  margin: 0 -10px 0 -10px;
  width: auto;
  font-size: 12px;
  text-align: center; }
  .pages span {
    display: inline-block;
    padding: 6px 5px 0px 0; }
  .pages a, .pages .current, .pages .disabled {
    display: inline-block;
    border: 1px solid #e6e6e6;
    padding: 2px 8px;
    margin: 2px;
    line-height: 16px;
    text-decoration: none;
    background: white;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px; }
  .pages .current, .pages a:hover {
    background: #b74b8b;
    border-color: #9e1465;
    color: white;
    font-weight: bold; }
  .pages .disabled {
    color: #aaaaaa; }

#new_review fieldset {
  margin: 10px;
  padding: 30px 10px 10px 10px;
  border: 0;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  background: white;
  position: relative; }
  #new_review fieldset legend {
    position: absolute;
    z-index: 10;
    top: 10px;
    display: block;
    margin: 0;
    padding: 0;
    width: 280px;
    color: black;
    font-size: 24px;
    font-weight: normal;
    text-align: center;
    text-shadow: #484848 1px 1px 1px; }
  #new_review fieldset dt {
    display: block;
    color: black; }
  #new_review fieldset dd {
    display: block;
    margin: 4px 0; }
  #new_review fieldset input[type=text], #new_review fieldset textarea {
    width: 265px;
    padding: 4px;
    max-height: 126px;
    font-size: 12px;
    color: #484848; }
  #new_review fieldset input[type=submit] {
    width: 260px;
    display: block;
    margin: 9px auto 0 auto;
    font-size: 20px;
    font-weight: bold; }
#new_review table {
  margin: 0 -7px; }
  #new_review table th {
    font-size: 11px;
    font-weight: normal;
    text-align: right;
    color: black; }
  #new_review table thead th {
    text-align: center;
    font-weight: bold;
    font-size: 10px; }

dt.score {
  display: block;
  height: 20px; }

dd.score {
  display: block;
  height: 20px;
  margin-top: -20px !important;
  padding-left: 60px; }
  dd.score select {
    width: 80px; }

#login fieldset {
  margin: 10px;
  padding: 30px 10px 10px 10px;
  border: 0;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  background: white;
  position: relative; }
  #login fieldset legend {
    position: absolute;
    z-index: 10;
    top: 10px;
    display: block;
    margin: 0;
    padding: 0;
    width: 280px;
    color: black;
    font-size: 24px;
    font-weight: normal;
    text-align: center;
    text-shadow: #484848 1px 1px 1px; }
  #login fieldset dt {
    display: block;
    color: black; }
  #login fieldset dd {
    display: block;
    margin: 4px 0; }
  #login fieldset input[type=text], #login fieldset input[type=password] {
    width: 265px;
    padding: 4px;
    max-height: 126px;
    font-size: 12px;
    color: #484848; }
  #login fieldset textarea {
    width: 265px;
    padding: 4px;
    max-height: 126px;
    font-size: 12px;
    color: #484848; }
  #login fieldset input[type=submit] {
    width: 260px;
    display: block;
    margin: 9px auto 0 auto;
    font-size: 20px;
    font-weight: bold; }

#profile {
  margin: 10px;
  padding: 10px;
  border: 0;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  background: white;
  position: relative;
  width: 280px; }
  #profile #avatar {
    float: left; }
  #profile #information {
    float: left;
    padding-left: 10px; }
    #profile #information p.name {
      font-weight: bold;
      font-size: 20px;
      margin: 0; }
    #profile #information p.more {
      font-size: 14px;
      margin: 0; }

.add-friend, .remove-friend {
  margin: 10px 10px 10px 10px !important;
  border: none;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  width: 300px;
  text-align: left;
  background: url(iphone/go.png) 282px 14px no-repeat #9e1565;
  display: block;
  margin: 0;
  padding: 10px 25px 10px 10px;
  font-size: 20px;
  color: white;
  text-decoration: none;
  position: relative;
  font-weight: bold;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden; }

.add-friend:hover, .remove-friend:hover {
  text-decoration: none;
  cursor: pointer; }

.menu li form {
  display: inline-block;
  background: url(iphone/go.png); }
.menu li input[type=submit] {
  width: 300px;
  text-align: left;
  background: url(iphone/go.png) 282px 14px no-repeat #9e1565;
  border: none;
  display: block;
  margin: 0;
  padding: 10px 25px 10px 10px;
  font-size: 20px;
  color: white;
  text-decoration: none;
  border-bottom: 2px solid #6d0341;
  position: relative;
  font-weight: bold;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden; }
  .menu li input[type=submit]:active, .menu li input[type=submit]:focus {
    background-color: #6d0341; }
  .menu li input[type=submit]:hover {
    cursor: pointer; }
.menu li:first-child input[type=submit] {
  -webkit-border-top-left-radius: 8px;
  -webkit-border-top-right-radius: 8px; }
.menu li:last-child input[type=submit] {
  border-bottom: 0;
  -webkit-border-bottom-left-radius: 8px;
  -webkit-border-bottom-right-radius: 8px; }

#friends li a {
  padding: 8px; }

#buzz .collapsable {
  background: #14899d; }

.collapsable li a {
  border-color: #0f5b6b; }
  .collapsable li a.open {
    border-bottom: 0; }
    .collapsable li a.open:after {
      background-image: url(iphone/collapse.png);
      width: 13px;
      height: 8px;
      top: 16px;
      right: 13px; }
  .collapsable li a:active, .collapsable li a:focus {
    background: #14899d;
    color: white !important; }
.collapsable ol {
  background: #a1ccd5;
  border: 2px solid #14899d;
  border-top: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  display: none; }
.collapsable li:last-child ol, .collapsable li:last-child ul {
  border-bottom: 0; }
.collapsable ol li a {
  color: #484848;
  border-bottom: 2px solid #14899d;
  padding: 10px 8px;
  border-radius: 0px !important;
  -moz-border-radius: 0px !important;
  -webkit-border-radius: 0px !important; }
.collapsable ol a:after {
  background-image: url(iphone/go-black.png); }
.collapsable ol li:last-child a {
  border-bottom: 0; }
.collapsable li:last-child ol li:last-child a, .collapsable li:last-child ul li:last-child a {
  border-bottom: 2px solid #14899d; }

ol#buzz li {
  border-bottom: 1px solid #0f5b6b;
  height: 40px;
  overflow: hidden; }
  ol#buzz li.friendship-activity span.activity {
    padding-left: 20px; }
  ol#buzz li.favourite-activity span.activity {
    background: url(img/favourites-icon.png) 5px 5px no-repeat; }
  ol#buzz li.friendship-activity a {
    padding: 8px; }
  ol#buzz li.friendship-activity span.avatar {
    float: left; }
  ol#buzz li span.head {
    line-height: 10px; }
  ol#buzz li span.by {
    font-size: 9px;
    display: block;
    font-style: normal;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
  ol#buzz li span.details {
    float: left; }
    ol#buzz li span.details span.head {
      line-height: 10px;
      margin: 0 0 0 8px; }
    ol#buzz li span.details span.by {
      font-size: 9px;
      display: block;
      font-style: normal;
      margin: 0 0 0 8px;
      padding: 0 15px 0 0;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis; }
  ol#buzz li span.activity {
    display: block;
    padding-left: 32px; }
  ol#buzz li.review-activity span.activity {
    background: url(img/reviews-icon.png) 2px 4px no-repeat; }
  ol#buzz li.comment-activity {
    background: #a1ccd5;
    display: block;
    margin: 0;
    height: 30px !important;
    padding: 10px 25px 0 10px;
    font-size: 20px;
    color: #484848;
    text-decoration: none;
    position: relative;
    font-weight: bold;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden; }
    ol#buzz li.comment-activity span.activity {
      background: url(img/reviews-icon.png) 2px 4px no-repeat; }

li.dummy {
  background: #a1ccd5;
  display: block;
  margin: 0;
  height: 30px !important;
  padding: 10px 25px 0 10px;
  font-size: 20px;
  color: #484848;
  text-decoration: none;
  border-bottom: 2px solid #6d0341;
  position: relative;
  font-weight: bold;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden; }

.clearfix {
  display: inline-block; }
  .clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0; }

html[xmlns] .clearfix {
  display: block; }

* html .clearfix {
  height: 1%; }

#map {
  width: 285px;
  height: 214px;
  margin: 10px auto;
  background: white;
  border: 8px solid white;
  list-style: none;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px; }

#directions {
  margin: 10px auto;
  width: 290px;
  font-size: 90%;
  background: white;
  list-style: none;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px; }
