/* Set the margin and padding for some elements to 0px so all browsers have the same starting point for rendering the site. */
body,
button,
dd,
dl,
dt,
div,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
img,
input,
legend,
object,
p,
select,
span {
  margin: 0;
  padding: 0;
}

/* Fix a table font-size bug */
table {
  font-size: 1em;
}

/* Create some nice headings. */
h1,
h2,
h3,
h4,
h5,
h6,
#MainContent legend {
  font-family: georgia, times new roman, serif;
  font-variant: small-caps;
  font-weight: bold;
}

h1 {
  font-size: 1.5em;
}

h2 {
  font-size: 1.4em;
}

h3,
#MainContent legend {
  font-size: 1.3em;
}

h4 {
  font-size: 1.2em;
}

h5 {
  font-size: 1.1em;
}

h6 {
  font-size: 1em;
}

/* Give images no border by default, usefull when making imagelinks. */
img {
  border-style: none;
}

body {
  background-color: #ffffff;
  color: #002200;
  font-family: verdana, arial, sans-serif;
}

#PageContainer {
  background-color: #171868;
  padding: .25em;
}

#ContentContainer {
  background-color: #99cc66;
  border-bottom-color: #777777;
  border-bottom-style: ridge;
  border-bottom-width: .25em;
  border-top-color: #777777;
  border-top-style: ridge;
  border-top-width: .25em;
  clear: both;
  height: 100%; /* This way, Internet Explorer expands this DIV properly. */
  overflow: auto; /* This way, Opera, Netscape and Firefox expand this DIV properly. */
}

#Header {
  background-color: #333333;
  height: 100%;
  overflow: hidden;
}

#Logo {
  background-color: #777777; 
  height: 75px;
}

#TheLemmingsEncyclopediaBanner {
  background-color: #777777; 
  float: left;
  height: 75px;
  width: 585px;
}

#Navigator {
  background-color: #555555; 
  height: 1em;
  font-size: 0.8em;
  padding: 0.3em;
  color: #ddffff;
}

#Navigator a {
  color: #ffdddd;
}

#LeftColumn {
  background-color: #0e511b;
  background-image: url(images/background_left_column.png);
  border-right-color: #1bac29;
  border-right-style: ridge;
  border-right-width: .25em;  
  border-bottom-color: #1bac29;
  border-bottom-style: ridge;
  border-bottom-width: .25em;  
  float: left; 
  width: 220px;
}

#Menu h1 {
  color: #ccff99;
}

#Menu p {
  display: inline;
  padding-left: .2em;
}

#Menu {
  color: #ffcc00;
  font-size: .8em;
  padding: .25em;
}

#Menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

#Menu ul li ul li ul {
  display: none;
}

#Menu ul li ul li ul li {
  margin-left: .2em;
}

#Menu ul li ul li ul li ul li {
  margin-left: .4em;
}

#Menu .MenuMainShown {
  font-style: italic;
}

#Menu .MenuShown,
#Menu .MenuShown .MenuSolutionsShown {
  display: inline;
}

#Menu .MenuShown .MenuChosenItem {
  color: #ddffdd;
  font-weight: bold;
}

#Menu .MenuShown .MenuChosenSolutionsLevels {
  font-weight: bold;
}

#Menu a:hover {
  text-decoration : underline overline
}

#Menu ul li ul li a {
  color : #99ff33;
  font-weight : bold;
  text-decoration : none;
}

#Menu ul li ul li ul li a {
  color: #99cc66;
  font-weight : normal;
  text-decoration : none;
}

#Menu ul li ul li ul li ul li a {
  color: #99cc66;
  font-weight : normal;
  text-decoration : none;
}

/* Create a nice "Quick solution" form for the menu. */
#QuickSolutionForm fieldset {
  border-style: none;
}

#QuickSolutionForm button,
#QuickSolutionForm input,
#QuickSolutionForm select,
.MaincontentForm button,
.MaincontentForm input,
.MaincontentForm select,
.MaincontentForm textarea {
  color: #99cc66;
  font-size: .9em;
  margin: .25em;
  padding: .25em;
}

#QuickSolutionForm select,
.MaincontentForm select,
.MaincontentForm input,
.MaincontentForm textarea {
  background-color: #006633;
  border-color: #44aa66;
  border-style: solid;
  border-width: 1px;
}

#QuickSolutionForm select,
.MaincontentForm select,
.MaincontentForm input.text,
.MaincontentForm textarea {
  width: 98%;
}

#QuickSolutionForm button,
.MaincontentForm button {
  background-color: #4d6633;
  border-left-color: #b3da8d;
  border-top-color: #b3da8d;
  border-right-color: #72994c;
  border-bottom-color: #72994c;
  border-style: solid;
  border-width: 2px;
}

