#head {position:fixed; margin:0; top:0; right:0px; display:block; width:100%; height:120px; background:url(https://www.ringrealms.com/topbar.jpg) -0px 0px no-repeat; font-size:4em; z-index:2; color:#fff;}
#headbuttons { display:block; position:relative; bottom:30px; height: 38px; width:950px; margin-left: auto; margin-right: auto; background:transparent; clear:both; }
.headbuttons  ul { display:inline; width:185px; float:left; font-family:'UniqueRegular', 'exomedium', sans-serif;}
.headbuttons span { display:block; height:36px; float:left; background:transparent; left:0px; padding:1px; transition: all 0.5s ease;}

/* style the links and place the background image to start from left edge */
.headbuttons span a {position:relative; display:block;  height:36px; width:180px;  background:url(https://www.ringrealms.com/buttonCover.png) -0px 0px no-repeat; color:#000; text-decoration:none; font-size:18px; font-weight:700; font-family:'UniqueRegular', 'exomedium', sans-serif; text-align:center; line-height:35px}

.headbuttons span a b {margin:0px; display:inline; float:left; height:36px; background:transparent url(https://www.ringrealms.com/buttonCover.png) -0px 0px no-repeat; padding:0px; color:#fff;}

/* style the link hover and the link hover b to replace the background image - border:0 needed for IE6 to work */
.headbuttons span a:hover, .headbuttons span a:hover b {border:0; background:transparent url(https://www.ringrealms.com/buttonCover.png) 0px -37px no-repeat; cursor:pointer; color: white; font-size:18px; font-weight:900;}

.headbuttons span:hover {
   font-family:'UniqueRegular', 'exomedium', sans-serif;
   height:40px;
   font-size:19px;
   color: white;
   font-weight:800;
   text-shadow: 2px 3px #333333;
   background:transparent url(https://www.ringrealms.com/buttonCover.png) 0px -37px no-repeat;
}


#footer {
	display: block;
	margin-left: -20px;
	margin-right: 0px;
	width: 100%;
	background: white;
	margin-top:-5px;
	padding:0px;
}
#menucolumn {
  float: left;
	width: 180px;
	display: block;
	margin: 0px;
	padding: 0px;
	background: white;
}
#menu {
	           float: left;
             width:160px;
    vertical-align: top;
        text-align: center;
   background-color: #4C4CD3;
   margin-top: 20px;
}
.menucolumn {
              width: 160px;
     vertical-align: top;
            z-index: 2;
           background: white;
}


@keyframes blur{
  from{
      text-shadow:
      0px 5px 6px  #333333,
      0px 0px 7px #fff,
      0px 0px 7px #fff,
      0px 0px 12px #fff,
      0px 0px 12px #fff,
      0px 0px 12px #fff,
      0px 0px 12px #fff,
      0px 0px 12px #fff,
      0px 0px 12px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #7B96B8,
      0px 0px 40px #7B96B8,
      0px 10px 30px #7B96B8,
      0px 10px 30px #7B96B8,
      0px 10px 30px #7B96B8,
      0px 10px 30px #7B96B8,
      0px -10px 30px #7B96B8,
      0px -10px 30px #7B96B8;
  }
  to {
      text-shadow:
      0px 5px 6px  #333333;
     }

}
@-webkit-keyframes  blur { /* Safari and Chrome */
  from{
      text-shadow:
      0px 5px 6px  #333333,
      0px 0px 7px #fff,
      0px 0px 7px #fff,
      0px 0px 12px #fff,
      0px 0px 12px #fff,
      0px 0px 12px #fff,
      0px 0px 12px #fff,
      0px 0px 12px #fff,
      0px 0px 12px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #fff,
      0px 0px 20px #7B96B8,
      0px 0px 40px #7B96B8,
      0px 10px 30px #7B96B8,
      0px 10px 30px #7B96B8,
      0px 10px 30px #7B96B8,
      0px 10px 30px #7B96B8,
      0px -10px 30px #7B96B8,
      0px -10px 30px #7B96B8;
  }
}



#page {
	  position: relative;
	  display: block;
		width: 95%;
		font-family: arial, helvetica;
		font-size: 11px;
		color: #000000;
		background: white;
		padding: 20px;
		margin-top: 120px;
		margin-right: 40px;
		margin-left: -20px;
    border-radius: 18px 18px 00px 00px;
    overflow: visible;
}

h1
  {
  text-align: center;
  page-break-after:avoid;
  font-size:18.0pt;
  font-family:"Times New Roman";
  font-weight: bold;
  color: black;
  }
h2
  {
  text-align: center;
  page-break-after:avoid;
  font-size:16.0pt;
  font-family:"Times New Roman";
  font-weight: bold;
  font-style: italic;
  color: black;
  }
h3
  {
  text-align: left;
  page-break-after:avoid;
  font-size:15.0pt;
  font-family:"Times New Roman";
  font-weight: bold;
  font-style: normal;
  }
h4
  {
  text-align: center;
  page-break-after:avoid;
  font-size: 10.0pt;
  font-family: "Arial";
  font-weight: bold;
  font-style: normal;
  }

h6      {
  text-align: center;
  page-break-after:avoid;
  font-size: 7.0pt;
  font-family:"Arial";
  font-weight: bold;
  font-style:  italic;
  }
.list {
  text-align: left;
  page-break-after:avoid;
  font-size: 10.0pt;
  font-family: "Arial Narrow";
  font-weight: normal;
  }
.norm
  {
  font-size:14.0pt;
  font-family: "Times New Roman";
  }
.indent
  {
  text-indent:.5in;
  }
.t8
  {
  font-size: 8.0pt;
  font-family: "Times New Roman";
  }
.t10
  {
  font-size: 10.0pt;
  font-family: "Times New Roman";
  }
.t12x
  {
  font-size: 12.0pt;
  font-family: "Times New Roman";
  }
.t12
  {
  font-size: 12.0pt;
  font-family: "Arial";
  }
.t12solid {
           position: relative;
          font-size: 12.0pt;
       font-family: "Arial";
              color: black;
                top: 0px;
               left: 0px;
             height: auto;
              width: 100%;
             margin: 0px;
            padding: 0px;
       border-style: none;
       border-width: 0px;
   background-color: #FFFFFF;
            z-index: 2;
}
.twhite {
     color  : white;
}
.t14
  {
  font-size: 14.0pt;
  font-family: "Times New Roman";
  }

span.fic
  {
  font-family: Arial;
  text-indent: 0.5in;
  font-size: 12pt;
  color: blue;
  }
.head
  {
  text-align: center;
  page-break-after:avoid;
  font-size:18.0pt;
  font-family:"Times New Roman";
  font-weight: bold;
  color: black;
  }
.info
  {
  text-align: center;
  page-break-after:avoid;
  font-size: 10.0pt;
  font-family: "Arial";
  font-weight: bold;
  font-style: normal;
  }
p.list  {
  text-indent: 0in;
  margin-left: 0.5in;
  }

.copyright {
  text-align: center;
  page-break-after:avoid;
  font-size: 7.0pt;
  font-family:"Arial";
  font-weight: bold;
  font-style: italic;
  }
.cen    {
        text-align: center;
}

.bannerbounds {
             height: 120px;
              width: 100%;
             margin: 0;
            padding: 0;
       border-width: 0;
    border-collapse: collapse;
}

.bannerleft {
           position: relative;
                top: 0px;
               left: -2px;
             height: 120px;
              width: 100%;
             margin: 0px;
            padding: 0px;
       border-style: none;
       border-width: 0px;
   background-color: #DDDDFF;
}
.bannerright {
           position: relative;
                top: 0px;
               left: 0px;
             height: 120px;
              width: 100%;
             margin: 0px;
            padding: 0px;
       border-style: none;
       border-width: 0px;
   background-color: #DDDDFF;
}

.dwheader {
              width: 100%;
             margin: 0px;
            padding: 0px;
       border-style: solid;
       border-width: 1px;
       border-color: #FFFFFF;
   background-color: #00CCCC;
}
.bannertitle {
              width: 100%;
             height:120px;
             margin: 0px;
            padding: 0px;
       border-style: none;
       border-width: 0px;

}
.newsbar {
             position: relative;
                  top: 5px;
                 left: 35%;
                width: 500px;
               height: 36px;
               margin: 0;
              padding: 0;
         border-width: 0;
           text-align: center;
                color: black;
            font-size: 10pt;
       vertical-align: top;
     background-color: transparent;
              z-index: 3;
}
.barsettings {
             position: absolute;
                  top: 5px;
                 left: 35%;
                width: 520px;
               height: 36px;
               margin: 0;
              padding: 0;
         border-width: 0;
           text-align: center;
                color: black;
            font-size: 10pt;
       vertical-align: top;
     background-color: transparent;
              z-index: 2;
}

.left {
    width: 160px;
    float: left;
    background: transparent;
}

.right {
    float: none; /* not needed, just for clarification */
    background: transparent;
    width: auto;
    overflow: hidden;
}
#mastertable {
	display: flex;
	width: 100%;
}
.toprow {
	width: 100%;
	display: table-row;
	height: 120px;
}
.row {
	display: table-row;
}
.logocorner {
	float: left;
	display: block;
	width: 160px;
	height: 120px;
	background: #FFFFFF;
}
.whitebox {
                top: 0px;
               left: 0px;
              width: 100%;
             margin: 0;
            padding: 0;
       border-width: 0;
          font-size: 10pt;
       border-color: transparent;
   background-color: transparent;
    border-collapse: collapse;
            z-index: 1;
}
.bannerbox {
              width: 100%;
             margin: 0px;
            padding: 0px;
       border-width: 1px;
          font-size: 10pt;
       border-color: #111111;
   background-color: transparent;
    border-collapse: collapse;
            z-index: 1;
         visibility: visible;
}


.volumebox {
              width: 100%;
             margin: 0;
            padding: 0;
       border-width: 0;
          font-size: 10pt;
       border-color: transparent;
   background-color: transparent;
    border-collapse: collapse;
            z-index: 1;

}
.menucol {
          position: absolute;
               top: 120px;
              left: 0px;
             width: 160px;
            height: 354px;
    vertical-align: top;
   border-collapse: collapse;
           z-index: 2;
}
.upperbanner {
          position: absolute;
               top: 0px;
              left: 0px;
            height: 120px;
             width: 100%;
  background-color: #FFFFFF;
        visibility: visible;
           z-index: 1;
}

.layer0 {
            z-index: 1;
}
.layer1 {
            z-index: 2;
}
.layer2 {
            z-index: 3;
}
.layer3 {
            z-index: 4;
}
.layer4 {
            z-index: 5;
}

.buttonoffsetl4 {
              width: 100%;
             height: 62px;
         text-align: center;
              width: 520px;
                top: 15px;
               left: 0px;
             margin: 0;
            padding: 0;
       border-width: 0;
    border-collapse: collapse;
   background-color: transparent;
         visibility: visible;
            z-index: 4;
}

.logo {
    vertical-align: top;
        text-align: center;
      border-style: none;
            z-index: 2;

}
.cenbanner {
           position: relative;
                top: 0px;
               left: 0px;
             height: 120px;
     vertical-align: top;
             margin: 0;
            padding: 0;
       border-width: 0;
   background-color: transparent;
    border-collapse: collapse;
            z-index: 2;
}
.menutail2 {
          position: relative;
             width: 160px;
            height: 100%;
            margin: 0px;
           padding: 0px;
      border-style: none;
      border-width: 0px;
    vertical-align: top;
  background-color: #4C4CD3;
           z-index: 1;
}
.ietail {
          position: relative;
               top: 0px;
              left: 0px;
             width: 160px;
            height: auto;
            margin: 0px;
           padding: 0px;
      border-style: none;
      border-width: 0px;
    vertical-align: top;
  background-color: #3333CC;
           z-index: 1;
}

.menutail {
          position: relative;
             width: 160px;
            height: 100%;
            margin: 0px;
           padding: 0px;
      border-style: none;
      border-width: 0px;
    vertical-align: top;
  background-color: #3333CC;
           z-index: 1;
}
.menutaildiv {
          position: relative;
               top: 0px;
              left: 0px;
             width: 160px;
            height: 2048px;
    vertical-align: top;
  background-color: #4C4CD3;
           z-index: 1;
}
.mascot {
          position: relative;
         font-size: 10.0pt;
       font-family:"Times New Roman";
       font-weight: normal;
        font-style: normal;
    vertical-align: top;
      border-style: none;
      border-width: 0px;
             float: right;
}
.bluebar {
             width: 100%;
       font-family:"Times New Roman";
       font-weight: bold;
        font-style: normal;
    vertical-align: top;
      border-style: none;
      border-width: 0px;
            margin: 0px;
           padding: 0px;
      border-style: none;
      border-width: 0px;
             color: white;
  background-color: blue;
}
.subinfo {
           position:relative;
        font-family:Arial;
          font-size: 10px;
        font-weight: 600;
              color: white;
   background-color: transparent;
         text-align: center;
            z-index: 3;
}
.nlinks1 {
           position:relative;
        font-family:Arial;
          font-size: 10px;
        font-weight: 600;
              color: white;
   background-color: #EFEFEF;
         text-align: center;
            z-index: 3;
}
.nlinks2 {
           position:relative;
        font-family: Arial;
          font-size: 10px;
        font-weight: 500;
              color: black;
   background-color: #EFEFEF;
         text-align: center;
            z-index: 3;
}

a.news:link {
     color : #000000;
     background-color: #EFEFEF;
 }

a.news:visited {
     color: #000000;
     background-color: #EFEFEF;
}
a.news:hover {
     color: #008FFF;
     background-color: #000000;
     text-decoration: underline;
}
a.news:active {
     color : #000000;
     background-color: #EFEFEF;
}
.content {
          position: relative;
               top: 0;
              left: 0;
         font-size: 10.0pt;
       font-family:"Times New Roman";
       font-weight: normal;
        font-style: normal;
    vertical-align: top;
            margin: 0px;
           padding: 0px;
      border-style: none;
      border-width: 0px;
  background-color: #FFFFFF;
           opacity: 0.70;
           z-index: 2;
}
.clearcontent {
          position: relative;
               top: 0;
              left: 0;
         font-size: 10.0pt;
       font-family:"Times New Roman";
       font-weight: normal;
        font-style: normal;
             color: white;
    vertical-align: top;
            margin: 0px;
           padding: 0px;
      border-style: none;
      border-width: 0px;
  background-color: transparent;
           z-index: 2;
}

.contentx {
          position: relative;
               top: 0;
              left: 0;
             width: 50%;
         font-size: 10pt;
       font-family:"Times New Roman";
       font-weight: normal;
        font-style: normal;
    vertical-align: top;
            margin: 0px;
           padding: 20px;
      border-style: none;
      border-width: 0px;
  background-color: transparent;
           opacity: 1.0;               /* newer Mozilla and CSS-3 */
           z-index: 3;
}
.nheader {
         font-size: 12.0pt;
       font-family:"Times New Roman";
       font-weight: bold;
        font-style: normal;
             color: white;
    vertical-align: top;
            margin: 0px;
           padding: 2px;
      border-style: none;
      border-width: 0px;
  background-color: transparent;
           z-index: 0;
}
.nfooter {
         font-size: 10.0pt;
       font-family:"Times New Roman";
       font-weight: bold;
        font-style: normal;
             color: black;
    vertical-align: top;
            margin: 0px;
           padding: 2px;
      border-style: none;
      border-width: 0px;
  background-color: transparent;
           z-index: 0;
}


.newsheader {
         font-size: 12.0pt;
       font-family:"Times New Roman";
       font-weight: bold;
        font-style: normal;
             color: white;
    vertical-align: top;
            margin: 0px;
           padding: 0px;
      border-style: none;
      border-width: 0px;
  background-color: #4C4CD3;
  background-color: transparent;

           z-index: 0;
}
.newscell {
         font-size: 11.0pt;
       font-family:"Times New Roman";
       font-weight: normal;
        font-style: normal;
             color: black;
    vertical-align: top;
            margin: 0px;
           padding: 0px;
      border-style: none;
      border-width: 0px;
  background-color: #E5E5E5;
           z-index: 0;

}
.newsbody {
             width: 100%;
         font-size: 11.0pt;
       font-family:"Times New Roman";
       font-weight: normal;
        font-style: normal;
             color: black;
    vertical-align: top;
            margin: 0px;
           padding: 0px;
      border-style: none;
      border-width: 0px;
      border-color: #005EAA;
  background-color: #C5C5C5;
           z-index: 0;
}
.newsbodyf {
             width: 100%;
         font-size: 10px;
       font-family:"Arial";
       font-weight: normal;
        font-style: normal;
             color: black;
    vertical-align: top;
            margin: 0px;
           padding: 0px;
      border-style: none;
      border-width: 0px;
      border-color: #005EAA;
  background-color: #C5C5C5;
           z-index: 0;
}

.newscontent {
             width: 100%;
         font-size: 11.0pt;
       font-family:"Times New Roman";
       font-weight: normal;
        font-style: normal;
             color: black;
    vertical-align: top;
            margin: 0px;
           padding: 10px;
      border-style: none;
      border-width: 0px;
      border-color: #005EAA;
  background-color: #E5E5E5;
           z-index: 0;

}



H1.gloss  { font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: bold; font-size: 18.0pt; color: #0000CC;
        text-align: center; vertical-align: middle }
H2.gloss  { font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: bold; font-size: 14.0pt; color: #FFFFFF;
        text-align: center; vertical-align: middle; background-color: #0000CC; }

table.gloss { font-family: Arial, Helvetica, sans-serif; font-style: normal;
        font-weight: normal; font-size: 9.0pt; color: #000000;
        text-align: left;  background-color: #FFFFFF;}
tr.head { font-family: Arial, Helvetica, sans-serif; font-style: normal;
        font-weight: bold; font-size: 11pt; color: #FFFFFF; background-color: #0000CC;
        text-align: center;  }
font.tofromFL { font-family: Times New Roman, Roman, serif; font-style: italic;
        font-weight: bold; font-size: 18.0pt; color: #FFFFFF;
        text-align: right; vertical-align: baseline;  }
font.tofromi  { font-family: Times New Roman, Roman, serif; font-style: italic;
        font-weight: bolder; font-size: 14.0pt; color: #FFFFFF;
        text-align: right; vertical-align: baseline;  }
font.tofrom { font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: bolder; font-size: 14.0pt; color: #FFFFFF;
        text-align: right; vertical-align: baseline;  }
a.adv     { font-family: Times New Roman, Roman, serif; font-style: italic;
        font-weight: bold; font-size: 24pt; color: #000000;
        text-align: left;  text-decoration: none }
td.termletter { font-family: Times New Roman, Roman, serif; font-style: italic;
        font-weight: bold; font-size: 24pt; color: #000000;
        text-align: left;  }


td.termnorm { font-family: Arial, Helvetica, sans-serif; font-style: normal;
        font-weight: normal; font-size: 10.0pt; color: #000000;
        text-align: right;  }
td.termprop { font-family: Arial, Helvetica, sans-serif; font-style: normal;
        font-weight: bolder; font-size: 10.0pt; color: #000000;
        text-align: right;  }
td.termsirn { font-family: Arial, Helvetica, sans-serif; font-style: normal;
        font-weight: normal; font-size: 10.0pt; color: #000000;
        text-align: right;  }
td.termdial { font-family: Arial, Helvetica, sans-serif; font-style: italic;
        font-weight: bolder; font-size: 10.0pt; color: #0000CC;
        text-align: right; }
td.termlocn { font-family: Arial, Helvetica, sans-serif; font-style: normal;
        font-weight: normal; font-size: 10.0pt; color: #000000;
        text-align: right;  }
td.termabst { font-family: Arial, Helvetica, sans-serif; font-style: italic;
        font-weight: bold; font-size: 10.0pt; color: #CC00CC;
        text-align: right; }
td.defnnorm { font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: normal; font-size: 11pt; color: #000000;
        text-align: left;  }
td.defnprop { font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: normal; font-size: 11pt; color: #000000;
        text-align: left;  }
td.defnsirn { font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: normal; font-size: 11pt; color: #000000;
        text-align: left;  }
td.defndial { font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: normal; font-size: 11pt; color: #000000;
        text-align: left; }
td.defnlocn { font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: normal; font-size: 11pt; color: #000000;
        text-align: left;  }
td.defnabst { font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: normal; font-size: 11pt; color: #000000;
        text-align: left; }
a.inref   {   font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: bolder; font-size: 11.5pt; color: #0000CC;
        text-decoration: none }
a.outref  {   font-family: Arial Narrow, Helvetica, sans-serif; font-style: normal;
        font-weight: bolder; font-size: 9.0pt; color: #0000CC;
        text-decoration: underline }
a.lref  {   font-family: Arial, Helvetica, sans-serif; font-style: normal;
        font-weight: bolder; font-size: 9.0pt; color: #0000CC;
        text-decoration: underline }
a.letter  {   font-family: Times New Roman, Roman, serif; font-style: normal;
        font-weight: bolder; font-size: 14pt; color: #0000CC;
        text-decoration: underline }

.tit   { font-family: Times New Roman, Roman, serif;
             font-size: 18pt;
           font-weight: bold;
                 color: blue;
            font-style: normal;
            text-align: left;
           line-height: 100%;
        vertical-align:bottom
        }
.fld {
            font-family: Arial Narrow, Helvetica, sans-serif;
              font-size: 12.5pt;
            font-weight: bold;
                  color: blue;
             font-style: normal;
             text-align: right;
            line-height: 100%;
         vertical-align: top;
         }
.def {  font-family: Arial Narrow, Helvetica, sans-serif;
              font-size: 12pt;
            font-weight: normal;
                  color: black;
             font-style: normal;
            line-height: 110%;
         vertical-align: top;
        }

font.subject { font-family: Verdana; font-size: 14px; color: #FFFFFF; font-weight: bold; vertical-align: top ! important }
font.header { font-family: Verdana; font-size: 20px; color: #000000; vertical-align: top ! important }
font.annoucements { font-family: Verdana; font-size: 12px; font-weight: bold; color: #000000; vertical-align: top }

.glosstitle {
	font-weight: bold;
	font-size: 36px;
}
.glosstable {
	 display: table;
   background: white;
   opacity: 1.0;
}
#contentcell {
	padding: 5px;
	display: block;
	word-wrap:break-word;
	margin: 0px;
	overflow: visible;
}
#contentroot {
	position: relative;
  display: block;
	margin-top: 30px;
	width: 95%;
	overflow: visible;
}
#titlebg {
	  display: block;
		height: 144px;
		width: 100%;
		font-family: arial, helvetica;
		font-size: 11px;
		color: #ffffff;
		background:rgba(000,255,255,0.5);
		margin-left: 20px;
    padding: 10px 20px 0px 20px;
    border-radius: 18px;

    clear:both;
 }
.glossjump {
   font-weight: bold;
	 font-size: 16px;
}

#titletext {
		width: 100%;
		height: 144px;
		font-family: arial, helvetica;
		font-size: 11px;
		color: #ffffff;
    padding: 20px;
		background: transparent;
		opacity: 1.0;
}
	#citation {
	  float: right;
    height: 50px;
		width: 200px;
		margin-right: 40px;
		font-family: arial, helvetica;
		font-size: 11px;
		color: #ffffff;
		z-index:4;
	}

#glossbody {
    position: relative;
	  display: block;
		width: 100%;
		font-family: arial, helvetica;
		font-size: 11px;
		color: #ffffff;
		background: white;
		padding: 0px;
    border-radius: 18px 18px 00px 00px;
}

.nudge {
	 position: relative;
	 display: block;
   margin-left: 20px;
   margin-right: 20px;
   background: white;
   opacity: 1.0;
   z-index: 1;
}
#menu {position: absolute; display:block; width:199px; height:575px; left: -35px; top: 110px; background:transparent; margin-left:0px; margin-right:0px; padding: 0px; }
 /* display the list items inline with a right margin to space the buttons. Use this to pre-load the hover image */
.menu ul {position:relative; left: 0px; background:transparent; padding:0px; margin-left:-20px; font-family:'UniqueRegular', 'exomedium', sans-serif;}
.menu li { display:block; height:36px; float:left; background:transparent; left:0px; padding:1px; transition: all 0.5s ease;}

/* style the links and place the background image to start from left edge */
.menu li a {position:relative; display:block;  height:36px; width:180px;  background:url(https://www.ringrealms.com/buttonCover.png) -0px 0px no-repeat; color:#000; text-decoration:none; font-size:18px; font-weight:700; font-family:'UniqueRegular', 'exomedium', sans-serif; text-align:center; line-height:35px}

.menu li a b {margin:0px; display:inline; float:left; height:36px; background:transparent url(https://www.ringrealms.com/buttonCover.png) -0px 0px no-repeat; padding:0px; color:#fff;}

/* style the link hover and the link hover b to replace the background image - border:0 needed for IE6 to work */
.menu li a:hover, .menu li a:hover b {border:0; background:transparent url(https://www.ringrealms.com/buttonCover.png) 0px -37px no-repeat; cursor:pointer; color: white; font-size:18px; font-weight:900;}

.menu li:hover {
   font-family:'UniqueRegular', 'exomedium', sans-serif;
   height:40px;
   font-size:19px;
   color: white;
   font-weight:800;
   text-shadow: 2px 3px #333333;
   background:transparent url(https://www.ringrealms.com/buttonCover.png) 0px -37px no-repeat;
}


 body{
  margin:0;
  padding:150px 0 0 180px;
 }
 div#header{
  position:absolute;
  top:0;
  left:0;
  width:500%;
  height:150px;
 }
 div#left-sidebar{
  position:absolute;
  top:150px;
  left:0;
  width:180px;
  height:100%;
 }
 @media screen{
  body>div#header{
   position:fixed;
  }
  body>div#left-sidebar{
   position:fixed;
  }
 }
 * html body{
      background-image: url(https://www.ringrealms.com/content/images/rrbackground.jpg);
  		background-position: 0 0;
			background-attachment: fixed;
  overflow:hidden;
 }
 * html div#content{
  height:100%;
  overflow:auto;
 }