/** Basic ********************************************************************/

html {
  height:100%;
  -webkit-font-smoothing:antialiased;
}

body {
  padding:0;
  margin:0;
  height:100%;
}

/** Bootstrap Overrides ******************************************************/

* {
  -webkit-border-radius:0 !important;
  -moz-border-radius:0 !important;
  border-radius:0 !important;
}

.badge {
  -webkit-border-radius:10px !important;
  -moz-border-radius:10px !important;
  border-radius:10px !important;
}

.badge-important {
  background-color:#d9534f !important;
}

.navbar-form {
  padding:0 !important;
}

.navbar-header .navbar-form {
  margin-left:0;
  margin-right:0;
}

.navbar-collapse.collapsing .navbar-form,
.navbar-collapse.collapse.in .navbar-form {
  padding:0 15px !important;
}

.navbar-collapse.collapsing .navbar-nav > li > a,
.navbar-collapse.collapse.in .navbar-nav > li > a {
  padding:10px 15px !important;
}

/** Bootstrap Navbar *********************************************************/

#headerContainer {
}

#headerContainer .navbar-static-top {
  border-width:0;
}

#headerContainer .navbar,
#headerContainer .navbar-header,
#headerContainer .navbar-form,
#headerContainer .navbar-collapse {
  box-shadow:none !important;
  -webkit-box-shadow:none !important;
  border:none;
}

#headerContainer .navbar {
  margin-bottom:0;
  background-color:#8ea3bf;
}

#headerContainer .navbar-toggle {
  float:left;
  height:50px;
  width:50px;
  font-size:20px;
  padding:0;
  margin:0;
  color:#ffffff;
  border:none;
}

#headerContainer .navbar-toggle:hover {
  background-color:#c3cbd5;
}

#headerContainer .navbar-collapse.in {
  overflow-y:visible !important;
}

#headerContainer #navQueryGroup {
}

#headerContainer .navbar-brand {
  padding:12px 10px 14px 10px;
  line-height:24px;
  display:block;
}

#headerContainer .navbar .brand img {
  width:189px;
  height:24px;
}

#headerContainer .navbar .nav > li > a {
  color:#ffffff;
  padding:15px 5px 15px 5px;
}

#headerContainer .navbar .nav > li > a:focus,
#headerContainer .navbar .nav > li > a:hover {
  background-color:#c3cbd5;
}

#headerContainer #navQueryText {
  font-weight:bold;
}

#headerContainer .btn {
  padding:6px 10px;
}

#headerContainer .btn.dropdown-toggle {
  padding:6px 5px 6px 10px;
}

/** Bootstrap Dropdown Menu **************************************************/

.scrollable-menu {
  height:auto;
  max-height:400px;
  overflow-x:hidden;
}

.dropdown-menu .dropdownSearch {
  margin-bottom:3px !important;
}

/** Query Form ***************************************************************/

#queryForm .form-group > p {
  margin:0;
  padding:0 0 3px 0;
}

#queryForm .btn-small {
  padding:0;
}

#queryForm .tooltip-inner {
  max-width:300px;
  text-align:left;
}

/** Header/Footer ************************************************************/

div#contentMain {
  min-height:100%;
  height:auto !important;
  height:100%;
  margin:0 auto -30px;
}

div.contentMainGray {
  background-color:#c0c0c0;
}

div#contentFooter,
div#contentPush {
  height:30px;
  margin:0;
  padding:0;
}

div.intro {
  background-color:#8ea3bf;
  color:#ffffff;
  padding:0 10px 4px 10px;
  max-height:100px;
}

div.update {
  background-color:#c3cbd5;
  padding:5px 10px 6px 10px;
  max-height:100px;
}

div#footerContainer {
  background-color:#8ea3bf;
  color:#ffffff;
  text-align:center;
  height:30px;
  line-height:30px;
  overflow-y:hidden;
}

div#footerContainer a:link,
div#footerContainer a:visited {
  color:#ffffff;
}

/** Shared Widget CSS ********************************************************/

.lightIcon {
  opacity:.25;  
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=25)";
  filter:alpha(opacity=25);
}

/** Button Bar CSS ***********************************************************/

