.body 
{
    background-color: #ffffff;
}
.bodytext 
{ 
    margin-left: 20px; margin-right: 20px; margin-top: 20px; margin-bottom: 20px;
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    text-align: left;
    background-color: #ffffff;
}

.maindiv
{
  width: 700px; 
  border: 5px solid #C80000; 
  margin: auto;
}
@media (max-width: 710px) {
  .maindiv {
    width: auto;
  }
}

.basicrule
{
    background-color: #C80000;
    height: 1px;
}
.headingelement
{
  background-color: #C80000;
  color: #ffffff
}
.sitename {
  font-size: 1em;
  font-weight: bold;
  color: #ffffff
}

.searchbox 
{ 
  float: right;
  margin-top: 5px;
}
.searchbox2 
{ 
  margin-top: 5px;
  margin-right: 5px;
  display: none;
  float: right;
}
@media (max-width: 520px) {
  .searchbox {
    display: none;
  }
  .searchbox2 {
    display: block;
  }
}

.showhide {
  display: none;
}
.fakelink {
  COLOR: #C80000; 
  text-decoration: underline;
  cursor: pointer;
}
.fakelink:hover
{
    COLOR: #0000FF
}

.flushright
{
    float: right;
}
.flushleft
{ /* needed? */
  float: left;
  text-align: left;
}
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}

.datenote {
  text-align: right;
  font-size: 0.8em;
  margin-bottom: 0px; 
}

.letter {
  font-size: 1.4em;
  color: #C80000;
}

.smaller {
  font-size: 0.8em;
}

.serieslist {
  margin-top: 1em;
}

.jelsearchactions {
  display: table-cell;
  vertical-align: top; 
}
.refinebutton {
  margin-top: 2px;
}
@media screen and (max-width: 600px) {
  .jelsearchactions {
    display: inline-block;
  }
  .refinebutton {
    margin-top: 0px;
  }
}

.mainpage {
  -webkit-column-count: 2; /* Chrome, Safari, Opera */
  -moz-column-count: 2; /* Firefox */
  column-count: 2;
}
.block {
  display: inline-block;
}
.block ul {
  margin-top: 0px;
}

.searchform {
  padding: 4px; 
  display: table-cell;
}
.searchformsub {
  display: inline-block;
  vertical-align: top;
}
.searchformextrabutton {
  display: none;
}
.searchformbutton {
  display: inline;
}
@media screen and (max-width: 600px) {
  .searchform {
    display: inline-block;
  }
  .searchformsub {
    display: table-cell;
    padding-right: 10px;
  }
  .searchformextrabutton {
    display: inline;
  }
  .searchformbutton {
    display: none;
  }
}

.searchformft {
  width: 100%;
}
.searchformfield {
  width: 100%;
}
.yearlist {
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}
@media screen and (max-width: 690px) {
  .yearlist {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
  }
}
@media screen and (max-width: 500px) {
  .yearlist {
    -webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
  }
}

.graphdiv {
  display: block;
  text-align: center;
}

.statgraph {
  max-width: 100%;
  height: auto;
}

.toggle-nav {
    display:none;
}
 
/*----- Menu -----*/
/* @media screen and (min-width: 480px) { */
    .menu {
        width:100%;
        background:#c80000;
        border-top: 1px solid grey;
        border-bottom: 1px solid grey;
    }
    
/* } */
 
.menu ul {
    display:inline-block;
    margin: 0px;
    padding: 0px;
}
 
.menu li {
    margin: 0px;
    float:left;
    list-style:none;
    font-size:1em;
    border-right: 1px solid grey;
    padding: 0.75em 0px;
}
 
.menu li:last-child {
    margin-right:0px;
/*    border: none; */
}
.current-item
{
  background-color: lightgrey;
}
.other-item:hover
{
  background-color: grey;
}
.menu .other-item a {
    color:#ffffff;
    text-decoration:none;
    padding: 0.75em;
}
 
.menu .current-item a {
    text-decoration:none;
    color:#C80000;
    padding: 0.75em;
}


/*----- Responsive -----*/
@media screen and (max-width: 520px) {
    .menu {
        position:relative;
        display:inline-block;
    }
 
    .menu ul.active {
        display:none;
    }
 
    .menu ul {
        width:auto;
        position:absolute;
        top:120%;
        left:0px;
        padding: 0px;
        background: grey;
    }
 
    .menu ul:after {
        width:0px;
        height:0px;
        position:absolute;
        top:0%;
        left:22px;
        content:'';
        transform:translate(0%, -100%);
        border-left:7px solid transparent;
        border-right:7px solid transparent;
        border-bottom:7px solid #303030;
    }
 
    .menu li {
        margin:0px;
        padding: 0px;
        float:none;
        display:block;
    }
  .other-item:hover
  {
    background-color: lightgrey;
  }
 
    .menu a {
        display:block;
    }
 
    .menu .toggle-nav {
        padding: 0.3em 0.5em;
        float:left;
        display:inline-block;
        background:black;
        color: white;
        font-size: 1.5em;
        text-decoration: none;
    }
 
    .toggle-nav:hover, .toggle-nav.active, .toggle-nav a {
        text-decoration:none;
        color:#C80000;
    }

  .mainpage {
    -webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
  }
  .block ul {
    margin-top: 15px;
  }

}

/* ------------------*/

.colored 
{
    COLOR: #C80000
}
.logout a:link
{
    color: #ffffff;
}  
.logout a:visited
{
    color: #ffffff;
}  
.normal
{
    COLOR: #333333;
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    font-size: 1em;
}
BODY
{
    COLOR: #333333;
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    font-size: 0.8em;
}
DL
{
    COLOR: #333333;
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    font-size: 1em;
}
UL
{
    COLOR: #333333;
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    font-size: 1em;
}
H1
{ 
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    font-size: 1.4em;
}  
H2
{ 
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    font-size: 1.2em;
}  
STRONG 
{
    COLOR: #C80000
}
TABLE
{
    COLOR: #333333;
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    font-size: 1em;
}
TH
{
    COLOR: #333333;
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    font-size: 1em;
}
TD
{
    COLOR: #333333;
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    font-size: 1em;
}
TR
{
    COLOR: #333333;
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
    font-size: 1em;
    text-align: left;
}
blockqoute
{
    COLOR: #333333;
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
}
PRE
{
    FONT-FAMILY: Verdana, Arial, Univers, Helvetica, sans-serif;
}
A:link
{
    COLOR: #C80000;
    TEXT-DECORATION: underline
}
A:visited
{
    COLOR: #C80000;
    TEXT-DECORATION: underline
}
A:active
{
    COLOR: #000000;
    TEXT-DECORATION: underline
}
A:hover
{
    COLOR: #0000FF
}