/* Colors:
#6484af  Header bg; body border
#6484b1  Secondary nav tabs bg; selected secondary nav tab border (was orange)
#6484b2  Non-selected secondary nav tabs border
#6484b3  Main nav tabs bg and border
#6484b0  Home page chunk header bg; chunk border bg (home-*.css)
#fffffe  Content bg; selected tab bg (primary through tertiary); ad bg
#bbe1ff  Def borer; header borders
#d5e4ff  Sent/citation borders
#f2f2ff  Featured def bg
#f9f9ff  Non-featured def bg
Peek-a-boo link:  http://www.positioniseverything.net/explorer/peekaboo.html
*/

body {
  background-color: #ebebeb;
  padding: 0 15px;
  margin-top: 0;
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;

  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.84em;
  line-height: 1.357;

  color: #222;
}

h1, h2, h3, h4 {
  text-align: left;
}
h1 {
  font-size: 140%;
  margin-top: 22pt;
}
h2 {
  font-size: 135%;
  margin-top: 20pt;
}
h3 {
  font-size: 117%;
  margin-top: 20pt;
}

a {
  color: #333;
}
a.noul {
  text-decoration: none;
}

/* In FF 20, 21 when using DirectWrite rendering, double-bolded text appears extra bold.
   See e.g. https://bugzilla.mozilla.org/show_bug.cgi?id=550128 .  Prevent that. */
b b {
  font-weight: bold;
}

img {
  border: none;
}

.nowrap {
  white-space: nowrap;
}

form {
  margin: 0;
  padding: 0;
}

table {
  border: none;
}
tr {
  text-align: left;
  vertical-align: top;
}

tt {
  font-size: 10pt;
}

/* HEADER */

div.header {
  padding: 5px 15px 10px 15px;
  margin-bottom: 8pt;
  background-color: #6484af;
  color: #fff;
  -moz-border-radius: 0 0 15px 15px;
  -webkit-border-radius: 0 0 15px 15px;
  border-radius: 0 0 15px 15px;
}
.header .right {
  text-align: right;
  font-size: 90%;
}
div.header div.social {
  float: left;
  margin-left: 20px;
}
div.header a {
  font-weight: bold;
  color: #fff;
  text-decoration: none;
}

div.header div.title {
  float: left;
}
div.title a#title,
div.title span#tagline {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: bold;
}
div.title a#title {
  font-size: 150%;
}
div.title span#tagline {
  font-size: 110%;
}

/* MAIN CONTENT */

div.content-holder {
  background-color: #fffffe;
  padding: 0;
  margin: 0;
  border: 1px solid #6484af;
}

div.content {
  padding-top: 15pt;
  padding-left: 20pt;
  padding-right: 20pt;
  padding-bottom: 20pt;
  line-height: 1.55;
  text-align: justify;
  zoom: 1; /* Fix IE6 peek-a-boo bug. */
}

div.site-notice {
  background-color: #ffc;
  padding: 10px;
  margin-bottom: 10pt;
  font-size: 90%;
}

/* FOOTER */

div.footer {
  text-align: center;
  font-weight: bold;
  color: #888;
  margin-top: 25px;
  margin-bottom: 75px;
}

div.footer a {
  color: #888;
  text-decoration: none;
}

/* MISC */

form.search-box {
  margin-top: 10px;    
}

h2.separator {
  border: 3px solid #bbe1ff;
  text-align: center;
  font-size: 175%;
  padding: 3pt;
}

.hl {
  background-color: #ffa;
}

.toggle {
  text-decoration: none;
  border-bottom: 1px dotted #777;
}

blockquote.news {
  font-family: Georgia, serif;
  font-style: italic;
  padding-left: 0px;
  margin: 0px
}

.honey {
  display: none;
}

/* SECONDARY / TERTIARY NAV (e.g. letters, numbered pages) */

table.nav {
  padding: 2px;
  line-height: 17pt;
}
table.nav td {
  /* width: 3.8%;  This doesn't work right in Firefox - the "z" becomes very narrow.  So we
     have to specify the width of each cell manually in the HTML. */
  border-left: 2px solid #fffffe; /* ignored */
  padding-right: 2px;
  text-align: center;
}

table.nav a {
  color:white;
  font-size: 1em;
  font-weight:bold;
  text-decoration:none;
  background-color:#6484b1;
  float: left;
  width: 100%;
  border: 1px solid #6484b2;
  margin-right: 2px;
}

