body { color:#505050; background-color:#F0F0F0; }

/*
Font stack that will apply to all content; default is sans-serif otherwise
*/
/*
html, button, input, select, textarea, .pure-g [class *= "pure-u"] {
 font-family:Georgia, Times, "Times New Roman", serif; }
*/

/* Monospaced fonts */
pre, code {
  font-family:'Lucida Console','Andale Mono','Courier New',Courier,monospace; }

/* Links */
a:link { color:#505050; text-decoration:none;
/*  text-shadow:0.5px 0.5px 0.5px #99b2cc; */
}
a:visited { color:#555555; text-decoration:none;
  /* text-shadow:0.5px 0.5px 0.5px #99b2cc; */
   }
a:hover, a:active { color:#b0b0b0; text-shadow:1.5px 1.5px 2px #99b2cc; }

.pure-img-responsive { max-width:100%; height:auto; }

/*
Add transition to containers so they can push in and out.
*/
#layout {
    -webkit-transition:all 0.2s ease-out;
    -moz-transition:all 0.2s ease-out;
    -ms-transition:all 0.2s ease-out;
    -o-transition:all 0.2s ease-out;
    transition:all 0.2s ease-out;
}

/*
This is the parent `<div>` that contains the menu and the content area.
Hamburger Menu styles are first, wider @media styles are below.
*/
#layout { position:relative; padding-left:0; }
#layout.active { position:relative; left:5px; }
#layout.active #menu { left:1px; width:10px; }
#layout.active .menu-link { left:5px; }

/*
The content `<div>` is where all your content goes.
*/
.content { margin:0 0 0 0; padding:0 0; max-width:1920px;
  margin-bottom:50px; line-height:1.6em; }
.content img { max-width:100%; height:auto; } /*TODO wiki needs to style it*/
/* links in the content area */
/* .content a { font-weight:600; color:#0055bb; text-decoration:none; }
.content a:visited { font-weight:bold; color:#003399; text-decoration:none; }
.content a:hover {color:#0066cc; text-decoration:underline; } */
.content a:active { color:#9c0606; }

/* Wiki page actions */
#wikicmds { text-align:center; font-size:85%; white-space:nowrap;
  padding:2px 5px 1px; 0; border-bottom:1px #ccc dotted; }
#wikicmds ul { list-style:none; margin:0px; padding:0px; }
#wikicmds li { display:inline; margin:0px 5px; }
#wikicmds li a { text-decoration:none; color:#666; border:none; }
#wikicmds li a.createlink { display:none; }
#wikicmds li a:hover { text-decoration:underline; color:blue; }

/* The headerlogo element is (Site|Group).HeaderLogo TODO */
.headerlogo { border-bottom:1px #ccc solid; }

/* Wiki Header - Logo and Search box */
#wikihead { position:absolute; right:10px; top:10px; font-size:85%; }
#wikihead form { margin-top:0.3em; }
#wikihead form a { color:#333; }
#wikihead form a:hover { background:#f9f9f9; color:#666; }
#wikihead input { font-size:85%; color:#666; text-shadow:1px 1px 1px #99b2cc; }
#wikihead input.inputbox { width:10em; }
#wikihead form { display:none; } /* don't display searchbox on small screens */

/* The #wikilogo element is the logo from $PageLogoFmt */
#wikilogo { padding:10px 2em 6px 2em; text-align:center;
  background:#f9f9f9; border-bottom:1px #ccc solid;  }
#wikilogo img { border;0px; }

/* The #wikilogotxt element is a plain-text "logo" alternative */
#wikilogotxt { display:block; border-bottom:1px #ccc solid;
  margin:0; padding:0.6em; background:#f9f9f9;
  font-size:180%; text-align:center; text-shadow:0.8px 0.8px 0.8px #336699; }
#wikilogotxt a, #wikilogotxt a:visited { text-decoration:none;
  color:#333; font-weight:normal; }
#wikilogotxt a:hover { text-shadow:1.2px 1.2px 1.2px #336699; }

/* Wiki page title */
.pagegroup { margin:0; }
.title { margin:0 auto; padding:0.1em 0.1em;
   max-width:800px; border-bottom:1px solid #f9f9f9; }
.title h1 { margin:0.1em 0; font-size:2.1em; font-weight:500;
  text-align:center; }

h1 { margin:0.1em 0.1em; padding:0.2em 0.5em 0.4em 0.5em; font-size:2.1em; font-weight:500; color:#808080; 
  text-align:center; }

h2 { margin:0.25em 0.25em; padding:1em 0 0 0; font-size:1.25em; font-weight:500; color:#808080; 
  text-align:left; }

h3 { margin:0.25em 0.25em; padding:0 0 0 0; font-size:1.25em; font-weight:500; color:#808080; 
  text-align:left; }

/*TODO Wikify this*/
.content-subhead { margin:50px 0 20px 0; font-weight:300; color:#888;}

/* Edit Form */
#wikiedit form { margin:0px; width:100%; line-height:1.1em; }
#wikiedit textarea { margin:0px; width:99.5%; height:18em; }
#wikiedit input[type=text] { margin:0px; width:99.5%; }
h2.wikiaction { margin:0px }
.wikimessage { margin-top:3px; margin-bottom:3px; font-style:italic;
  color:black; background-color:#ffffcc; padding:2px; }

/* For the (Site.)Search page */
.searchbox { margin-right:2px; max-width:100%; }

#wikifoot { font-size:80%; padding-top:2em; text-align:center; }
.footnav a,.footnav a:visited { font-weight:normal; text-decoration:none;
  color:black; }
.footnav a:hover { text-decoration:underline; color:blue; }
.lastmod { color:#999; }

/*
The `#menu` `<div>` is the parent `<div>` that contains the `.pure-menu` that
appears on the left side of the page.
*/

#menu {
display: none;
  margin-left:-1px; /* "#menu" width */
  width:1px;
  top:0;
  left:0;
  bottom:0;
  z-index:0; /* so the menu or its navicon stays above all content */
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  background:#f0f0f0;
  border-right:1px solid #ccc;
}
/* All anchors inside the menu should be styled like this. */
#menu a { color:#000; border:none; padding:0.4em 0 0.4em 0.6em;
 font-size:85%; }
/* Remove all background/borders, since we are applying them to #menu.*/
#menu .pure-menu, #menu .pure-menu ul { border:none; background:transparent; }
/* Add that light border to separate items into groups. (was 0.5em */
#menu .pure-menu ul, #menu .pure-menu .menu-item-divided { padding-top:0em; }
#menu .pure-menu ul { padding:0.2em 0 0.3em 0; }
#menu .pure-menu li { background:#f0f0f0 }
/* Change color of the anchor links on hover/focus. */
#menu .pure-menu li a:hover, #menu .pure-menu li a:focus { background:#f9f9f9; }
/* This styles the selected menu item `<li>`. */
#menu .pure-menu-selected, #menu .pure-menu-heading { background:#1f8dd6; }
/* This styles a link within a selected menu item `<li>`. */
#menu .pure-menu-selected a { color:#444; }
/* This styles the menu heading. */
#menu .pure-menu-heading { font-size:110%; color:#444; margin:0; }

/* Sidebar headings */
#menu .sidehead { font-weight:600; color:#333; border:none;
  padding:0.3em 0 0.2em 0.6em; background:#eee;
  border-bottom:1px #ddd solid; border-top:1px #ddd solid; }
#menu .sidehead a { font-size:100%; color:#333; padding:0; }
#menu .sidehead a:hover { color:#666 }

/* Side menu search form TODO */
#menu .sidesearch { background:transparent; color:#000;
  padding-bottom:0.4em; padding-top:0.4em; }
#menu .sidesearch a:hover { text-decoration:underline; }


/* -- Dynamic Button For Responsive Menu -------------------------------------*/

/*
The button to open/close the Menu is custom-made and not part of Pure.

`.menu-link` represents the responsive menu toggle that shows/hides on
small screens.
*/
.menu-link {
  position:fixed;
  display:block; /* show this only on small screens */
  top:0;
  left:0; /* "#menu width" */
  background:#000;
  background:rgba(0,0,0,0.7);
  font-size:10px; /* change this value to increase/decrease button size */
  z-index:10;
  width:2em;
  height:auto;
  padding:2.1em 1.6em;
}
.menu-link:hover, .menu-link:focus { background:#000; }
.menu-link span { position:relative; display:block; }
.menu-link span, .menu-link span:before, .menu-link span:after {
  background-color:#fff; width:100%; height:0.2em; }
.menu-link span:before, .menu-link span:after { position:absolute;
  margin-top:-0.6em; content:" "; }
.menu-link span:after {  margin-top:0.6em; }

/*
Responsive Styles (Media Queries)
These styles are activated when the display is wider; the Hamburger
will disappear and the Side Menu for larger displays will be visible.

/* Hide the menu at `65em`, but modify this based on your app's needs. */
@media (min-width:1em) {
 #menu .sidesearch { display:none; }
 #wikilogo { text-align:center; }
 #wikilogotxt { text-align:center; }
 #wikihead form { display:block; }

 .title { padding-left:1.5em; padding-right:1.5em; }
 .content { padding-left:2em; padding-right:2em; background-color:#F0F0F0; }
 /* width of the left (menu) column */
 #layout { padding-left:175px; left:0; }
 #menu { left:175px; }
 /* text-align:center was float:right; */
 .menu-link { position:fixed; left:175px; display:none; }

 #layout.active .menu-link {  left:175px; }
}

@media print {
 #menu, #wikihead, #wikilogo { display:none; }
 .headerlogo, .content, .title { margin-left:0; }
}

.mini { padding:2px; border:1px solid #dddddd; background-color:#ffffff; }

.miniH, .miniF {display:block;}