/* --- SPOKESMAN MOBILE STYLES ---- */
body {font-size: 14px; color: #111; font-family: "Lucida Grande", "Trebuchet MS", Arial, sans-serif; background-color: #fff; line-height: 1.5; margin: 0; padding: 0; background-color: #272a2b;}

#header, #footer {text-align: center; overflow: hidden; padding: 10px 15px 10px 15px; overflow: hidden; display: block; color: #fff; border-bottom: 1px solid #1a1a1a; font-size: 16px; margin: 0;}
#header, #footer {background: #272A2B; background: -moz-linear-gradient(top, #454848 0%, #363A3A 33%, #272A2B 67%, #272A2B 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#454848), color-stop(33%,#363A3A), color-stop(67%,#272A2B), color-stop(100%,#272A2B)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#454848', endColorstr='#272A2B',GradientType=0 );}
#footer {padding: 10px 15px 25px 15px; font-weight: normal; font-size: 14px; color: #aaa}
#content {background-color: #fff; padding-bottom: 35px; overflow: hidden;}

#header a {border: none; text-decoration: none; color: #aaa; font-size: 14px;}
#header a img {border: none; width: 200px;}
#header-nav, #footer-nav {position: relative; height: 22px; overflow: hidden; display: block; color: #fff; border-bottom: 1px solid #1a1a1a; margin: 0;}
#header-nav, #footer-nav {background: #353A3B; background: -moz-linear-gradient(top, #5E6263 0%, #4A4F50 33%, #353A3B 67%, #353A3B 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5E6263), color-stop(33%,#4A4F50), color-stop(67%,#353A3B), color-stop(100%,#353A3B)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5E6263', endColorstr='#353A3B',GradientType=0 );}
#header-nav .nav-leader, #footer-nav .nav-leader {float: left; vertical-align: top; padding: 0; margin-right: 5px;}
#header-nav .browse-button, #footer-nav .browse-button {float: right; vertical-align: top;}

h1,h2,h3,h4,h5,h6 {font-weight: bold; margin: 10px 0 5px;}
h1 {font-size: 21px;}
h2 {font-size: 18px;}
.box-package h2 {margin-top: 0;}
h3 {font-size: 16px;}
.simple-box h3 {margin-top: 0;}
h4 {font-size: 14px;}
h4.subhead {font-weight: normal; margin: 0 0 10px 0;}
h5 {font-size: 12px;}
h6 {font-size: 10px;}
.list-header {border-bottom: 1px solid #ccc; padding-bottom: .33em; margin-bottom: .5em;}

a {outline: none; outline-width: 0; color: #9a3d3d; font-weight: bold;}
#footer a {text-shadow: none; color: #e3e3e3; font-weight: normal;}
a.nohlt, a.nohlt:hover {border: none; text-decoration: none;}
hr {margin: 10px 15px; border: none; border-top: 1px solid #ccc;}
ul {list-style-position: inside; padding-left: 3px;}

.pubdate, .byline, .caption, .photo-credit {font-size: 12px;}
.pubdate {font-weight: bold; border-top: 1px solid #ccc;}
#gallery .pubdate {border-top: none 0; border-bottom: 1px solid #ccc;}
.searchbox-filter {font-weight: bold; font-size: 12px; padding-top: 10px;}
.message, ul.errorlist li {border: 1px solid #ccc; border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px; background-color: #eee; font-weight: bold; font-size: 12px; margin: 15px; padding: 10px;}
ul.errorlist {list-style: none; margin: 5px 0; padding: 0;}
ul.errorlist li {margin: 0 0 5px 0; color: #9a3d3d; display: inline-block; padding: 5px 8px;}
.footer-message {font-size: 12px; background-color: #fff; padding-bottom: 20px; text-align: center;}

.detail, .nav-detail {color: #aaa; margin: 0; padding: 3px 0 0 0; font-size: 12px;}
.detail p {margin-top: 0;}
.detail strong, .nav-detail strong {color: #fff; font-weight: normal; font-size: 14px; margin-right: 5px;}
.nav-detail {margin-top: 3px;}

/* --- IMAGES --- */
li.gallery-list-item img {float: left; margin: 0 10px 0 -70px; height: 45px; width: 60px; border: none; }
.photo-package, .box-package {margin: 15px -5px; padding: 10px; border-radius: 8px; -moz-border-radius: 8px; -khtml-border-radius: 8px; color: #3d3d3d; background-color: #eee; overflow: hidden; clear: both;}
.photo-package img, .blogpost-photo img, .staticmap, img.lead-promo-image {border: none; width: 100%; max-width: 750px; height: auto; margin: 0 auto; display: block;}
.blogpost-content p img {float: left; margin: 2px 10px 5px 0;}
.photo-credit {text-align: right;}
.caption, .photo-credit {margin: 3px 0 0;}

/* --- LISTS --- */
.divider {background-color: #494f51; display: block; color: #fff; border-bottom: 1px solid #1a1a1a; margin: 0; font-weight: normal; font-size: 14px; overflow: hidden;}
.divider {background: #494F51; background: -moz-linear-gradient(top, #818686 0%, #656C6E 33%, #494F51 67%, #494F51 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#818686), color-stop(33%,#656C6E), color-stop(67%,#494F51), color-stop(100%,#494F51)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#818686', endColorstr='#494F51',GradientType=0 );}
.divider-space-below {margin-bottom: 18px;}
.divider a {color: #fff; display: block; text-decoration: none; font-weight: normal;}
.divider a:hover {background: #272A2B; background: -moz-linear-gradient(top, #454848 0%, #363A3A 33%, #272A2B 67%, #272A2B 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#454848), color-stop(33%,#363A3A), color-stop(67%,#272A2B), color-stop(100%,#272A2B)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#454848', endColorstr='#272A2B',GradientType=0 );}
.divider a.title-link {display: inline;}
.divider a.title-link:hover {background:none;}
.divider a span.fwd-link {margin-top: 2px;}
.divider .right-bigarrow {float: right; height: 11px; width: 7px; margin: 5px 0 0 0; background: url(../img/mobile/rt-bigarr-gray.png) no-repeat 0 0;}


.button-list {list-style: none; padding: 0; margin: 0 0 10px 0; overflow: hidden; font-size: 12px;}
.button-list li {padding: 0; margin: 0; overflow: hidden;}
.button-list li a, .button-list li p, .item-list li a.item-button, a.map-link, .simple-box, .simple-white-box {display: block; text-decoration: none; overflow: hidden; background-color: #eee; border: 1px solid #ccc; border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px; font-weight: bold; margin: 10px 15px 0; padding: 10px;}
.simple-box {margin: 0;}
.simple-white-box {margin: 0; background-color: #fff; font-size: 12px; font-weight: bold; padding-bottom: 0;}
.simple-white-box p {margin: 0 0 10px;}
.button-list li a, .item-list li a.item-button, a.map-link {font-size: 16px; padding: 5px 8px;}
.item-list li a.item-button, a.map-link {margin-bottom: 10px;}
.button-list li a:hover, .button-list li a:active, .item-list li a.item-button:hover, .item-list li a.item-button:active, a.map-link:hover, a.map-link:active {background-color: #e3e3e3;}
.split-button-list {padding: 15px 15px 0; margin: 0;}
li.split-button {display: inline-block; width: 48%;}
li.split-button a, li.split-button p, li.small-button a, li.small-button p {padding: 5px 8px; font-size: 12px;}
li.split-button a, li.split-button p {margin: 0;}
.bullet-list li {margin-bottom: .5em;}

.item-list {list-style: none; padding: 0; margin: 0; overflow: hidden;}
.item-list li {padding: 0; margin: 0; border-bottom: 1px solid #ccc; font-size: 16px; overflow: hidden;}
.item-list li a, .item-list li p {display: block; text-decoration: none; overflow: hidden; font-weight: bold;}
.item-list li a:hover, .item-list li a:active {background-color: #eee;}
li span.date {float: right; font-weight: bold; font-size: 11px; padding: 6px 0 4px 0; color: #aaa; margin-left: 10px;}
li span.alert {background-color: #ccc; color: #353a3b; padding: 0px 4px 1px 4px; margin-right: 4px; vertical-align: 25%; font-weight: normal; font-size: 9px; border-radius: 3px; -moz-border-radius: 3px; -khtml-border-radius: 3px;}
li a.spokane7-link {background: url(../img/mobile/mobile_spokane7_logo_sm.png) no-repeat 15px 50%; text-indent: 21px;}
li a.map-link {background: #eee url(../img/mobile/placemark-gray-16x16.png) no-repeat 5px 55%; text-indent: 17px; font-size: 12px;}
li a.fb-link {background: url(../img/mobile/facebook-16x16.png) no-repeat 15px 50%; text-indent: 21px;}
li a.tw-link {background: url(../img/mobile/twitter-16x16.png) no-repeat 15px 50%; text-indent: 21px;}
.small-button {font-size: 12px;}

#nearby-li {text-align:center;margin:0 !important;padding:0 !important}
#nearby-li a {text-align:left;width:40%;display:inline-block !important;overflow:hidden;margin-right:0 !important;margin-left:0 !important;}

.striped-list .even {background-color: #e3e3e3;}

/* --- BUTTONS --- */
a.button, .filter-button, .go-button, .form-button {display: inline-block; padding: 0 5px; border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px; background-color: #9a3d3d; color: #fff; text-decoration: none; font-size: 12px;}
a.button:hover, a.button:active, a.filter-button:hover {background: none; background-color: #762f2f;}
.browse-button {float: right; margin: 2px 0 0 5px;}
.fwd-button, .back-button, .up-button, .down-button {background: transparent url(../img/mobile/arw_rt.png) no-repeat 95% 65%; padding: 0 20px 0 5px !important;}
#header-nav .button, #footer-nav .button, .form-button {border: 1px solid #1a1a1a;}

.filter-group {float: right;}
.filter-button {color: #888; background-color: #1a1a1a; font-size: 11px;  border: 1px solid #1a1a1a; margin-left: 4px;}
.filter-button-active, .go-button {background-color: #777; font-weight: bold; color: #fff; text-shadow: 0 1px 1px #1a1a1a;}
.go-button, .right-button {float: right; margin: 3px 0 0 10px;}
.go-button {background: #777;}
p .go-button {margin-top: 1px;}
a.go-button:hover, a.go-button:active {background-color: #1a1a1a;}

.up-button {background-image: url(../img/mobile/arw_up.png);}
.down-button {background-image: url(../img/mobile/arw_down.png);}
.back-button {background-image: url(../img/mobile/arw_lft.png); background-position: 2% 65%; padding: 0 5px 0 15px !important;}

.share-buttons {display: block; overflow: hidden; font-size: 12px;}
a.share-button {display: inline-block; text-decoration: none; text-align: center; background-color: #e3e3e3; border: 1px solid #ccc; border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px; font-weight: bold; width: 48%; padding: 5px 0; color: #1a1a1a;}
span.fb-link {background: url(../img/mobile/facebook-16x16.png) no-repeat 0 50%; padding: 2px 0 2px 21px;}
span.tw-link {background: url(../img/mobile/twitter-16x16.png) no-repeat 0 50%; padding: 2px 0 2px 21px;}
a.share-button:hover, a.share-button:active {background-color: #eee;}

.detail-buttons {margin: 0; padding: 0; font-size: 12px; overflow: hidden;}
.detail-button {margin: 15px 0; background-color: #888; overflow: hidden; border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px;}
.detail-button .detail-type {float: left; padding: 7px 0; width: 80px; background-color: #888; color: #111; vertical-align: top; -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; border-top-left-radius: 4px; border-bottom-left-radius: 4px;}
.detail-button .detail-type strong {padding: 0 10px;}
.detail-button .detail-info {padding-left: 80px;}
.detail-button .detail-info a {display: block; text-decoration: none; background-color: #e3e3e3; padding: 7px 9px 7px 10px; background-color: #e3e3e3; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px;}
.detail-button .detail-info a:hover, .detail-button .detail-info a:active {background-color: #eee;}
.detail-button .right-bigarrow {float: right; margin: 3px 0 0 0; background: url(../img/mobile/rt-bigarr-red.png) no-repeat 0 0;}

/* --- SPACING & PADDING --- */
#header-nav, #footer-nav {padding: 5px 15px;}
.page-inset, .pagination, .inset {padding: 0 15px;}
#story, #gallery, #blogpost {padding: 15px;}
#story h1, #gallery h1, #blogpost h1 {margin-top: 0;}
.page-block {padding: 15px;}
#story .mobile-ad, #gallery .mobile-ad, #blogpost .mobile-ad, .page-block .mobile-ad, .weather-block  .mobile-ad {margin-left: 0; margin-right: 0;}

.divider, .divider a {padding: 6px 15px 5px;}
.divider a {margin: -7px -15px -5px -15px;}
.item-list li a, .item-list li p {padding: 8px 15px;}
li.gallery-list-item a {padding: 12px 15px; padding-left: 85px;}
.byline, .pubdate, .description, .extra {margin: 0; padding: 5px 0; overflow: hidden;}
.story-factbox, .story-media {margin-top: 15px;}

/* --- SHADOWS --- */
#header, #footer, #header-nav, #footer-nav, .divider, a.button, .pagination a, .form-button {text-shadow: #000 0 1px 1px;}
.photo-package .caption, .box-package .caption, .share-buttons {text-shadow: #fff 0 1px 0;}
.photo-package, .box-package {border: 1px solid #ccc; box-shadow: 0 1px 2px rgba(0,0,0,0.15); -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.15); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15);}
li.gallery-list-item img, img.lead-promo-image {box-shadow: 0 1px 2px rgba(0,0,0,0.5); -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.5); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.5);}
.divider, #header-nav {box-shadow: 0 1px 2px rgba(0,0,0,0.5); -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.5); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.5);}

/* --- PAGINATION --- */
.pagination {list-style: none; overflow: hidden; clear: both;}
.pagination li {margin-right: 5px; float: left;}
.pagination a {display: inline-block; color: #fff; background-color: #353a3b; padding: 0 5px; border: 1px solid #111; border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px; text-decoration: none; font-weight: normal; font-size: 12px;}
.pagination li.next a {background: #353a3b;}
.pagination li.prev a {background: #353a3b;}
.pagination a.current, .pagination a.current:hover, .pagination a:hover {background-color: #272A2B !important;}
.pagination li.next {float: right; margin-right: 0;}

/* --- WEATHER --- */
.temp-set {font-weight: bold; overflow: hidden; font-size: 15px; margin: 0; padding: 0 15px; height: 60px; line-height: 1;}
.temp-set .temp-day {display: inline-block; margin-right: 10px; width: 120px; vertical-align: top; padding-top: 15px;}
.temp-set .temp-img {display: inline-block; margin-right: 10px; width: 50px; padding-top: 5px;}
.temp-set .temp-img img {width: 50px; height: 50px; border: 0;}
.temp-set .temp-high {display: inline-block; font-size: 24px; vertical-align: top; padding-top: 20px;}
.temp-set .temp-low {font-size: 18px; color: #999; padding: 6px 0 0 6px;}
.temp-set .temp-conditions {clear: both; display: block; font-size: 11px; font-weight: normal; margin-top: 3px;}
.temp-set .big-temp {font-size: 32px; padding: 15px 0 0 10px;}
.temp-extra {overflow: hidden; text-align: center; font-size: 11px; font-weight: normal; padding: 10px 0;}
.temp-extra-container {max-width: 290px;}
.temp-extra span {display: inline-block; margin: 0 12px;}
a.temp-set {display: block; color: inherit; text-decoration: none;}
a.temp-set:hover, a.temp-set:active {background-color: #eee;}

/* --- FORMS & TABLES --- */
form {overflow: hidden;}
form.filter {font-size: 12px; font-weight: bold;}
form.filter input {display: inline-block;}
form.map {background: transparent url(../img/mobile/placemark-dark-16x16.png) no-repeat 15px 12px; padding-left: 35px;}
form.groups {padding-top: 5px;}
form span.group {float: left; margin-right: 5px; padding-top: 5px;}
form span.last-group {margin-right: 0;}
form label {font-weight: bold;}
form textarea {width: 100%;}
form .submit {padding: 3px 8px;}

table {border: 0; width: 100%; border-collapse: collapse;}
table.form-fields td {padding: 5px 0; vertical-align: top;}

/* --- COMMENTS --- */
#comments {border-top: 1px solid #ccc; margin: 5px 15px 0;}
#comment-form form {padding: 0 15px;}
ul.comment-list {list-style: none; margin: 5px -5px 0; padding: 0 5px; overflow: hidden; font-size: 12px;}
.comment-list li.comment-list-item {margin: 15px -5px; padding: 10px; border: 1px solid #ddd; border-top-color: #eee; border-radius: 8px; -moz-border-radius: 8px; -khtml-border-radius: 8px; color: #333; background-color: #eee; overflow: hidden; clear: both;}
.comment-list li p {margin-bottom: 0;}
.comment-list .comment-person {font-weight: bold; margin-bottom: 0;}

/* --- ADS --- */
body.mobile-ad-body #content {background-color: #111; color: #ddd;}
#mobile-ad-campaign {padding: 10px 15px;}
#mobile-ad-campaign h1 {color: #fff; text-shadow: #888 0 1px 1px; border-bottom: 1px solid #888; margin-bottom: 0; padding-bottom: 3px;}
#mobile-ad-campaign h2 {border-top: 1px solid #333; font-size: 16px; margin-top: 0; padding-top: 3px;}
img.ad-campaign-image {border: none; width: 100%; max-width: 750px; height: auto; margin: 0 auto; display: block;}


.mobile-ad {clear: both; margin: 15px 15px 0; overflow: hidden; height: 40px; text-align: center;}
.mobile-ad a {display: block; font-weight: normal; border: 0; border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px; font-size: 10px; text-decoration: none; background-color: #e3e3e3; color: #111; overflow: hidden; position: relative; padding: 3px 4px 4px 48px; white-space: nowrap; text-align: left;}
.mobile-ad a.image-ad {display: block; background-color: inherit; padding: 0; margin: 0 auto; border-radius: 0; -moz-border-radius: 0; -khtml-border-radius: 0;}
.mobile-ad a.image-ad img {border: 0;}
.mobile-ad a strong {font-size: 11px; white-space: nowrap; text-shadow: #fff 0 1px 0; margin-bottom: 1px;}
.mobile-ad a span.big-title {font-size: 14px; font-weight: bold; white-space: nowrap; text-shadow: #fff 0 1px 0; display: inline-block; padding: 6px 0 6px 4px;}
.mobile-ad a:hover, .mobile-ad a:active {color: #9a3d3d;}
.ad-distance-details {clear: both; float: right; font-weight: bold; font-size: 10px; padding: 3px 20px 10px 0; color: #bbb;}
.bottom-ad-under-list {margin-bottom: 0; margin-top: 30px;}
.top-ad-slot {margin-bottom: 15px;}
.right-bigarrow {float: right; height: 11px; width: 7px; margin: 11px 6px 0 0; background: url(../img/mobile/rt-bigarr.png) no-repeat 0 0;}
.mobile-ad-data {position:absolute;top:0;left:0;width:1px;height:1px;opacity:0;filter:alpha(opacity=0);}

/* --- MISC --- */
a.message:hover, a.message:active {background-color: #ddd;}
.top-border {border-top: 1px solid #ccc;}
.full-width-container {width: 100%;}
.space-above {margin-top: 15px;}
.space-below {margin-bottom: 15px;}
.big-space-below {margin-bottom: 30px;}
.only-space-below {margin-top: 0; margin-bottom: 15px;}
.center {text-align: center;}
.top {margin-top: 0;}
.bottom {margin-bottom: 0;}
.big {font-size: 36px;}
.small {font-size: 9px;}
.normal {font-weight: normal;}
.left {float: left;}
.right {float: right;}
.last {margin-right: 0 !important;}