/* Layout for mobile
-------------------------------------------------------------- */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,cite,code,del,dfn,em,img,ins,q,small,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;margin:0;padding:0}article,aside,figure,figure img,figcaption,hgroup,footer,header,nav,section,video,object{display:block}a img{border:0}figure{position:relative}figure img{width:100%}

/* Typography
-------------------------------------------------------------- */

html { font-size:100.01%; }
body {
    font-size: 75%;
    color: #222;
    background: #fff;
    font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
}

/* Headings
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 { font-weight: normal; color: #4d4d4d; font-family: 'Trebuchet MS', sans-serif; }

h1 { font-size: 2.2em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 2em; margin-bottom: 0.75em; }
h3 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1em; font-weight: bold; }

/* Text elements
-------------------------------------------------------------- */

p       { margin: 0 0 1em; }
.left   { float: left !important; }
.right  { float: right !important; }
p .left { margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p .right{ margin: 1.5em 0 1.5em 1.5em; padding: 0; }

a { color: #09c; text-decoration: none; }
a:focus, a:hover { color: #09c; }

strong { font-weight: bold; }
em { font-style: italic; }

/* Common elements
-------------------------------------------------------------- */

.container  { padding: 0 8px; }
.row        { width: 100%; overflow: hidden; }

#header     { background: #009ACF; padding: 1em 0; margin-bottom: 1em; }
#header a   { display: block; color: #fff; font-weight: bold; }
#header img { display: block; float:left; vertical-align: middle; }
#header span { display: block; float:right; vertical-align: middle; line-height: 18px; }

#footer { text-align: center; font-size: 12px; margin: 1em 0; }
#footer a { padding: 3px; margin: 2px; }
#footer .row        { border-top: 1px solid #d9d9d9; padding-top: 1em; }
#footer .location   { margin-bottom: 1em; }
#footer .location #uloc a {
    padding-top: 2px;
    padding-bottom: 0;
    display: inline-block;
    line-height: 16px;
    padding-left: 21px;
    background:url('../../_assets/icons/citymobi/16/location.png') center left no-repeat;
}
#footer .footnav    { margin-bottom: 1em; }
#footer .language   { margin-bottom: 1em; }

#share { margin-bottom: 1em; }

#share a.twit, #share a.fb, #share a.email, #share a.addthis {
    display: block;
    line-height: 16px;
    padding-left: 21px;
}

#share a.twit {
    margin-top: .75em;
    background:url('../img/design/twitter_16.png') center left no-repeat;
}

#share a.fb {
    background:url('../img/design/facebook_16.png') center left no-repeat;
}

#share a.email {
    margin-top: .75em;
    background:url('../img/design/email_16.png') center left no-repeat;
}

#share a.addthis {
    margin-top: .75em;
    background:url('../img/design/addthis_16.png') center left no-repeat;
}

#search input { max-width: 200px; }
#search .submit { position: relative; top: 1px; }

/* Navbars
-------------------------------------------------------------- */

.navigation { margin-bottom: 1em; font-size: 14px; line-height: 19px; }

.navigation .row {
    border-bottom: 1px solid #ddd;
    padding-bottom: .75em;
}

.navigation a.active {
    padding: 0 8px 0 0;
    margin: 0 5px 0 0;
    border-right: 1px dotted #ccc;
    font-weight: bold;
    color: #222;
}

.navigation a {
    padding: 0 8px 0 0;
    margin: 0 5px 0 0;
    border-right: 1px dotted #ccc;
}

.navigation a.last {
    padding: 0;
    margin: 0;
    border-right: 0;
}

.mininav_right {
    text-align: right;
    margin-bottom: 1em;
}

/* Buttons (base styles)
-------------------------------------------------------------- */

.buttons { clear: both; }

.buttons a {
    display: block;
    padding: 0.75em 8px;
}

.buttons .button {
    display: table;
    table-layout: fixed;
    width: 100%;
}

.buttons .button .left_col {
    display: table-cell;
    vertical-align: middle;
    width: 40px;
    padding-right: 0.75em;
}

.buttons .button .left_col img { display: block; float:left; }

.buttons .button .right_col_ico {
    display: table-cell;
    vertical-align: middle;
    width: 40px;
    padding-left: 0.75em;
    text-align: right;
}

.buttons .button .right_col_ico img { display: block; float:right; }

.buttons .button .right_col_txt {
    display: table-cell;
    vertical-align: middle;
    width: 50px;
    padding-left: 0.75em;
    text-align: right;
    position: relative;
    top: 1px;
}

.buttons .button .middle_col {
    display: table-cell;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: top;
}

.buttons .button .heading {
    font-size: 16px;
    font-weight: bold;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
    top: 1px;
}

.buttons .button .subtext {
    display: block;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    margin-top: 0.25em;
    color: #999;
}

.buttons h2.title {
    padding: 0 8px;
    margin: 0;
    color: #4d4d4d;
}

