html, body, form, ul, li, table, td { margin: 0; padding: 0; }
body {
padding:0;
margin:0;
color:#333;
font-family:'Helvetica';
background:#eeeeee;
}
@font-face {
font-family: 'QuicksandBook';
src: url('http://lotrproject.com/statistics/font/Quicksand_Book-webfont.eot'); 
src: url('http://lotrproject.com/statistics/font/Quicksand_Book-webfont.eot?#iefi') format('embedded-opentype'),
    url('http://lotrproject.com/statistics/font/Quicksand_Book-webfont.svg#svgFontName') format('svg'),
    url('http://lotrproject.com/statistics/font/Quicksand_Book-webfont.woff') format('woff'),
    url('http://lotrproject.com/statistics/font/Quicksand_Book-webfont.ttf')  format('truetype');
}
@font-face {
font-family: 'QuicksandBold';
src: url('http://lotrproject.com/statistics/font/Quicksand_Bold-webfont.eot'); 
src: url('http://lotrproject.com/statistics/font/Quicksand_Bold-webfont.eot?#iefi') format('embedded-opentype'),
    url('http://lotrproject.com/statistics/font/Quicksand_Bold-webfont.svg#svgFontName') format('svg'),
    url('http://lotrproject.com/statistics/font/Quicksand_Bold-webfont.woff') format('woff'),
    url('http://lotrproject.com/statistics/font/Quicksand_Bold-webfont.ttf')  format('truetype');
}
/* All */
#floatmenu {
z-index:2010;
display:none;
padding-top:0px;
width:180px;
margin-top:65px;
position:absolute;
cursor:pointer;
}
#floatmenu ul {
border-bottom:5px solid black;
padding:5px 0;
margin:0;
background: rgb(255, 255, 255);
background-color:rgba(255,255,255,0.9);
filter: alpha(opacity=90);
}
#floatmenu li {
padding:0;
margin:0;
list-style:none;
}
#floatmenu a {
display: block;
width:90%;
height:100%;
padding:8px 5%;
font-size:12px;
color:#111111;
text-transform:uppercase;
border-bottom:1px solid #dddddd;
text-decoration:none;
}
#floatmenu a:hover {
background:#dddddd;
color:#dc7f22;
}
.floattitle {
padding-left:10px;
font-size:12px;
font-weight:bold;
}
a {
color:#dc7f22;
text-decoration:none;
}
a:hover {
color:#555;
text-decoration:none;
}
.header-cont {
float:left;
width:auto;
padding-left:12px;
padding-right:12px;
padding-bottom:1px;
background: rgb(255, 255, 255);
background-color:rgba(255,255,255,0.9);
filter: alpha(opacity=90);
}
#header {
position:absolute;
top:30px;
left:30px;
color:white;
padding:0;
z-index:2003;
width:800px;
}
#header-inner {
margin:0 auto;
width:980px;
}
#header img {
float:left;
}
.meny-cont {
float:left;
letter-spacing:1px;
overflow:hidden;
}
.menulistclear {
clear:both;
}
#topmenuinner {
overflow:hidden;
}
.meny-cont ul {
margin-top:0px;
display:block;
width:auto;
overflow:hidden;
}
.meny {
margin:0;
background-color:none;
list-style:none;
padding:5px;
}
ul {
padding:0;
margin:0;
}
li.meny {
text-transform:uppercase;
padding:0px 0px 0px 0px;
display:block;
float:left;
padding-left:1px;
padding-bottom:1px;
font-size:12px;
line-height:14px;
margin:0;
}
li.menyimg {
text-transform:uppercase;
padding:0px 0px 0px 0px;
display:block;
float:left;
padding-left:1px;
padding-bottom:1px;
font-size:12px;
margin:0;
}
li.version {
text-transform:uppercase;
padding:0px 5px 0px 5px;
display:inline;
font-size:0.8em;
}
li.meny a {
color:#fefefe;
text-decoration:none;
display:block;
padding:10px 16px 10px 16px;
background:#333333;
}
li.rightmeny a {
color:#fefefe;
text-decoration:none;
display:block;
padding:9px 16px 10px 16px;
background:#333333;
}
li.menyimg a {
display:block;
padding:0;
width:34px;
height:34px;
overflow:hidden;
background:#333333;
cursor:pointer;
}
li.twitter a:hover {
background:#1fa6d7;
}
li.facebook a:hover {
background:#2c4d8e;
}
li.tumblr a:hover {
background:#2d4965;
}
.minimize {
float:left;
padding-left:1px;
width:34px;
height:34px;
}
.minimize a {
background:#333333;
width:34px;
height:34px;
display:block;
cursor:pointer;
}
.minimize a:hover {
background:#d33b2f;
}
li.meny a:hover {
color:#222222;
background: rgb(255, 255, 255);
background-color:rgba(255,255,255,0.9);
filter: alpha(opacity=90);
}
li.rightmeny a:hover {
color:#222222;
background: rgb(255, 255, 255);
background-color:rgba(255,255,255,0.9);
filter: alpha(opacity=90);
}
li.rightmeny a.floatboxactive {
color:#fefefe;
background: #d33b2f;
}
li.meny a:active {
color:#111;
text-decoration:none;
}
li.active {
color:#dc7f22;
}
li.mactive a {
color:#dc7f22;
}
li.meny a.mactive {
text-decoration:none;
color:#dc7f22;
}
#sharefbox {
z-index:2010;
padding:15px;
background: rgb(255, 255, 255);
background-color:rgba(255,255,255,0.9);
filter: alpha(opacity=90);
display:none;
position:absolute;
left:251px;
top:100px;
}
.sharethis {
display:inline;
float:left;
vertical-align: top }
.sharethis ul { margin:0 0 5px 0; padding:0 0 5px 0; list-style:none; }
.sharethis li { 
display:inline;
vertical-align: top;
float:left;
margin:0;
 }