.buttonBarContainer {
  padding-top:4px;
  padding-bottom:4px;
  line-height:0;
}

.buttonBarLeftContainer {
  float:left;
  padding-left:3px;
}

.buttonBarRightContainer {
  float:right;
  padding-right:16px;
}

.buttonBarContainer ul.pagination {
  margin:2px;
}

.buttonBarContainer ul.pagination > li > a,
.buttonBarContainer ul.pagination > li > span {
  padding:6px 8px;
  max-width:450px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.buttonBarContainer ul.pagination > li.buttonBarItemContainer > a:focus,
.buttonBarContainer ul.pagination > li.buttonBarItemContainer > a:hover {
  color:#8ea3bf !important;
  background-color:#eeeeee !important;
  border-color:#dddddd !important;
  cursor:pointer;
}

.buttonBarContainer ul.pagination > li.buttonBarItemContainer > a,
.buttonBarContainer ul.pagination > li.buttonBarItemContainer > a:visited,
.buttonBarContainer ul.pagination > li.buttonBarItemContainer > span {
  color:#8ea3bf;
}

.buttonBarContainer ul.pagination > li.buttonBarItemContainer.active > a,
.buttonBarContainer ul.pagination > li.buttonBarItemContainer.active > a:visited,
.buttonBarContainer ul.pagination > li.buttonBarItemContainer.active > span {
  color:#ffffff;
  background-color:#8ea3bf;
  border-color:#8ea3bf;
}

.buttonBarContainer ul.pagination > li.buttonBarItemContainer .glyphicon {
  top:3px;
}

/** Shared View CSS **********************************************************/

.subjectInfo,
.subjectInfo a:link {
  color:#666666;
}

.subjectInfo a:visited {
  color:#888888;
}

.priceInfo {
  color:#789048;
}

.priceDiffInfo {
  color:#666666;
  text-decoration:line-through;
}

.availabilityInfo {
  color:#666666;
}

.clusterStatusInfo {
  color:#666666;
}

.userNameInfo,
.userNameInfo a:link,
.userNameInfo a:visited {
  color:#234dab;
}

.locationInfo,
.locationInfo a:link,
.locationInfo a:visited {
  color:#879fff;
}

.brandInfo,
.brandInfo a:link,
.brandInfo a:visited {
  color:#c04848;
}

.modelInfo,
.modelInfo a:link,
.modelInfo a:visited {
  color:#d3643b;
}

.postDateInfo,
.sourceInfo {
  color:#888888;
}

.postCountInfo,
.likeCountInfo {
  color:#dddddd;
}

.tag {
  color:#ffffff;
  background-color:#bbbbbb;
  padding:2px;
  display:inline-block;
  zoom:1;
  *display:inline;
}

.tagButton {
  color:#bbbbbb;
}

.tagButton:hover {
  color:#666666;
}

.detailButton {
  color:#72bbd4;
}

.likeButton.glyphicon-heart {
  color:#f08784;
}

/** Price Charts *************************************************************/

.pricePostTimestampChart {
  //width:550px;
  height:300px;
}

/** Alert Dialog *************************************************************/

.filterCriteria {
  color:#cccccc;
  font-style:italic;
}

/** Query Result Container ***************************************************/

.queryResultContainer {
  margin:5px 0 0 5px;
}

.queryResultContainer .listingContainer {
  margin-right:5px;
  margin-bottom:5px;
}

.queryResultContainer .pricePostTimestampChart {
  margin-right:5px;
}

/** Gallery View *************************************************************/

.galleryContainer {
}

.galleryItemContainer {
  position:relative;
  width:250px;
  height:337px;
  margin:0 5px 5px 0;
  padding:0;
  background-color:#ffffff;
  vertical-align:top;
  overflow-y:hidden;
  display:inline-block;
  zoom:1;
  *display:inline;
}

.galleryItemContainer.med {
  width:185px !important;
  height:277px !important;
}

.galleryItemContainer img.thumb,
.galleryItemContainer img.thumbNoImage {
  width:100%;
  height:190px;
}

.galleryItemContainer.med img.thumb,
.galleryItemContainer.med img.thumbNoImage {
  height:140px !important;
}

.galleryItemContainer .galleryItemContainerDetailTop,
.galleryItemContainer .galleryItemContainerDetail {
  padding:3px 2px 0 4px;
  width:100%;
}

.galleryItemContainer .galleryItemContainerDetailTop {
  height:35px;
  font-size:13px;
  line-height:16px;
}

.galleryItemContainer.med .galleryItemContainerDetailTop {
  height:33px !important;
  font-size:12px !important;
  line-height:15px !important;
}

.galleryItemContainer .galleryItemContainerDetailTop .subjectInfo {
  height:100%;
  overflow:hidden;
  text-overflow:ellipsis;  
}

.galleryItemContainer .galleryItemContainerDetail {
  font-size:12px;
  line-height:16px;
}

.galleryItemContainer.med .galleryItemContainerDetail {
  font-size:11px !important;
  line-height:14px !important;
}

.galleryItemContainer .galleryItemContainerDetail div {
  width:100%;
  margin-bottom:1px;
  white-space:nowrap;
  overflow:hidden;
}

.galleryItemContainer .galleryItemContainerDetail div.galleryItemContainerTopLine {
  max-height:34px;
  line-height:16px;
  font-size:14px;
  white-space:normal !important;
}

.galleryItemContainer.med .galleryItemContainerDetail div.galleryItemContainerTopLine {
  max-height:32px !important;
  line-height:15px !important;
  font-size:12px !important;
}

.galleryItemContainer .priceInfo,
.galleryItemContainer .brandInfo,
.galleryItemContainer .availabilityInfo {
  font-weight:bold;
}

.galleryItemContainer .modelInfo {
  white-space:nowrap;
}

.galleryItemContainer .tagContainer {
  position:absolute;
  bottom:0;
  left:0;
  padding:0 4px;
  width:100%;
  height:24px;
  line-height:22px;
}

.galleryItemContainer .tagContainer .tag {
  font-size:11px;
  line-height:11px;
  vertical-align:middle;
  margin-left:3px;
}

.galleryItemContainer .tagContainer .tagButton {
  font-size:17px;
  vertical-align:text-top;
}

.galleryItemContainer .dropdown-menu {
  min-width:0;
}

.galleryItemContainer .dropdown-menu > li > a {
  padding-left:15px;
  padding-right:15px;
}

.galleryContainer .tooltip-inner {
  text-align:left;
}

/** Listing View *************************************************************/

div.listingContainer {
  font-size:11px;
  background-color:#ffffff;
}

.listingContainer table {
  border-collapse:collapse;
  border:0;
  width:100%;
}

.listingContainer tr.dataRow {
  border-top:1px solid #eeeeee;
}

.listingContainer tr.dataRow:hover td {
  background-color:#f8f8f8;
}

.listingContainer th {
  color:#111111;
  text-align:left;
  white-space:nowrap;
  padding:3px 6px 3px 6px;
}

.listingContainer th a:link,
.listingContainer th a:visited {
  color:#111111;
}

.listingContainer td {
  padding:0 6px 0 6px;
}

.listingContainer td.subjectInfo {
  padding:3px 6px 3px 6px;
  font-size:14px;
}

.listingContainer td.newInfo a:link {
  font-weight:bold;
}

.listingContainer td.priceColumn {
  font-size:14px;
  text-align:right;
}

.listingContainer td.sourceInfo {
  width:3em;
}

.listingContainer td.brandInfo,
.listingContainer td.modelInfo {
  width:5em;
  font-size:9px;
}

.listingContainer td.postDateInfo {
  width:6em;
  white-space:nowrap;
}

.listingContainer .detailButton {
  font-size:14px;
}

/** Matrix View **************************************************************/

div.matrixContainer {
  line-height:0;
  margin-right:3px;
  margin-bottom:3px;
}

div.matrixItemContainer {
  position:relative;
  margin:0 2px 2px 0;
  padding:0;
  width:190px;
  height:190px;
  display:inline-block;
  zoom:1;
  *display:inline;
}

div.matrixItemContainer img {
  margin:0;
  padding:0;
  width:190px;
  height:190px;
}

div.matrixItemContainer div.matrixItemDetail {
  padding:2px 5px 2px 5px;
  width:190px;
  height:26px;
  line-height:22px;
  text-align:right;
  vertical-align:middle;
  font-size:16px;
  font-weight:300;
  overflow:hidden;
  color:#eeeeee;
  background:#000000;
  background:rgba(0,0,0,0.6);
  position:absolute;
  bottom:0;
  left:0;
  z-index:10;
}

/** Detail Page **************************************************************/

.detailContainer {
  margin:5px;
}

.detailContainer .detailDetailContainer {
  background-color:#ffffff;
  padding:5px;
}

.detailDetailContainer .subjectInfo {
  font-size:18px;
}

.detailDetailContainer .priceInfo,
.detailDetailContainer .brandInfo,
.detailDetailContainer .modelInfo,
.detailDetailContainer .postDateInfo,
.detailDetailContainer .userNameInfo,
.detailDetailContainer .locationInfo {
}

.detailDetailContainer .tagContainer {
  margin:5px 0;
}

.detailDetailContainer .tagContainer .tag {
  margin-right:3px;
}

.detailDetailContainer .controlContainer {
  margin:5px 0;
}

.detailContainer .detailThumbContainer {
  background-color:#ffffff;
  margin-top:5px;
  padding:5px 0 0 5px;
}

.detailThumbContainer .thumbNoImage,
.detailThumbContainer .thumb {
  width:250px;
  height:250px;
  padding:0 5px 5px 0;
}

.detailContainer .detailHistoryContainer {
  background-color:#ffffff;
  margin-top:5px;
}

.detailHistoryContainer .historyTitle {
  padding:6px;
  font-size:18px;
  color:#666666;
}

.detailContainer .pricePostTimestampChart {
  margin-top:5px;
}

/** MySellers Page ***********************************************************/

.mySellersContainer {
  margin:5px 0 0 5px;
}

.mySellerItemContainer {
  padding:5px;
  background-color:#eeeeee;
}

.mySellerItemContainer p,
.mySellerItemContainer ul {
  margin-bottom:2px; 
  font-size:12px;
  line-height:14px;
}

.mySellerItemContainer .userNameInfo {
  padding-bottom:5px;
  font-size:22px;
  line-height:22px;
}

.mySellerItemContainer .viewListingButton {
  position:absolute;
  bottom:5px;
  left:5px;
}

/** Misc Pages ***************************************************************/

.noMatchContainer {
  margin-top:20px;
  margin-left:auto;
  margin-right:auto;
  width:75%;
}

div.pageContainer {
  padding:6px 6px 6px 12px;
}

div.pageContainer p {
  margin-bottom:15px;
}

div.pageContainer .phoneImage {
  float:right;
  width:100%;
  max-width:360px;
}

.faqContainer h2 {
  margin-bottom:20px;
}

.faqContainer .panel-title {
  color:#222222;
  font-size:20px;
}

.faqContainer .panel-body {
  padding-bottom:0;
  color:#666666;
  font-size:16px;
}

.textContentContainer h2 {
  margin-bottom:20px;
}

.textContentContainer p {
  font-size:20px;
  color:#666666;
}

/** Mobile CSS ***************************************************************/

@media only screen and (max-width:767px) {
  .buttonBarRightContainer {
    padding-right:10px;
  }

  .buttonBarContainer ul.pagination > li > a,
  .buttonBarContainer ul.pagination > li > span {
    padding:12px 8px;
  }

  div.intro,
  div.update,
  div#footerContainer {
    font-size:16px;
  }

  #headerContainer .navbar-brand {
    padding-left:2px;
  }

  #headerContainer #navQueryForm {
    margin-right:10px;
  }
}

@media only screen and (max-width:400px) {
  .detailThumbContainer .thumbNoImage,
  .detailThumbContainer .thumb {
    width:50%;
    height:auto;
  }
}

@media only screen and (min-width:401px) and (max-width:767px) {
  .detailThumbContainer .thumbNoImage,
  .detailThumbContainer .thumb {
    width:33.3%;
    height:auto;
  }

  div.pageContainer .phoneImage {
    width:300px;
  }
}