.buttons a { background: #fff; }
.buttons a:hover { background: #eee; }
.buttons a.highlight  { background:#d9f0f8; }
.buttons a.highlight:hover  { background:#b2e1f1; }

/* Buttons (custom styles)
-------------------------------------------------------------- */
.buttons.alpha { margin-bottom: 1em; }

.buttons.alpha a {
    color: #4d4d4d;
    margin-bottom: 2px;
    background: #EAF2FA;
}

.buttons.alpha a.last {
    margin-bottom: 0;
}

.buttons.browse { margin-bottom: 1em; }

.buttons.browse a {
    color: #4d4d4d;
    margin-bottom: 2px;
    background: #EAF2FA;
}

.buttons.browse a.last {
    margin-bottom: 0;
}

.buttons.browse a.highlight  { background: #b2e1f1; }
.buttons.browse a.highlight:hover  { background: #b2e1f1; }

.buttons.browse .button .right_col_txt {
    width: 70px;
}

.buttons.browse .button .left_col {
    width: 58px;
}

.buttons.browse .ico-box-24 {
    width:22px;
    height:22px;
    padding:13px;
    background:#FFF;
    border:2px solid #DDD;
    border-radius:5px;
}

/* Thumbnail Gallery
-------------------------------------------------------------- */

.thumb_gallery { margin-bottom: 1em; }
.thumb_gallery img { display: block; }
.thumb_gallery a { float: left; margin: 0 0.25em 0.25em 0; }

/* Pagination & Sort
-------------------------------------------------------------- */

#pagination { margin-bottom: 1em; }

.pag_prev { width: 20%; float: left; }
.pag_next { width: 20%; float: left; }
.pag_page { width: 60%; float: left; text-align: center; padding: 8px 0; }

.pag_page a, .pag_page span {
    padding: 8px;
    font-size: 1em;
    line-height: 1.4em;
    backgroundX:#f5f5f5;
}

.pag_page span {  }
.pag_page span.elipses {  }

.pag_prev a { float: left; }
.pag_next a { float: right; }

.pag_prev a, .pag_next a {
    padding: 8px 15px 9px;
    cursor: pointer;
    text-align: center;
    display: inline-block;
    font-size: 1em;
    line-height: 1.4em;
    font-weight: bolder;
    color: white;
    background: #09C;
}

#sort { text-align: center; margin-bottom: 1em; }
#sort a, #sort span { padding: 3px; margin: 2px; }

/* Place: Details, Photos, Map, Fix, Reviews
-------------------------------------------------------------- */

.place {
    line-heigh:19px;
}

.place .navigation {
    margin-top: 0;
    margin-bottom: 1em;
    border-bottom: 1px dashed #ddd;
    padding-bottom: .75em;
}

.place .photo {
    margin-bottom: 0em;
}

.place #thumb {
    float: left;
    margin-right: 1em;
    margin-bottom: .5em;
    width: 75px;
    height: 75px;
    overflow: hidden;
}

.place #share {
    float: left;
    margin: 0;
    padding: 0;
    margin-bottom: .5em;
}

.place #photo_desc {
    float: left;
    margin: 0;
}

.place .cats {
    margin-top:.5em;
    margin-bottom: 1em;
    font-weight: bolder;
}

.place .address {
    margin-bottom: 1em;
}

.place .opentable {
    margin-bottom: 1em;
    font-weight: bolder;
}

.place .opentable a {
    display: block;
    min-width: 100px;
    text-align: center;
    float: left;
    margin: 0 5px 4px 0;
    padding: 3px 8px;
    background: #09C;
    color:#fff;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

.place .contact {
    margin-bottom: 1em;
}

.place .contact a {
    display: block;
    min-width: 100px;
    text-align: center;
    float: left;
    margin: 0 5px 4px 0;
    padding: 3px 8px;
    background: #f5f5f5;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

.place .openhours {
    margin-bottom: 1em;
}

.place .description {
    margin-bottom: 1em;
}

.place .reviews {
    margin-bottom: 1em;
}

.place .reviews_sum {
    font-weight: bolder;
    margin-bottom:.5em;
}

.place .reviews_sum span {
    margin:0 .5em;
    position: relative;
    top: -3px;
}

.place .reviews .rev_up, .place .reviews .rev_mid, .place .reviews .rev_down {
    background-repeat: no-repeat;
    padding-left: 21px;
}

.place .reviews .rev_up {
    background-image:url('../img/design/up.gif');
}

.place .reviews .rev_mid {
    background-image:url('../img/design/mid.gif');
}

.place .reviews .rev_down {
    background-image:url('../img/design/down.gif');
}

.place .reviews a {
    display: block;
    margin-top: .5em;
    font-weight: bolder;
}

/* Weather
-------------------------------------------------------------- */

.weather { color: #999; margin-bottom: 1em; }
.weather .heading { color: #000; font-size:1.25em; font-weight:bold; }

/* Map
-------------------------------------------------------------- */

.canvas {
    margin-bottom: 1em;
}

.canvas .navigation {
    border-bottom: 0; padding-bottom: 0; margin-bottom: 0;
}

#js_map_canvas { width: 100%; height: 320px; }
#static_map_canvas { }

/* Banners
-------------------------------------------------------------- */

.lb-banner { }
.lb-banner img { display:block; margin: 0 auto; }

/* Misc
-------------------------------------------------------------- */

div.clear { margin: 0; padding: 0; clear: both; }

p.error, p.warning, p.info, p.done { padding:5px; color: #000; }
p.error { border: 1px solid #F6ABAB; background: #FAD0D0; }
p.warning { border: 1px solid #FCEB77; background: #FFF6BF; }
p.info { border: 1px solid #BCDFEF; background: #D1ECF7; }
p.done { border: 1px solid #D0F1A6; background: #E5F8CE; }

strong.heading { display: block; margin-bottom:.25em; font-size: 1.25em; }

.pos_t1 { position: relative; top: 1px; }
.pos_t2 { position: relative; top: 2px; }
.pos_t3 { position: relative; top: 3px; }

.pt1 { padding-top: 1em; }
.pb1 { padding-bottom: 1em; }

.low_link a { color: #ccc; }

.low    { color: #ccc; }
.med    { color: #999; }
.high   { color: #000; }
.orange { color: orange; }

.obscure {
  position: absolute !important;
  left: -9999px;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
}

.label {
  padding: 1px 3px 2px;
  font-size: 9.75px;
  font-weight: bold;
  color: #ffffff;
  text-transform: uppercase;
  background-color: #999999;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  line-height: 18px;
}
.label-important {
  background-color: #b94a48;
}