a, .link-color {
  color: #337ab7;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

body {
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
  color: #333;
}

footer {
  max-width: 800px;
  margin: 13vh auto 0;
}

.generated-keywords{ display: none; }

input {
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

h1 { margin-bottom: 4px; }

main {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

nav li:last-child{
  margin-top: 8px;
}

#page-index {
  margin: 16px 14px 10px 16px;
}

#page-index h1 {
  font-size: 1.8rem;
  font-weight: 500;
}

#page-index footer h3 {
  color: #444;
}

#page-index footer p {
  font-size: 1.2rem;
  color: #555;
}

#page-my-items main {
  max-width: 600px;
  margin: 13vh auto 2rem;
}

#page-login {
  max-width: 600px;
  margin: 13vh auto;
}

#search {
  width: 100%;
}

#search input {
  width: 100%; box-sizing: border-box; font-size: 1rem; padding: 6px 2px 3px 8px;
  border-radius: 0 3px 3px 0;
  border: 1px solid #ccc;
}

#sorter {
  text-align: right;
  border-bottom: 1px solid #ddd;
  padding-bottom: 2px;
  padding-right: 1px;
}

#sorter span:hover {
  cursor: pointer;
}

textarea {
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

#items-listings {
  padding: 0;
  list-style: none;
}

#items-listings li {
  position: relative;
  padding-left: 7rem;
  border-bottom: 1px solid #eee;
}

#items-listings li h2 {
  font-size: 1.2rem;
  margin-bottom: 2px;
}

#items-listings li h2 + p {
  margin-top: 3px;
  color: #444;
}
#items-listings .description {
  color: #555;
  font-weight: 300;
  letter-spacing: 0.01rem;
}

#items-listings li .listing-icon-container {
  position: absolute;
  left: 0;
  top: 0;
}

#items-listings li img {
  border-radius: 5px;
  margin-right: 5px;
  max-height: 4rem;
}

#items-listings li > img {
  max-height: calc(15vh + 1rem);
  min-height: 10rem;
}

#page-index details {
  margin: 20px;
}

#page-index summary {
  text-decoration: underline;
  cursor: pointer;
}

#page-index details summary::-webkit-details-marker {
  display:none;
}

#page-index details > summary:first-of-type {
    list-style-type: none;
}

#page-index summary p {
  margin: 0;
}

#page-index #filter-categories {
  padding: 11px 0 0;
}

#page-index #filter-categories a {
  display: inline-block;
  min-width: 8rem;
  margin-bottom: 5px;
}

#page-index #filter-categories a span {
  font-size: 84%;
  color: #aaa;
  position: relative;
  bottom: 1px;
}

#localDevStuff {
  border-top: 1px solid #eee;
  margin: 24vh 0 0;
  padding-top: 1rem;
  overflow: hidden;
  max-width 90%;
}

#localDevStuff a {
  margin-right: 20px;
}

footer details {
  margin-top: 4rem!important;
}

footer details p:nth-of-type(even) {
  font-weight: 500;
  margin-bottom: 0;
}

footer details p:nth-of-type(even) + p {
  margin-top: 2px;
}

/* Mobile */
@media screen and (max-width: 500px) {
  #page-index h1 + p + p { display: none; }

  #locations-settings-when-adding-item { margin-right: -1.9rem; }
}

/* Wide screens, wide width */
@media screen and (min-device-width: 800px) and (min-width: 800px) and (min-height: 484px) {
  main { margin-top: 13vh; }

  #localDevStuff {
    padding: 1rem;
    border-radius: 3px;
    margin: 24vh 0 0 16rem;
  }

}

/* up to wide width on computer */
@media screen and (min-device-width: 800px) and (max-width: 1283px) {
  nav { max-width: 800px; margin: 42px auto; }

  #page-index[data-logged-in="1"] > nav {
    text-align: right;
  }

  #page-index[data-logged-in="1"] > nav ul li {
    display: inline-block;
    margin-right: 13px;
  }

  #page-index[data-logged-in="1"] #welcome p {
    display: none;
  }
}

/* Wide screens, wider width */
@media screen and (min-device-width: 800px) and (min-width: 1144px) and (min-height: 440px) {

  #page-index nav ul,
  #page-item-single nav ul {
    position: fixed;
    left: 1.3rem;
    bottom: 1.3rem;
  }

  #welcome {
    position: relative;
    padding-top: 2rem;
  }

  #poke-sell-something {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 1.2rem;
  }
}

/* Narrow screen, and medium not mobile */
@media screen and (min-device-width: 801px) and (max-width: 1143px) {

  #poke-sell-something { display: none; }

  body > nav {
    text-align: right;
    padding-right: 3px;
    margin-top: 2rem;
    margin-bottom: calc( .5rem + 6vh);
  }
  body > nav li {
    display: inline-block;
    margin-left: .84rem;
  }

  body > nav li:first-child a { border: 1px solid #337ab7;
    padding: .6rem 1rem;
    border-radius: 3px;
  }
}
/* Mobile */
@media screen and (max-device-width: 800px) {

  #items-listings li { padding-left: 0; }
  #items-listings li .listing-icon-container { right: 0; left: auto; }
  #items-listings .material { display: none; }

  #welcome h1 { margin-top: 5rem!important; }

  #poke-sell-something {
    position: absolute;
    top: -5rem;
    right: 5px;
    font-size: 1.3rem;
    font-weight: 300;
    letter-spacing: .02rem;
  }

  body { position: relative; padding-top: 0; padding-bottom: 13rem; }
  nav    { margin-top: 2rem; position: absolute; bottom: 0; z-index: 200; }
  nav li { margin-bottom: 8px; font-size: 1.3rem; }
  .hide-if-mobile { display: none!important; }
}