img {border:0;}
img a {border:0;}
#footer {
width:100%;
background:none;
text-align:center;
overflow:hidden;
color:#333;
margin-top:20px;
font-size:0.8em;
}
#footer-inner {
width:980px;
overflow:hidden;
margin:0 auto;
padding:25px 0px;
text-align:left;
}
#follow {
font-weight:bold;
text-transform:uppercase;
margin-bottom:10px;
}
#links {
font-weight:bold;
text-transform:uppercase;
margin-bottom:10px;
}
#footer a {
color:#333;
text-decoration:none;
}
#footer a:hover {
color:#111;
}
/* Content */
.totwrapper {
min-width:1020px;
}
.wrapper {
font-family: 'QuicksandBook';
width:980px;
margin:0 auto;
padding-top:40px;
position:relative;
z-index:1;
}
.wrapperlist .listchar {
margin-left:70px;
font-size:18px;
padding-left:20px;
}
.fullbio {
background:url('images/hasbio.png') no-repeat center left;
}
.wrapperlist {
border-top:5px solid #d33b2f;
margin-top:20px;
}
.listlegend {
width:370px;
padding:20px;
background:#fefefe;
margin-right:20px;
}
.charsshown {
float:right;
width:200px;
text-align:center;
}
#charactersshown {
font-size:42px;
}
.legenditem {
font-size:12px;
margin-top:7px;
}
.legenditem img {
margin-right:10px;
}
.letterheader {
font-size:42px;
border-bottom:1px solid #cccccc;
float:left;
}
.listcontainer {
width:620px;
margin-top:20px;
padding:0px;
float:right;
}
.charlist {
padding:30px 50px;
}
.charheader {
width:100%;
min-width:1020px;
position:relative;
font-family: 'QuicksandBook';
color:#fefefe;
}
.charheaderinner {
width:980px;
padding-top:150px;
margin:0 auto;
position:relative;
z-index:2;
}
.hbg {
position:absolute;
top:0px;
left:0px;
z-index:-100;
overflow:hidden;
}
.charname {
  font-size:52px;
  font-family: 'Playfair Display', serif;
  font-style:italic;
  color:#fefefe;
  float:left;
}
.charrace {
  text-transform:uppercase;
  font-size:18px;
  letter-spacing:1px;
  margin-top:38px;
  margin-left:20px;
  float:left;
}
.charbody {
  position:relative;
  z-index:2;
  width:980px;
  background:#fefefe;
  color:#000000;
  border-top:5px solid #d33b2f;
}
.charbody h2 {
  font-size:24px;
  padding:0;
  margin:0;
}
.charbody h3 {
  font-size:20px;
  color:#333333;
  padding:0;
  margin:0;
}
.charbody h4 {
  font-size:16px;
  color:#333333;
  padding:0;
  margin:0;
}
.charbody a {
  color:#444444;
  text-decoration:none;
  border-bottom:1px solid #b8aa7b;
}
.charbody a:hover {
  color:#000000;
  text-decoration:none;
  border-bottom:1px solid #000000;
}
.charbody .image {
  border:none;
  height:150px;
  width:150px;
  overflow:hidden;
}
.charbody .image a {
  border:none;
  height:150px;
  width:150px;
}
.charinfo {
  padding:20px;
  width:560px;
  float:left;
  line-height:24px;
}
.intextquote {
padding:20px;
background:#222222;
color:#fefefe;
}
.intextquote .thetext {
font-size:16px;
}
.intextquote .thesource {
font-size:12px;
margin-left:20px;
margin-top:10px;
font-weight:bold;
}
sub, sup {
  line-height:1;
}
.charleft {
  width:340px;
  padding:20px;
  padding-left:0px;
  padding-top:10px;
  float:right;
}
.charrefs {
  padding:10px 0;
}
.ref {
  font-size:10px;
  padding:5px 0;
}
.refstitle, .postitle {
  padding-bottom:15px;
  font-family: 'QuicksandBold';
  font-size:18px;
}
.charpos {
  padding:10px 0;
  font-size:14px;
}
.contentsnav {
margin-top:10px;
margin-bottom:10px;
}
.charimages {
  padding:10px 0;
  width:340px;
  margin:0 auto;
  margin-bottom:10px;
}
.image {
  display:block;
  margin:0 5px;
  padding:5px;
  background:#cccccc;
  float:left;
}
.image:hover {
  background:#333;
}
#toplinks {
  position:absolute;
  right:20px;
  bottom:-31px;
  z-index:1;
}
#toplinks a {
color:#fefefe;
padding:10px;
background:#d33b2f;
}
#toplinks a:hover {
color:#fefefe;
padding:10px;
background:#b12b21;
}
.tolkiengateway {
float:left;
text-transform:uppercase;
font-size:12px;
margin-left:10px;
}
.familytree {
float:left;
text-transform:uppercase;
font-size:12px;
}
#toplinksleft {
position:absolute;
left:20px;
bottom:-31px;
z-index:1;
}
#toplinksleft a {
color:#fefefe;
padding:10px;
background:#d33b2f;
}
#toplinksleft a:hover {
color:#fefefe;
padding:10px;
background:#b12b21;
}
.toindex {
float:left;
text-transform:uppercase;
font-size:12px;
margin-right:10px;
}
#dates {
font-family: 'QuicksandBold';
font-size:12px;
padding:10px 0;
border-top:1px solid #444444;
}
.proptitle {
font-family: 'QuicksandBold';
}
.charaliases {
font-size:12px;
padding:10px 0;
border-top:1px solid #444444;
}
/* Mentions */
.chbars {
position: relative;
width: 100%;
margin-bottom: 40px;
}
.chbar {
height: 10px;
float:left;
}
#graphsc {
position:relative;
}
#tooltip, #tooltiptwo {
background: #eeeeee;
border-radius: 5px;
padding: 5px;
z-index: 5;
}
.tooltiptitle {
text-transform: uppercase;
font-family: 'QuicksandBold';
color: #666;
font-size: 12px;
}
.vmmenu {
padding:10px 20px;
padding-top:0px;
width:100%;
}
.term {
float:left;
padding:5px;
color:#222;
margin-right:10px;
margin-top:5px;
cursor:pointer;
}
.tip {
text-transform: uppercase;
font-family: 'QuicksandBold';
}
.selected {
color:#fefefe;
background:#222222;
}
#viewmentions {
width:980px;
margin-top:20px;
background:#fefefe;
color:#111;
}
#loadmentions {
padding:20px;
padding-top:0px;
}
.viewmentionstitle {
padding:20px;
font-family: 'QuicksandBold';
font-size:18px;
}
/* Mentions */
#quotes {
width:980px;
margin-top:20px;
background:#fefefe;
color:#111;
}
#quotes-inner {
padding:20px;
padding-top:0px;
}
.quote {
margin-bottom:20px;
width:600px;
font-size:16px;
line-height:22px;
}
.qtext {
margin-bottom:10px;
}
.qsource {
color:#666;
font-family: 'QuicksandBold';
font-size:12px;
text-align:left;
padding-left:20px;
}
#adaptions {
width:980px;
margin-top:20px;
background:#fefefe;
color:#111;
}
#adaptions-inner {
padding:20px;
padding-top:0px;
}
.adaption {
padding:10px 0;
}
.ayear {
font-family: 'QuicksandBold';
}
.adesc {
font-size:12px;
padding-top:10px;
}
.
/* Index */
.info {
margin-top:30px;
line-height:22px;
font-size:14px;
width:480px;
}
.rightmenu {
float:right;
width:480px;
}
#featured {
padding:20px;
margin-top:30px;
background:#222;
color:#fefefe;
}
#featured img {
float:left;
}
#featured .name a {
color:#fefefe;
font-size:32px;
padding-left:20px;
font-family: 'Playfair Display', serif;
font-style:italic;
}
#featured .desc {
color:#fefefe;
font-size:12px;
padding-left:20px;
margin-top:10px;
width:240px;
margin-left:150px;
}
.characterlist {
margin-top:30px;
}
.listchar {
padding:5px 0;
}
.listchar a {
color:#222;
text-decoration:none;
font-size:18px;
}
.listchar a:hover {
color:#000000;
text-decoration:none;
border-bottom:1px solid #666666;
}
/* Nav */
.hnav a, .hnav a:hover {
border-bottom:none;
}
.hnavh1 {
  padding:5px 0;
  font-size:14px;
}
.hnavh2 {
  padding:5px 0;
  margin-left:10px;
  font-size:14px;
}
.hnavh3 {
  margin-left:20px;
  padding:5px 0;
  font-size:14px;
}
.hnavh4 {
  margin-left:30px;
  padding:5px 0;
  font-size:14px;
}
.hnavh1 a, .hnavh2 a, .hnavh3 a, .hnavh4 a {
  border-bottom:none;
}
/* Tree */
#familytree {
width:980px;
margin-top:20px;
background:#fefefe;
color:#111;
position:relative;
}
#familytree-inner {
padding:20px;
padding-top:0px;
}
#familytree-load {
height:310px;
position:relative;
overflow:hidden;
}
#viewinlargetree {
position:absolute;
right:20px;
top:20px;
}
#tree {
height:310px;
}
#treewrapper {
  position:relative;
  width:2000px;
  left:-530px;
}
#viewinlargetree a {
  font-size:12px;
  text-transform:uppercase;
  background:#d33b2f;
  color:#fefefe;
  padding:5px;
}
#viewinlargetree a:hover {
  background:#b12b21;
}
.char {
  font-size:11px;
  line-height:12px;
  height:22px;
  padding: 5px 5px;
  width: 130px;
}
.char .center {
  display: table-cell;
  vertical-align: middle;
  line-height: 12px;
  height:22px;
  width: 130px;
}
#person {
position: absolute;
top: 50%;
left: 50%;
border: 1px solid #d33b2f;
text-align: center;
margin-left: -71px;
color:#fefefe;
font-weight:bold;
background:#d33b2f;
}
#spouse {
position: absolute;
top: 50%;
left: 50%;
border: 1px solid black;
text-align: center;
margin-left: 20px;
}
#middlep {
position: absolute;
top: 50%;
left: 50%;
text-align: center;
margin-top:19px;
}
#middlepp {
position: absolute;
top: 50%;
left: 50%;
text-align: center;
margin-top:-71px;
}
.child {
position: absolute;
top: 50%;
left: 50%;
border: 1px solid black;
text-align: center;
margin-top: 90px;
margin-left: -71px;
}
.sib {
position: absolute;
top: 50%;
left: 50%;
border: 1px solid black;
text-align: center;
margin-left: -71px;
}
#pleft {
position: absolute;
top: 50%;
left: 50%;
border: 1px solid black;
text-align: center;
margin-top: -90px;
margin-left: -160px;
}
#pright {
position: absolute;
top: 50%;
left: 50%;
border: 1px solid black;
text-align: center;
margin-top: -90px;
margin-left: 20px;
}
#pmiddle {
position: absolute;
top: 50%;
left: 50%;
border: 1px solid black;
text-align: center;
margin-left: -71px;
margin-top: -90px;
}
/* Filters */
#filters {
float:left;
width:300px;
margin-top:20px;
padding:20px;
background:#fefefe;
}
.filterstitle {
position:relative;
top:-5px;
left:-20px;
padding:4px 7px 4px 20px;
font-size:12px;
text-transform:uppercase;
color:white;
background:#d33b2f;
display:inline;
}
.filtertitle {
font-size:12px;
text-transform:uppercase;
font-family: 'QuicksandBold';
margin-top:10px;
}
.afilter {
margin-left:10px;
padding:5px;
font-size:14px;
}
#bytext {
border:2px solid #cccccc;
background:#fefefe;
padding:7px;
font-size:14px;
width:280px;
}
.fselected {
font-family: 'QuicksandBold';
}
.filteritem {
cursor:pointer;
}