#QuickSolutionForm button:hover,
#QuickSolutionForm input:hover,
#QuickSolutionForm select:hover,
.MaincontentForm button:hover,
.MaincontentForm input:hover,
.MaincontentForm select:hover,
.MaincontentForm textarea:hover,
#QuickSolutionForm button:focus,
#QuickSolutionForm input:focus,
#QuickSolutionForm select:focus,
.MaincontentForm button:focus,
.MaincontentForm input:focus,
.MaincontentForm select:focus,
.MaincontentForm textarea:focus  {
  background-color: #498d00;
  color: #ffffff;
}

#QuickSolutionForm button:active,
.MaincontentForm button:active  {
  border-left-color: #72994c;
  border-top-color: #72994c;
  border-right-color: #b3da8d;
  border-bottom-color: #b3da8d;
}

#QuickSolutionForm #QuickSolutionFormSubmit {
  width: 60%;
}

#QuickSolutionForm #QuickSolutionFormReset {
  width: 31%;
}

.QuickSolutionFormOptionHeader,
.MaincontentFormOptionHeader {
  color: #ffcc00;
}

/* Create nice forms for the administration. */

.MaincontentForm input.text,
.MaincontentForm textarea,
.MaincontentForm select {
  display: block;
}

.MaincontentForm fieldset {
  border-style: solid;
  border-width: thin;
  border-color: #006633;
  padding: .5em;
}

.MaincontentForm select.InlineList {
  display: inline;
  width: 7em;
}

.MaincontentFormError {
  color: #550000;
  font-style: italic;
  font-weight: bold;
}

.MaincontentFormResult {
  color: #555599;
  font-style: italic;
  font-weight: bold;
}

/* MainContent gets no backgroundcolor or -image, the backgroundcolor or -image from ContentContainer is shown instead. */
#MainContent {
  padding-bottom: .25em;
  padding-left: 228px;
  padding-right: 165px; /* This has an override in index.php when Google search results are shown, see line with "<div id='MainContent'></div>". */
  padding-top: .25em;
  text-align: justify;
}

#MainContent h1 {
  color: #222200;
}

#MainContent h2 {
  color: #444400;
}

#MainContent h3,
#MainContent legend {
  color: #666600;
}

#MainContent p {
  margin-bottom: .5em;
  max-width: 40em; /* Has an override in layout_ie5_ie55.css and layout_ie6.css for IE <= 6. */  
}

#MainContent a:hover {
  text-decoration : underline overline
}

#MainContent a {
  color : #7286b7;
  font-weight : bold;
  text-decoration : none;
}

#MainContent dt {
  font-weight: bold;
}

#MainContent dd {
  margin-bottom: .5em;
  margin-left: 1em;
  max-width: 39em; /* Has an override in layout_ie5_ie55.css and layout_ie6.css for IE <= 6. */  
}

#MainContent .AddedChanged {
  border-top-style: solid;
  border-top-width: 1px;
  border-top-color: #000000;
  display: inline;
}

#MainContent .AddedChanged,
#MainContent .Source {
  color: #444444;
  font-size: .8em;
}

/* Hide the small screenshot for the levels that can be downloaded */
ul#packs .levelpack_description {
  font-style: italic;
  font-size: .8em;
}

ul#packs li {
  margin-top: .25em;
}

ul#packs li ol {
  display: none;
}

ul#packs li:hover ol {
  display: block;
}

ul#packs li ol li {
  position: relative;
}

ul#packs li ol li img {
  display: none;
}

ul#packs li ol li:hover img {
  display: block;
  position: absolute;
  z-index: 1;
  bottom: 0;
  right: 0;
  background-image: url(images/loader.gif);
  background-repeat: no-repeat;
  background-position: center center;
}
/* End hiding smalls screenshot */

.versions {
  border-collapse: collapse;
  font-size: .7em;
}

.versions th,
.versions td {
  border-width: 1px;
  padding: 0 .15em 0 .15em;
}

.versions th {
  border-style: solid;
  text-align: left;
  vertical-align: bottom;
  border-color: #777777;
}

.versions td {
  border-style: none solid solid solid;
  vertical-align: top;
  border-color: #aaaaaa;
}

.Sitemap .Hide {
  display: none;
}

.Sitemap {
  list-style-type: disc;
  margin: 0;
  padding: 0 0 0 1em;
}

.Sitemap ul {
  list-style-type: none;
  margin: 0;
  padding: 0 0 0 1em;
}

                    
#Footer {
  background-color: #dddddd; 
  clear: both;
  height: 2em;
  padding: .25em;
  text-align: right;
}

