/* General styles */
html {
  max-width: 1024px;
  margin: 0 auto;
}
body {
    margin:0;
    padding:0;
    border:0; /* This removes the border around the viewport in old versions of IE */
    width:100%;
    background:#fff;
    min-width:600px; /* Minimum width of layout - remove line if not required */
    /* The min-width property does not work in old versions of Internet Explorer */
    font-size:90%;
    line-height:1.6;
}

a {
    color:#0845b0;
    text-decoration:none;
}

a:hover {
    text-decoration:underline;
}

a:hover img {
    background-color:#F1F1F1;
    opacity: 0.7;
}

a:visited {
    color: #82c026;
}

h1, h2, h3 {
    margin:.4em .4em .4em .0em;
    padding:0;
}

p {
    margin:.4em 0 .8em 0;
    padding:0;
}

.boxright {
    float:right;
    position:relative;
    margin-right:0.1em;
    margin-left:0.2em;
    margin-top:0.5em;
    margin-bottom:0.5em;
    border:1px solid #aaaaaa;
    background-color: #f9f9f9; 
    text-align:center;
    font-size:85%;
    padding:0.3em;
}
.boxright h2 {
    background-color: #e7dcc3;
    margin:0;
    padding:0;
}


.boxright img {
  display: inline;
  margin: 5px;
  border: 1px solid #ffffff;
}
.boxright title {
    text-align:center;
    background-color: #e7dcc3;
    margin:0;
    padding:0;
}


.boxleft {
    float:left;
    position:relative;
    margin-left:0.1em;
    margin-right:0.3em;
    margin-top:0.5em;
    margin-bottom:0.5em;
    border:1px solid #aaaaaa;
    background-color: #f9f9f9; 
    text-align:center;
    font-size:85%;
    padding:0.3em;
}
.boxleft h2 {
    background-color: #e7dcc3;
    margin:0;
    padding:0;
}

.boxleft img {
  display: inline;
  margin: 5px;
  border: 1px solid #ffffff;
}
.boxleft title {
    text-align:center;
    background-color: #e7dcc3;
    margin:0;
    padding:0;
}

.boxgen {
    float:left;
    position:relative;
    margin-right:0.5em;
    padding:0.5em;
    border:1px solid #aaaaaa;
    background-color: #f9f9f9; 
    font-size:85%;
}
.boxgen h2 {
    background-color: #e7dcc3;
    margin:0;
    padding:0.3em;
}

.boxgen img {
  display: inline;
  margin: 5px;
  border: 1px solid #ffffff;
}
.boxgen title {
    text-align:center;
    background-color: #e7dcc3;
    margin:0;
    padding:0;
}

.boxmenu {
    float:left;
    position:relative;
    margin-right:0.5em;
    border:1px solid #aaaaaa;
    background-color: #f9f9f9; 
    line-height:1.3;
}
.boxmenu ul {
    list-style-type:none;
    margin: 0.5em;
    padding: 0;
    margin:0.5em;
}
.boxmenu li a {
    text-decoration:none;
    font-size:85%;
}

.boxmenu a:hover {
    text-decoration:underline;
}

.boxcentre {
    display: block;
    padding:0px;
    margin:2px;
    text-align:center;
    line-height:1.4;
    border:1px solid #82c026;
}
.boxcentre h2 {
    background-color: #e7dcc3;
    margin:0;
    padding:0;
}

.boxcentre title {
    text-align:center;
    background-color: #e7dcc3;
    margin:0;
    padding:0;
}

.boxcentre img {
    margin-top:10px;
    margin-bottom:10px;
}


ul {
    list-style-type:none;
    border-top:1px solid #000000;
    padding: 0;
    margin:0.5em;
}
li a {
    text-decoration:none;
}

/* column container */
.container {
    position:relative; /* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
    clear:both;
    float:left;
    width:100%; /* width of whole page */
    overflow:hidden; /* This chops off any overhanging divs */
    background:#f6f6f6;
    border:1px solid #a7d7f9;
}
/* 2 column left menu settings */
.wrap1 {
    background:#f6f6f6;
}

.wrap1 .wrap2 {
    float:left;
    width:200%;
    position:relative;
    left:11em;
    background:#fff;
    border-left:1px solid #a7d7f9;
    border-bottom:1px solid #a7d7f9;
}

.wrap1 .wrap3 {
    float:right;
    width:50%;
    position:relative;
    right:10em;
    padding-bottom:1em;
}

.wrap1 .maincolumn {
    margin:0 1em 0 10.4em;
    position:relative;
    right:100%;
    overflow:hidden;
}

.wrap1 .leftcolumn {
    float:left;
    width:9.5em;
    position:relative;
    right:10em;
    background:#f6f6f6;
}

.wrap1 .leftcolumn h2{
    color:#000;
    font-size:90%;
}

/* Footer styles */
#footer {
    clear:both;
    float:left;
    width:100%;
}

#footer p {
    padding:10px;
    margin:0;
    background:#f6f6f6;
}

.my_table {
    font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    width:100%;
    border-collapse:collapse;
}

.my_table td, .my_table th {
    font-size:1em;
    border:1px solid #98bf21;
    padding:3px 7px 2px 7px;
}

.my_table th {
    font-size:1.1em;
    text-align:center;
    padding-top:5px;
    padding-bottom:4px;
    background-color:#A7C942;
    color:#ffffff;
}

.my_table tr.win td {
    color:#000000;
    background-color:#EAF2D3;
}

.binary_table td {
    font-size:2.1em;
}
.binary_table th {
    background-color:#A7C942;
    color:#ffffff;
}
.binary_table td, th {
    padding:1px 3px 1px 4px;
    border:1px solid #98bf21;
}

div.all_thumbs{
  width:880px; 
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

.bt_shade {
    background-color: #DFDFDF
}

.row {
    clear:both;
    float:left;
    width:100%;                
    overflow:hidden;   
    margin:0px 0px 12px 20px;
    background: #d3e3bc;
    background: #ffffff;
}


.row img {
    display:block;
    border: 1px solid #a7d7f9;
    margin: 2px;
    padding: 2px;
    width: 250px;
    /*width: 180px;*/
    height: 300px;
}

.row a {

    text-decoration:none;
    color:#000000;
}
.row a:hover {
    background-color:#F1F1F1;
    opacity: 0.7;
}


.col_0 {
    float:left;
    position:relative;
    padding:0 0 0 0;
    overflow:hidden;
    font-size:1em;
    background: #ffffff;
    text-align:center;
}

.thumbs .col_0 {
    width:12.4%;
}

#ScrollButton {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 20px; /* Place the button at the bottom of the page */
    right: 30px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    background-color: red; /* Set a background color */
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 15px; /* Some padding */
    border-radius: 10px; /* Rounded corners */
    font-size: 18px; /* Increase font size */
}

#ScrollButton:hover {
    background-color: #555; /* Add a dark-grey background on hover */
}