table.nav#not-automatically-highlighted a.current,
/* Thesaurus */
table.nav#home a.home,
table.nav#contents a.contents,
table.nav#contents-full a.contents-full,
table.nav#index a.index,
/* Word list */
table.nav#wl0 a.wl0,
table.nav#wlb a.wlb,
table.nav#wlc a.wlc,
table.nav#wle a.wle,
table.nav#wlg a.wlg,
table.nav#wlh a.wlh,
table.nav#wll a.wll,
table.nav#wlp a.wlp,
table.nav#wls a.wls,
table.nav#wlt a.wlt,
table.nav#wlu a.wlu,
table.nav#wlx a.wlx,
/* Browse by letter */
table.nav#a a.a,
table.nav#b a.b,
table.nav#c a.c,
table.nav#d a.d,
table.nav#e a.e,
table.nav#f a.f,
table.nav#g a.g,
table.nav#h a.h,
table.nav#i a.i,
table.nav#j a.j,
table.nav#k a.k,
table.nav#l a.l,
table.nav#m a.m,
table.nav#n a.n,
table.nav#o a.o,
table.nav#p a.p,
table.nav#q a.q,
table.nav#r a.r,
table.nav#s a.s,
table.nav#t a.t,
table.nav#u a.u,
table.nav#v a.v,
table.nav#w a.w,
table.nav#x a.x,
table.nav#y a.y,
table.nav#z a.z,
table.nav#numbers a.numbers {
  background-color: #fffffe;
  color:#000;
  border: 1px solid #6484b1;
}

table.nav a:visited {
  text-decoration:none; /* necessary in IE to avoid underlines */
}

table.nav a:hover {
  background-color: white;
  color:#000;
  border: 1px solid white;
}

/* SERP STYLES */

div#serp a {
  color: #0000ff;
  font-weight: bold;
}

div#serp a:visited {
  color: #800080;
}

div.indent {
  margin-left: 20px;
}

div#serp li {
  margin-top: 13pt;
  line-height: 1;
}

/* DEFINITION STYLES */

div.term-featured,
div.term-non-featured {
  border: 1px solid #bbe1ff;
  margin: 2em 10pt 2em 0;
  padding: 5pt 7pt;
  /* This instance of the peek-a-boo bug is triggered by the Interact icons. */
  zoom: 1; /* Fix IE6 peek-a-boo bug. */
}

div.term-featured {
  background-color: #f2f2ff;
}
div.term-non-featured {
  background-color: #f9f9ff;
}

/* Account for UlWdSk.  *MUST* be defined after div.term-featured, div.term-non-featured above,
   in order to override their margin-left. */
div.indent-term {
  margin-left: 190px;
}

div.term-featured h2,
div.term-non-featured h2 {
  margin-top: 0;
  margin-bottom: 1em;
  font-size: 140%;
  font-weight: normal;
}
div.term-featured h2 {
  font-weight: bold;
}

div.term-featured h2 a,
div.term-non-featured h2 a {
  text-decoration: none;
}

div.definitions li,
div.definitions li {
  margin-top: 1em;
  margin-bottom: 2em;
}

blockquote.sentence,
blockquote.citation {
  background-color: #fff;
  border: 1px solid #d5e4ff;
  margin-top: 1.5em;
  margin-left: 0;
  margin-bottom: 1em;
  padding: 3pt 5pt;
}

ul.theses {
  padding-left: 1.5em;
  margin-top: 1.5em;
  margin-bottom: 1em;
}

ul.theses li {
  margin-top: 0;
  margin-bottom: 0;
}

p.attrib {
  font-style: italic;
  margin-top: 1.5em;
  margin-bottom: 0;
  font-size: 90%;
}
p.attrib,
p.attrib a {
  color: #777;
}

.censored {
  background-color: #000;
}

table.sharers ul {
  margin: 0;
  padding: 0;
  padding-left: 1em;
}
table.sharers li b a {
  margin-right: 10pt;
}
table.sharers span a {
  border-bottom: 1px solid #d8d8d8;
  text-decoration: none;
}

div.term-featured h3,
div.term-non-featured h3 {
  margin-top: 0;
  margin-bottom: 1em;
  padding-bottom: 0;
  font-size: 100%;
  font-weight: normal;
}

div#twitter_div {
  height: 403px;
}

/* Referenced in JS.  Don't rename or change to an id selector. */
.embeddedmap {
  height: 450px;
  border: 1px solid black;
}

/* INTERACT, SHARE ICONS */

div.icon-section {
  text-align: center;
  float: left;
  padding-left: 20px;
}
div.icon-section,
div.icon-share {
  white-space: nowrap;
}
div.icon-section a,
div.icon-share a {
  text-decoration: none;
}

/* WORD LIST */

table.wordlist h2 {
  margin-top: 0;
  padding-top: 0;
}

table.wordlist a {
  text-decoration: none;
}

table.wordlist a.v /*ariant*/ {
  color: #777;
  font-style: italic;
}

/* ADS */

