/**----------- lists menu styles ------------------**/
@media screen and (max-width: 640px) {
 nav#lists {
   position: absolute; top:5px; right: 10px !important;
 }
 ul#menu1 { width: auto; height: 40px; }
 ul#menu1 > li {
   position: initial;
 }
 ul#menu1 li > ul {
  right:1em;
  top: 100%;
  width: 12em !important;
  font-size: 1em;
 }
 ul#menu1 ul {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding-right: 0;
  width: 12em;
 }
}
@media screen and (max-width: 620px){
 li.mobihide { display: none !important; z-index: 0 } 
}
@media screen and (max-width: 579px){
 ul#menu1 li > ul { font-size: 1em; }
}

/*_______________ general lists styles_______________***/

img.bigpix { 
 margin-right: 2%; margin-left: 2px; 
 max-width: 95%; height: auto; }
 
p.leftlink {  /** links at btm of new title pages **/
   width:95%; margin-left:2em;
}
p.rightlink { 
  float: left !important; width:95%; margin-top: 1em;  margin-left:2em; }

.pagebar A { font-size: 1.2em; }
h2 { text-align: center; }

/**------------ NFSHELF pages top contents --------------**/
@media screen and (max-width:640px) {
 #main {
  width: 95%; max-width: 98% !important;
  margin: 0.2em;
  padding: 0 2px;
 } 
}

@media screen and (max-device-width:600px) {
 #dvd #main dl { margin-left: 5px; width: 90%; }
 #dvd dd { margin-left: 10px; }
}

@media screen and (max-width: 480px) { /**-------------*/
  html { -webkit-text-size-adjust: none; }
  div.lists { margin-top:0.5em; }
  div.lists p {
   width: 98%;
   margin: 5px 5px 0 5px;
   padding: 0;
   text-indent: -1em;
  }
  div.lists p, div.info, span.info { 
    width: 98% !important; 
    white-space: normal; 
  }
  .navbar, .pagebar { font-size: 1.3em; line-height: 1.4em; }
  }
  H1 { margin-top: 60px; }
  H2 { clear: both; margin-top: 1em; font-weight: 700;}
  
  .alertbox { width: 90%; }

  .info, dl dd {
    margin-left: 0.5em; 
    max-width: 90%;
  }
  .info { padding: 0 1em 0.5em 5px !important; }
  A.other { width: auto; min-width: 30px !important; }
}
@media screen and (max-width: 360px) {
 #main {
  width: 95% !important; 
  margin-right: 1em;
  padding-top: 0; padding-right: 5px; padding-left: 5px;
 } 
 nav.listsbar {
  float:right; margin-top: 17px; margin-right: 8em;
 }
 nav.listsbar a {
  padding: 10px;
 }
 .info, dl dd {
   margin-left: 5px; 
   max-width: 90%;
 }
 br.show320 { display: display; }
 .navbar { clear: both; }
}