#Footer #Copyright {
  text-align: left;
  float: left;
  font-size: .8em;
}

#Footer a {
  color : #000000;
  font-weight : bold;
  text-decoration : none;
}

.MadeAndValidImages {
  display: block;
  float: right;
  margin-left: .2em;
}

#StatCounter {
  background-color: #dddddd;
  height: 14px;
  width: 74px;
}

#StatCounterObject {
  height: 14px;
  width: 74px;
}

#GoogleAdsenseBanner {
  background-color: #333333;
  margin: 0px auto;
  height: 60px;
  width: 468px;
  overflow: hidden;
}

#GoogleAdsenseBannerObject {
  height: 64px;
  width: 468px;
  overflow: hidden;
}

#GoogleAdsenseSkyscraper {
  background-color: #99cc66; 
  float: right;
  height: 600px;
  width: 160px;
  overflow: hidden;
}

#GoogleAdsenseSkyscraperObject {
  height: 604px;
  width: 160px;
  overflow: hidden;
}

#GoogleAdsenseReferral {
  background-color: #777777; 
  float: right;
  height: 32px;
  width: 110px;
  padding-top: 21px;
  padding-right: 21px;
  padding-left: 21px;
  overflow: hidden; /* It seems like it that this hidden overflow bugs IE 5.5 */
}

#GoogleAdsenseReferralObject {
  height: 36px;
  width: 110px;
  overflow: hidden; /* It seems like it that this hidden overflow bugs IE 5.5 */
}

/* GoogleAdsenseWebSearch gets the same backgroundcolor and -image as the LeftColumn so it looks like everything is the same. */
#GoogleAdsenseWebSearch {
  background-color: #cccccc; 
  height: 115px;
  width: 220px;
  overflow: hidden;
  white-space: nowrap;
  border-top-color: #000000;
  border-top-style: solid;
  border-top-width: 1px;
}

#GoogleAdsenseWebSearch #sbi {
  width: 210px;
  font-size: .9em;
}

#GoogleAdsenseWebSearch #sbb {
  width: 75px;
  height: 1.5em;
  font-size: .9em;
  color: #ffffff;
  background-color: #666666;
  border-left-color: #999999;
  border-top-color: #999999;
  border-right-color: #888888;
  border-bottom-color: #888888;
  border-style: solid;
  border-width: 2px;
}

#GoogleAdsenseWebSearch input {
  color: #ffffff;
  background-color: #999999;
}

#GoogleAdsenseWebSearch input[type=text] {
  border-color: #555555;
  border-style: solid;
  border-width: 1px;
}

#GoogleAdsenseWebSearch #sbb:hover,
#GoogleAdsenseWebSearch input:hover  {
  background-color: #555555;
  color: #ffffff;
}

#GoogleAdsenseWebSearch #sbb:active {
  border-left-color: #888888;
  border-top-color: #888888;
  border-right-color: #999999;
  border-bottom-color: #999999;
}

#googleSearchUnitIframe {
  float: left;
  margin: 0;
  padding: .25em;
}

#googleSearchUnitIframe iframe {
  border-style: none;
}

.Solution {
  font-size: .8em;
  list-style-type: none;
  margin: 0;
  margin-top: 1em;
  padding: 0;
}

.Solution p {
  display: inline;
}

.Solution img {
  display: inline-block;
}

.SolutionLevelNumber {
  font-weight: bold;
}

.SolutionLevelTitle {
  font-style: italic;
}

.SolutionLemmingsTotal {
}

.SolutionLemmingsDie {
}

.SolutionLemmingsToBeSaved {
}

.SolutionReleaseRate {
}

.SolutionTime img {
  vertical-align: baseline;
}

.SolutionSkills img {
  margin-bottom: .25em;
  display: block;
}

.SolutionScreenshot img {
  border-color: #000000;
  border-style: solid;
  border-width: 2px;
  display: block;
}

.SolutionSubfigures img {
  border-color: #000000;
  border-style: solid;
  border-width: 2px;
  margin-top: .25em;
  margin-right: .25em;
}

.SolutionScreenshot {
  overflow: auto; /* Has an override in layout_ie.css for IE. */ 
  width: 100%; /* Has an override in layout_ie5_ie55.css for IE <= 5.5. */ 
}

.SolutionDescription p {
  display: block;
  font-size: 1.1em;
  max-width: 40em; /* Has an override in layout_ie5.css and layout_ie6_ie66.css for IE <= 6. */
}
  
#ForumObject {
  height: 45em; /* Has an override in layout_ie.css for IE. */ 
  width: 100%;
  border-style: none;
}