div.upper-right-ad,
div.upper-left-ad {
  margin-bottom: 15px;
  margin-top: 20px;
}
div.upper-right-ad {
  float: right;
  margin-left: 20px;
  /* Floated ad divs are supposed to have a width, but we're reusing this div for ads with
     varying widths.  It works fine without specifying the width.
  width: 160px; */
}
div.upper-left-ad {
  float: left;
  margin-right: 20px;
}

/* This is a distinct class because I don't want div.upper-right-ad's margin-top. */
div.def-upper-right-ad {
  float: right;
  margin-left: 20px;
  margin-bottom: 20px;
}

div.home-left-ad {
  margin-top: 2px;
  padding-right: 15px;
}
div.home-right-ad {
  margin-top: 2px;
  margin-left: 15px;
}

div.inner-ad,
div.bottom-ad {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
div.inner-ad {
  margin-bottom: 12pt;
}
div.bottom-ad {
  margin-top: 16pt;
}

table.bottom-ads {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
div.left-ad-of-2 {
  margin-right: 10pt;
}

/* Local-testing-placeholder-divs */

div.Lead, div.Ban, div.SmSq, div.Sq, div.Sky, div.WdSk, div.MdRc, div.LgRc, div.MoLe {
  border: 1px solid black;
  background-color: #ddf;
}
/* Reduce each dimension by 2px to account for border */
div.Lead { width: 726px; height:  88px; }
div.Ban  { width: 466px; height:  58px; }
div.SmSq { width: 198px; height: 198px; }
div.Sq   { width: 248px; height: 248px; }
div.Sky  { width: 118px; height: 598px; }
div.WdSk { width: 158px; height: 598px; }
div.MdRc { width: 298px; height: 248px; }
div.LgRc { width: 334px; height: 278px; }
div.MoLe { width: 318px; height:  48px; }

/* MAIN NAV TABS */

ul#tabnav { /* general settings */
  text-align: left; /* set to left, right or center */
  margin: 0 0 0 0; /* set margins as desired */
  font-weight: bold; /* set font as desired */
  list-style-type: none;
  padding: 0;
  padding-bottom: 3px;
  line-height: 1.25; /* WR: I added this directive */
}

ul#tabnav li { /* do not change */
  display: inline;
  line-height: 1.25; /* WR: I added this directive */
}

body#welcome li.welcome,
body#recent li.recent,
body#wordlist li.wordlist,
body#browse li.browse,
body#thesaurus li.thesaurus,
body#submit li.submit
{ /* settings for selected tab */
  background-color: #fffffe;  /* set background color to match above border color */
  margin-right: 5px;
}

body#welcome li.welcome a,
body#recent li.recent a,
body#wordlist li.wordlist a,
body#browse li.browse a,
body#thesaurus li.thesaurus a,
body#submit li.submit a
{ /* settings for selected tab link */
  background-color: #fffffe; /* set selected tab background color as desired */
  color: #000;           /* set selected tab link color as desired */
  margin-right: -5px;    /* IE 6, 7 hack.  It thinks the link extends off the right edge of the LI until it hits the next one */
  border-bottom: 1px solid #fffffe; /* WGR: Make selected tab seem to merge with body */
}

ul#tabnav li a { /* settings for all tab links */
  background-color: #6484b3; /* set unselected tab background color as desired */
  color: #fff;               /* set unselected tab link color as desired */
  text-decoration: none;
  padding: 3px 11px;         /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
  border: 1px solid #6484b3;
}

ul#tabnav a:hover { /* settings for hover effect */
  background: #fffffe; /* set desired hover color */
  color: #000;
}

/* MOBILE */

.mobile {
  display: none;
}
.cf {
  clear: left;
  display: none;
}

@media screen and (min-width: 861px) {
  #tabnav {
    display: none !important;
  }
  #tabnav.full {
    display: block !important;
  }
}

@media screen and (min-width: 771px) and (max-width: 860px) {
  #tabnav {
    display: none !important;
  }
  #tabnav.narrow {
    display: block !important;
  }
}
@media screen and (min-width: 681px) and (max-width: 770px) {
  #tabnav {
    display: none !important;
  }
  #tabnav.narrower {
    display: block !important;
  }
}
@media screen and (min-width: 641px) and (max-width: 680px) {
  #tabnav {
    display: none !important;
  }
  #tabnav.narrowerer {
    display: block !important;
  }
}
@media screen and (min-width: 1px) and (max-width: 640px) {
  #tabnav {
    display: none !important;
  }
  #tabnav.narrowererer {
    display: block !important;
  }
}
  
@media screen and (min-width: 641px) {
  .cf {
    display: none;
  }
  .cf-inverted {
    display: inline;
  }
  .header .right {
    text-align: right;
  }
  #tagline {
    display: inline;
  }
}
@media screen and (max-width: 640px) {
  .cf {
    display: block;
  }
  .cf-inverted {
    display: none;
  }
  .header .right {
    text-align: left;
  }
  #tagline {
    display: none;
  }
}