/*
-----------------------------------------------
Wikka MUIB Stylesheet (screen)
----------------------------------------------- */

/* global styling */

p, td, li, select {
	font-family:  Georgia, "DejaVu Serif", "Trebuchet MS", Times, serif; 
/* 	line-height: 20px;  */
 	line-height: 1.4em;  
/* 	font-size: 13px;  */
/*     font-size: 75%;  */
    font-size: 0.9em;
}


.footnotesbox { background-color: #eeeeee; padding: 10px; 
        margin-top: 15px; border: #666666 1px solid; font-size: 0.6em; }

div{
/*     border: 1px solid black;  */
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

form, h1, h2, h3, h4, h5 {
  text-shadow: 2px 2px 2px #bbb;
	margin: 0px;
	padding: 0px;
}


.logohead {
	margin: 0 auto;
	width: 850px;
  height: 40pt;
	color: red;
  background: -webkit-linear-gradient(left,#EEE,#FFF,#EEE);
	font-weight: bold;
/* 	padding: 5px;  */
}

/* page layout */

body{
    min-height: 100%;
    width: 100%;
    display: inline-table;
    
	background-color: #EEE;
	margin-top: 5pt;
/* 	margin-left: 80pt;  
	margin-right: 80pt;	  */
	margin-bottom: 40pt;
/* 	font: normal 14pt/16pt Georgia, "DejaVu Serif", "Trebuchet MS", Times, serif;  */ 
	text-align: left;
	color: #444;
	border: none 0; 
  
   /* background-image: url(../images/RuleBritannia.gif);    
    background-size: 80px 90px;
    background-repeat: no-repeat;  */       
    /* padding-top: 40px;  */
}

#container {
    height: 100%;
    margin: auto;
  /*  important ... VITAL! Android < 4.4 needs box */
     display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox; 
        display: flex;
 
     position: relative;  
    
  width:1110px;   /* left + centre + right +margins  */
  margin: auto;
 
  /* not important */
  /* height: 200px;  */

}
#leftcolumn {
    position: absolute;
    height: 100%;
    width:120px; 
    float:left;
    left: 0;
/* Edit buttons are under column. negative z stops links working */
    z-index: 0;
  /* margin-left: 5px;  */
  
/*   background: #ddd;  */
  background: url(../images/UflagLeft.jpg) left top repeat-y;
  /*  need opacity to be visible in Android but opacity: 1.0 fails  */
     opacity: 0.9;    
/*   min-height: 100vh;  */

}
#center {
  width:850px; /* size of the fixed width */
  float:left;
  margin-left: 125px;

  /*  need opacity to be visible in Android   */
     opacity: 0.9;    
  /* min-height: 100vh;  */

}

#rightcolumn {
  width:120px; 
    float:left;
    margin-left: 5px;
    
    z-index: -2;
  /* not important */
/*   min-height: 880px;  */
/*   background-color: #ccc;  */
  background: url(../images/UflagRight.jpg) left top repeat-y;
  /*  need opacity to be visible in Android   */
     opacity: 0.9;    
}


#page {
	margin: 0 auto;
	width: 850px;
}

#header {
/*	position: relative;  needed for the correct positioning of system messages */

  position: absolute;
    top: 40pt;
    width: inherit;

	padding: 0px;
/* 	line-height: 53px;  */
  text-align: left;
  background: -webkit-linear-gradient(left,#EEE,#FFF,#EEE);
}

#header h2 {
	text-align: left;
	font: normal 14pt Arial, "DejaVu Sans", Helvetica, sans-serif; 
}

#content {
  margin-top: 50pt;
	border: 0px solid #BBB;
	text-align: left;
	background-color: #FFF; 
	padding: 20px 30px 30px 30px;
 	clear: both;         
	font: normal 14pt/16pt  "DejaVu Serif", "Trebuchet MS", Georgia, Times, serif; 
  color: black;
  line-height: 1.7;

}





#footer {
/* 	float:left;  */	
    background-color: #C8D3E0;
    width: 96%;
    margin: auto;
    padding: 10px 10px 10px;
}

#smallprint {
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 0.6em;
	color: #777;
	padding-right: 0.5%;
	text-align: right;
}

/*  counter  */
.counter {
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 0.6em;
	color: #777;
	padding-right: 0.5%;
	text-align: leftt;
}

/* comments */

/* wrapper for the whole comments block, contains the header and the actual comments */
#comments {
	margin-top: 20px;	
	padding: 10px;
	color: #333;	
	background-color: #D0E0F0;
	border: 1px solid #ABC;
}

#comments a {
	color: #666;	
	text-decoration: none;
}

#commentsheader {
	clear: both;
	border-top: 1px solid #CCC;
}

/* wrapper for the comment lists */
.commentscontainer {
}

/* alternate color for single comments */
/* set contents of next 2 selectors the same if not alternation desired */
.comment-layout-1 {
	background-color: #D0E0F0;
	padding: 5px;
	border: 1px solid #ABC;
	margin: 5px;
}

.comment-layout-2 {
	background-color: #C0D0E0;
	padding: 5px;
	border: 1px solid #ABC;
	margin: 5px;
}

.commentbody {
}

.commentaction {
}

.commentform {
}

#commentform textarea {
	height: 80px;
}

textarea#commentbox {
	height: 80px;
}

.commentinfo {
	color: #999999;
	font-size: 80%;
	font-family: "Lucida Console", Monaco, monospace;
}

.commentdeleted {
	color: #AAAAAA;
}

.commentauthor {
	font-size: 1.2em;
	line-height: 20px;
	color: #000000;
	margin: 5px 5px 0 0;
}

.commentparent {
	font-size: 1em;
	line-height: 20px;
	color: #555555;
	margin: 5px 5px 5px 5px;
}

/* links */

a {
	color: #20557B;
	text-decoration: none;
}

a:hover {
	color: #933;
}

a.ext {
	color: #339;
}

a.ext:hover {
	color: #933;
}

#header a, #footer a {
	color: #20557B;
	font-family: Arial, Helvetica, sans-serif; 	
}


#header h2 a {
	font: normal 14pt Arial, "DejaVu Sans", Helvetica, sans-serif; 
	color: #AAA;
}

#header h2 a:hover {
	color: #666;
	background-color: transparent;
}

#homepage_link {
    font-size: 0.7em;
}
#header h2 a#homepage_link {
	color: #666;
}

#header h2 a#homepage_link:hover {
	color: #333;
}

#homepage_name {
	color: #394380;
/*  font-family: Orbitron;  */
	line-height: 33px;
	font-size: 30px;
  font-weight: bold;
  /*  layered on top  */
  position: absolute;
    top: 0;
    left: 20%;
    width: 60%;
    
    visibility: hidden;
}

#inpage_name {
    color: #394380;
    line-height: 38px;
    font-size: 40px;
    text-shadow: 2px 2px 2px #aaa;
    font-weight: bold;
    margin-bottom: 25px;
}


#content a:link, #content a:visited {
	font-family: inherit;
	margin: 1pt;
	font-size: inherit;
	padding: 1pt;
	height: auto;
	line-height: inherit;
	width: auto;
	color: #20557B;
	text-decoration: none;
/*	background-color: #FFF; */
}

#content a:hover, #content a:active {
	font-family: inherit;
	margin: 1pt;
	font-size: inherit;
	padding: 1pt;
	height: auto;
	line-height: inherit;
	width: auto;
	color: #CC6600;
	font-weight: inherit;
}

#content a.datetime {
	color: #666;
	font-size: 80%;
	font-family: "Lucida Console", Monaco, monospace;
}

#content a.keys, #content a.keys:hover {
	color: #666;
	background-color: #DDD;
	font: normal 95% Verdana, sans-serif;
	text-decoration: none;
}

#content a.heading {
	line-height: inherit;
	color: #666;
	padding: 0;
	margin: 0;
}

#content a.heading:hover {
	color: #666;
	text-decoration: none;
	background-color: transparent;
}

/*   TOC Table of Contents - made from headers in Wakka.class  */

#toc {
	margin-top: 20px;	
	padding: 10px;
	color: #333;	
	background-color: #D0E0F0;
	border: 1px solid #ABC;
      overflow: auto;
}


/* link tails */

/* user links and spans */
.user, .user:hover {
	background: url(../images/user.gif) left bottom no-repeat;
	padding-left: .9em;
}

#content a.user, #content a.user:hover {
	background: url(../images/user.gif) left bottom no-repeat;
	padding-left: .9em;
}

/* external links */
#content a.ext, #content a.ext:hover {
	background: url(../images/ext_simple.gif) right center no-repeat;
	padding-right: .8em;
}

/* interwiki links */
#content a.interwiki, #content a.interwiki:hover {
	background: url(../images/ext.gif) right center no-repeat;
	padding-right: .9em;
}
/* wiki links */
#content a.wikilink, #content a.wikilink:hover, #content a.wikilink:visited {
/* 	font-size: 110%;  */
}

/* mailto links */
#content a.mailto, #content a.mailto:hover {
	background: url(../images/mail.gif) right center no-repeat;
	padding-right: 1em;
}

/* lists */

ul, ol {
	margin-top: 0px;
	margin-bottom: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
}

li {
	margin: .5em;
}

em {
    font-size: 90%;
}

ul.thread {
        list-style-type: none;
        border-left: 2px #666 solid;
        padding-left: 10px;
        margin: 5px 0px; 
        background-color: lightcyan;
        overflow: auto; 
}
        
ul.thread li {
        color: #333;
        font-size: 110%;
}

/* images */

img {
	border: 0px;
/*   pointer-events: none;  */
}

img.centre {
	display: block; 
	text-align: center; 
	margin: 5px auto;
}

img.left {
	margin: 5px 5px 5px -5px;
	float: left;
}

img.right {
	margin: 5px -5px 5px 5px; 
	float: right;
}

img.icon {
	border: 0px;
	vertical-align: middle;
}

/* Zoom effect. Usage: {{img class="grow left"}} */
.grow img {
    pointer-events: all;
    -webkit-transition: all 1s ease; /* Safari and Chrome */
    -moz-transition: all 1s ease; /* Firefox */
    -ms-transition: all 1s ease; /* IE 9 */
    -o-transition: all 1s ease; /* Opera */
    transition: all 1s ease;
}
.grow img:hover {
    -webkit-transition: scale(2); /* Safari and Chrome */
    -moz-transition: scale(2); /* Firefox */
    -ms-transition: scale(2); /* IE 9 */
    -o-transition: scale(2); /* Opera */
    transform: scale(2);
}
.growhide {
    overflow: hidden;
}

/* floats */

.floatl {
	float: left;
	font-size: 90%;
	line-height: 1.5em;
	padding: 5px;
/* 	width: 30%;  */
	margin-right: 3%;
	border: 1px dotted #CCC;
}

.floatr {
	float: right; 
	font-size: 90%; 
	line-height: 1.5em; 
	padding: 5px;
/* 	min-width: 35%;  */
	margin-left: 3%;
	border: 1px dotted #CCC;
}

/* simply left-float element */
.left {
	float:left;
}

/* simply right-float element */
.right {
	float:right;
}

.clear {clear:both;}

/* text formatting */

#content h1 {
	font: bold 118%  Arial, "DejaVu Sans", Helvetica, Verdana, sans-serif;
	margin: 0pt;
	color: #444;
	padding: 10px;
	border: none 0;
	border: 1px solid #777; 
}

#content h2 {
	font: bold 116%  Arial, "DejaVu Sans", Helvetica, Verdana, sans-serif;
	margin: 0pt;
	color: #444;
	padding: 10px;
	border: 1px solid #999; 
}

#content h3 {
	font: bold 112% Arial, "DejaVu Sans", Helvetica, Verdana, sans-serif;
	margin: 0pt;
	color: #444;
	padding: 8px;
	border: 1px solid #999; 
  overflow: hidden;
}

#content h4 {
	font: bold 110% Arial, "DejaVu Sans", Helvetica, Verdana, sans-serif;
	margin: 0pt;
	color: #444;
	padding-bottom: 6px;
  border-bottom: 1px solid #CCC;
  overflow: hidden;
  }

#content h5 {
	font: bold 105% Arial, "DejaVu Sans", Helvetica, Verdana, sans-serif;
	margin: 0pt;
	color: #444;
	letter-spacing: 0.1em;
  border-bottom: 1px solid #CCC;
  overflow: hidden;
}

#content h6 {
	font: bold 10pt/12pt Arial, "DejaVu Sans", Helvetica, Verdana, sans-serif;
	color: #666;
  border-bottom: 1px solid #CCC;
  overflow: hidden;
}

tt {
	font-size: 11px;
	color: #999;
	background-color: #EEE; 
}

.hidden {
	display: none;
}

.wikisource {
	font-family: monospace;
	font-size: .9em;
	color: #666;
	background-color: #F9F9F9;
	border: 1px solid #CCC;
	padding: 1em;
	margin-bottom: .5em;
}

.highlight {color: red; background: #FFFFD0;}

.strikethrough {color: #888; text-decoration: line-through;}

.underline {text-decoration: underline;}

.indent {
	margin-left: 40px;
}

.notes {
/* 	font: normal 11pt Verdana, sans-serif;  */
	margin: 1pt;
	padding: 1pt;
	color: #112222;
	font-weight: normal;	
}

.help {
	cursor: help;
}

.centre {text-align: center;}

.center, .center p {text-align: center;}

.keys {
	color: #666;
	background-color: #DDD;
	font: normal 95% Verdana, sans-serif;
	text-align: center;
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	border-right: 1px solid #AAA;
	border-bottom: 1px solid #AAA;
	padding: .1em .2em;
}

.keys:hover {
	color: #555;
	background-color: #CCC;
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
}

acronym {
	border-bottom: 1px dotted #333;
	cursor: help;
	color: #333;
}

abbr {
	border-bottom: 1px dotted #333;
	cursor: help;
	color: #333;
}

.quote {
    margin-top: 50px;
    width: inherit;
    }

blockquote:before {
    content: open-quote;
    font-size: 3em;
    /* vertical-align: -0.3em;  */
}
blockquote {
    max-width: 400px;
    padding: 10px;
    margin-bottom: 10px;
/*     font-size: medium;  */
    font-style: italic;
    font-weight: bold;
    background-color: lavender;
    quotes: "\201C""\201D""\2018""\2019";
}

hr {
	border: none 0;
	border-top: 1px dotted #DDD; 
	margin: 8px auto;
	height: 1px;
}

.disabled {
	color: #AAA;
}

/* code blocks */

.code_header {
	color: #336;	
	background-color: #D0E0F0;
	border-top: 1px solid #AAC;
	border-right: 1px solid #AAC;
	border-left: 1px solid #AAC;
	border-bottom: none;
	font-family: Arial, Verdana, "DejaVu Sans", Helvetica, sans-serif;
	font-size: 100%;
	padding: 0 3px;
	margin: 5px auto 0 auto;
	text-align: left;
	line-height: 1.5em;
}

.code {
	color: black;
	background: #F3F3FF;
	border: 1px solid #AAC;
	font-size: 11px;
	font-family: "Lucida Console", Monaco, monospace;
	margin: auto;
	padding: 6px 5px 13px 5px;	/* padding-bottom solves hor. scrollbar hiding single line of code in IE6 but causes vert. scrollbar... */
	text-align: left;			/* override justify on body */
	overflow: auto;				/* allow scroll bar in case of long lines - goes together with white-space: nowrap! */
	white-space: nowrap;		/* prevent line wrapping */
}

.code pre {
	margin-top: 6px;
	margin-bottom: 6px;			/* prevent vertical scroll bar in case of overflow */
	font-size: 11px;
	font-family: "Lucida Console", Monaco, monospace;
}

/* form elements */

fieldset {
	margin-top: 10px;
	margin-bottom: 10px;
	border: 1px solid #CCC;	
}

fieldset legend {
	font-size: 115%;
	color: #666;
	padding:2px;
}

select {
	border: 1px solid #CCC;	
}

select:hover {
	background-color: #F3F3F3;
}

select:focus {
	background-color: #E6E6FF;
}

textarea {
	margin-right: 0;
 	width: 95%;  
	height: 500px;
	border: 1px solid #CCC;
}

textarea:hover {
	background-color: #F3F3F3;
}

textarea:focus {
	background-color: #E6E6FF;
}

input {
	border: 1px solid #CCC;	
}

input:hover {
	background-color: #F3F3F3;
}

input:focus {
	background-color: #E6E6FF;
}

input[type=hidden] {
	display: none;
}

input[type=submit], input[type=button] {
	color: #666;
	background-color: #EEE;
	font: normal 90% Arial, Helvetica, Verdana, sans-serif;
	text-align: center;
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	border-right: 1px solid #AAA;
	border-bottom: 1px solid #AAA;
	padding: .1em .2em;
}

input[type=submit]:hover, input[type=button]:hover {
	color: #333;
	background-color: #DDD;
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
}

/* editor textarea decorations */
/* (decorations can't be in "textarea#body" declaration, else the "width:100%" won't work) */
#textarea_container {
	border: 1px solid #CCC;
	padding: 2px;
	margin-bottom: 2px;
}

textarea#body{
/* 	width: 100%;  */
	height: 500px;
	/* padding and border must be 0 for the "width:100%" to work */
	padding: 0;
	border: 0;
/*  font-size: 15px;  */
}

 input, textarea {
	font-family:  Georgia, "DejaVu Serif", "Trebuchet MS", Times, serif; 

 	line-height: 1.4em;  
/* 	font-size: 13px;  */
/*     font-size: 75%;  */
    font-size: 0.9em;
}

/*  Trying to control Boat browser on Android  */ 
textarea#body:focus {
	font-family:  Georgia, "DejaVu Serif", "Trebuchet MS", Times, serif; 
 	line-height: 1.4em;  
    font-size: 0.9em;
    background-color: bisque;       /* see if it works */
}


.searchbox {
	/* border: none; */
	border: 1px solid #CCA;
	padding: 4px;
	margin: 0px;
	width: 100px;
	font-size: 80%;
}

input.grabcode {
	float: right;
	margin-top: 0px;
	font-size: 90%;
}

input.highlight {
	font-weight: normal;
	background-color: #FCC;
	color: #000;
}

/* system information */

.missingpage {
	color: #993357;
	text-decoration: none;
	background-color: transparent;
	border: none;
}

.missingpage:after {
	content: "+";
	color: #CCC;
}

/* inline system messages */
em.error {
	color: #A33; 
	font-style: normal;
	font-weight: bold;
	font-size: 95%;
}

em.success {
	color: #3A3; 
	font-style: normal;
	font-weight: bold;
	font-size: 95%;
}

/* redirection messages */

div.success {
	position: fixed;
	top: 4em;
	right: 1.5em;
	max-width: 40%;
	border: 2px solid #3A3;
	padding: .2em .4em;
	color: #3A3; 
	background-color: #EFE;
	font-style: normal;
	font-weight: bold;
	font-size: 50%;
  
  
  opacity: 0.5;
  transition: visibility 0s 2s, opacity 2s linear;
}

.comments {display: none;}

.revisioninfo {
	color: #000000;
	background-color: #E9F9E9;
	border: 1px solid #ACA;
	padding: 5px 10px;
	font-size: 90%;
	margin-bottom: 1em;
}

.history_revisioninfo { 
        float: left; 
        text-align: left; 
        padding: 4px; 
        background: #EEE; 
        border: 1px solid #CCC;                  
}

.copyright {
	font-size: 11px;
	color: #AAA;
	text-align: right;
}

.copyright a {
	color: #AAA;
}

.logotopleft {
	margin: auto;
	z-index:21;
	position:fixed;
	top: 1px;
	left: 1px;
	color: #ddd;
	font-size: large;
	font-weight: bold;
	padding: 5px;
  height: 130px;
  width: 110px;
  border: 0px solid #ccc;
}

.previewhead {
	margin: auto;
	z-index:20;
	position:fixed;
	top: 50px;
	left: 10px;
	color: red;
	font-size: xx-large;
	font-weight: bold;
	padding: 5px;
}

.toprightbox{
    border: 3px solid #D2CFCF;
    width: 120pt;
    margin: 5px;
    z-index: 20;
    position: fixed;
    top: 0;
    right: 0;
    text-align: center;
    font-size: normal;
    padding: 4px;
}



ins {
	background-color: #CFC;
	text-decoration: none;
}

del {
	color: #876;
	background-color: #FC9;
	text-decoration: none;
}

ins tt, del tt {
	background-color: inherit;
}

.pagetitle, .pagenote {color: #888;}

.smaller {font-size: smaller;}

#smallprint a {
	color: #666;
}

/* sort order information in sortable lists and tables*/
.sortorder {
	font-size: 70%;
	text-transform: uppercase;	
	letter-spacing: 1px;
}

/* debug messages */
.debug {
	color: #AAA;
	font-size: 70%;
	text-transform: uppercase;	
	letter-spacing: 1px;
}


/* Tables */

details {
border:1px solid #EEE;
}
summary {
cursor:pointer;
background-color: #EEE;
font-size: 8pt;
color: #888;
}
summary:hover {
	background-color: #DDD;
}
summary:focus {
    outline: 0;
}


table.category {
	border: 1px solid #CCC;
	border-collapse: seperate;
	border-spacing: 8px;
	background-color: #DDE;
  margin-top: 15px;
  text-align: center;
}

table.category tbody {
    background-color: whitesmoke;
  }
    
table.category tbody td:hover {
	background-color: #E9E9F9;
  box-shadow: 1px 1px 3px 3px grey;
  transition: all 1s ease;
}

table.category td a:hover{
    text-shadow: 4px 3px 3px #666;
}
    
table.category td {
	border: 1px solid #CCC;
  font-size: 0.9em;
	padding: .8em .8em;
  max-width: 140px;
  overflow: hidden;
  height: 3em;
}

/*  figure has a default margin of 40px  */ 
figure {
    margin: 15px;
}

figcaption {
  font-size: 70%;
  text-align: center;
  font-style: italic;
}

table.data {
/* 	border: 2px solid #CCC;  */
	border-collapse: collapse;
	border-spacing: 0;
}

table.data caption {
	border: 1px solid #CCC;
	font-size: 95%;
	color: #666;
	margin:5px 0;
	padding:2px;
}

table.data thead {
	background-color: #DDD;
}

table.data tfoot {
	background-color: #DDD;
}

table.data th {
	border: 1px solid #CCC;
	padding: .1em .25em;
}

table.data thead th {
	background-color: #DDD;
}

table.data tfoot th {
	background-color: #DDD;
}

table.data tbody th {
	background-color: #EEE;
}

table.data tbody tr {
	height: 30px;
}

table.data tbody tr:hover {
	background-color: #E9E9F9;
}

table.data tbody tr.alt:hover {
	background-color: #E9E9F9;
}

table.data td {
/* 	border: 1px solid #CCC;  */
	padding: .1em .25em;
}

table.data td.number {
	text-align: right;
}

table.data td.datetime {
	color: #666;
	font-size: 80%;
	font-family: "Lucida Console", Monaco, monospace;
	text-align: right;
	white-space: nowrap;
}

/* --- alternate row & column color --- */

table.data tr.alt {
	background-color: #EEE;
}

table.data th.c1 {
	background-color: #CDD;
}

table.data th.c2 {
	background-color: #DCC;
}

table.data th.c3 {
	background-color: #DDC;
}

table.data th.c4 {
	background-color: #CDC;
}

table.data th.c5 {
	background-color: #CCD;
}

table.data th.c6 {
	background-color: #DCD;
}

table.data td.c1 {
	background-color: #EFF;
}

table.data td.c2 {
	background-color: #FEE;
}

table.data td.c3 {
	background-color: #FFE;
}

table.data td.c4 {
	background-color: #EFE;
}

table.data td.c5 {
	background-color: #EEF;
}

table.data td.c6 {
	background-color: #FEF;
}

table.data tr.alt td.c1 {
	background-color: #DEE;
}

table.data tr.alt td.c2 {
	background-color: #EDD;
}

table.data tr.alt td.c3 {
	background-color: #EED;
}

table.data tr.alt td.c4 {
	background-color: #DED;
}

table.data tr.alt td.c5 {
	background-color: #DDE;
}

table.data tr.alt td.c6 {
	background-color: #EDE;
}

/* Action-related styling */

/* Adminpages action */

table#adminpages {
	border: 1px solid #CCC;
	width: 100%;
}

table#adminpages td.actions {
	text-align: center;
	font-size: 70%;
	font-family: Verdana, Arial, Helvetica, sans-serif; 	
}

form#form_page_admin_panel fieldset {
	line-height: 2em;	
}

/* Adminuser action */

table#adminusers {
	border: 1px solid #CCC;
	width: 100%;
}

table#adminusers td.actions {
	text-align: center;
	font-size: 70%;
	font-family: Verdana, Arial, Helvetica, sans-serif; 	
}

form#form_user_admin_panel fieldset {
	line-height: 2em;	
}

/* Lastedit action */
.lastedit {
	border:dotted 1px;
	padding:3pt;
	margin:8pt; color:#888;
	font-size:8pt;
	width:30%;
}

.lastedit_notes {
	color: #880;
}


.editbutton {
	color: #666;
	background-color: #DDD;
	font: normal 65% Verdana, sans-serif;
	text-align: center;
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	border-right: 1px solid #AAA;
	border-bottom: 1px solid #AAA;
	padding: .1em .2em;
  margin-left: 40px;
}

/* TextSearch & TextSearchExpanded Actions*/
.tse_keywords {
	font-weight: bold;
	color: green;
	background-color: #FAEBD7;
}

/* Calendar Action */
table.calendar {
	color: #000;
	background-color: #EEE;
	border-collapse: collapse;
}

table.calendar caption {
	border: 1px solid #CCC;
	margin:5px 0;
	font-size: 95%;
	color: #666;
	padding:2px;
}

table.calendar thead {
	border: 2px solid #CCC;
	background-color: #DDD;
}

table.calendar tbody.face {
	background-color: #EEE;
	border: 2px solid #CCC;
}

table.calendar tbody.calnav {
	background-color: #FFF;
}

table.calendar thead th {
	border: 1px solid #CCC;
	padding: 1px;
	text-align: center;
	font-size: 85%;
	width: 26px;
}

table.calendar tbody.face td {
	border: 1px solid #CCC;
	text-align: right;
}

table.calendar td.currentday {
	color: #FFF;
	background-color: #33A;
}

table.calendar tbody.face td:hover {
	background-color: #DDD;
}

table.calendar tbody.face td.currentday:hover {
	color: #FFF;
	background-color: #66C;
}

table.calendar tbody.calnav {
	font-weight: bold;
}

table.calendar td.prevmonth {
	text-align: left;
	font-size: 85%;
}

table.calendar td.curmonth {
	text-align: center;
}

table.calendar td.nextmonth {
	text-align: right;
	font-size: 85%;
}

table.calendar a:link {
	color: #339;
	text-decoration: none;
}

table.calendar a:visited {
	color: #339;
	text-decoration: none;
}

table.calendar a:hover {
	color: #933;
}

table.calendar a:active {
	color: #339;
	text-decoration: none;
}

/* RecentChanges action */

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

ul.recentchanges li {
	font-size: 0.9em;
}

/* Usersettings action */
table.usersettings {
}

fieldset#account {
	display: block;
	min-width: 600px;
	padding: 10px;
	background-color: #F6F6F6;
	text-align: left;
}

fieldset#account span#account_info {
	display: block;
	width: 230px;
	float: left;
	margin-bottom: 10px;
	text-align: right;
	padding-right: 10px;
}

fieldset#account input#logout {
	float: left;
	margin-left: 0;
}

fieldset.usersettings {
	display: block;
	min-width: 600px;
	padding: 10px;
}

fieldset.usersettings fieldset {
	clear: left;
	display: block;
	width: 236px;
	float: left;
	margin: 0 0 10px 240px;
}

fieldset.usersettings fieldset legend {
	margin: 0;
}

fieldset.usersettings fieldset input{
	display: block;
	float: left;
	padding: 0;
	margin: 0;
}

fieldset.usersettings fieldset label {
	vertical-align: top;
	margin: 0 0 0 10px;
	display: inline;
	text-align: left;
	width: auto;
	float:left;
}

fieldset.usersettings em {
	clear: left;
	float: left;
	display: block;
	margin: 0 0 0 240px;
}

fieldset.usersettings em.usersettings_info {
	clear: left;
	float: left;
	text-align: center;
	display: block;
	width: 246px;
	margin: 0 0 5px 240px;
	font-style: normal;
	font-size: 85%;
	color: #666;
	border: 1px solid #CCC;
	background-color: #F0F0F0;
	padding: 2px;
}

fieldset.usersettings label {
	display: block;
	width: 230px;
	float: left;
	margin-bottom: 10px;
	text-align: right;
	padding-right: 10px;
}

fieldset.usersettings select#update_option {
	display: block;
	width: 230px;
	float: left;
	margin: 0px 10px 10px 0px;
}

fieldset.usersettings input[type=text], fieldset.usersettings input[type=password] {
	display: block;
	width: 250px;
	float: left;
	margin-bottom: 10px;
	border:1px solid #CCC;
}

fieldset.usersettings input[type=submit] {
	float: left;
	margin-left: 250px;
}

fieldset.usersettings br {
	clear: left;
}


/* Wikkaconfig action */
table.wikkaconfig {
	width: 70%;
	font-size: 90%;	
}

table.wikkaconfig caption {
	font-size: 120%;
	background-color: #E9E9F9;
	padding: 5px;
}

table.wikkaconfig tbody th[scope=row] {
	text-align: right;
	padding-right: 5px;
}

table.wikkaconfig tbody td {
	padding-left: 5px;
}


/* Handler-related styling */

/* Acls handler */
table.acls {
}

textarea.acls {
	margin-right: 0;
	width: 98%;
	height: 80px;
	border: 1px solid #CCC;
}

/* 3rdparty-code related styling */

/* syntax highlighting code - GeSHi */
.code ol {
	margin-top: 6px;
	margin-bottom: 6px;			/* prevent vertical scroll bar in case of overflow */
}
.code li {
	font-size: 11px;
	font-family: "Lucida Console", Monaco, monospace;
}
.code .br0	{ color: #6C6; }
.code .co1	{ color: #808080; font-style: italic; }
.code .co2	{ color: #808080; font-style: italic; }
.code .coMULTI	{ color: #808080; font-style: italic; }
.code .es0	{ color: #009; font-weight: bold; }
.code .kw1	{ color: #b1b100; }
.code .kw2	{ color: #000; font-weight: bold; }
.code .kw3	{ color: #006; }
.code .kw4	{ color: #933; }
.code .kw5	{ color: #00F; }
.code .me0	{ color: #060; }
.code .nu0	{ color: #C6C; }
.code .re0	{ color: #00F; }
.code .re1	{ color: #00F; }
.code .re2	{ color: #00F; }
.code .re4	{ color: #099; }
.code .sc0	{ color: #0BD; }
.code .sc1	{ color: #DB0; }
.code .sc2	{ color: #090; }
.code .st0	{ color: #F00; }

/* wikiedit */

.toolbar tr { background: ButtonFace; }
.toolbar .btn-, .toolbar  .btn-hover,  .toolbar .btn-active,
.toolbar .btn-pressed {
	background: ButtonFace;
	color: ButtonText;
	border: 1px solid ButtonFace;
	padding: 1px;
	margin: 0px;
	cursor: pointer;
}
.toolbar .btn- img  { width: 20px; height: 20px; }
.toolbar .btn-hover { border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight; }
.toolbar .btn-active,
.toolbar .btn-pressed { border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow; }
.toolbar .btn-pressed { background: ButtonHighlight; }
.editornamecss { background-color:#CCCCFF; font-size: 18px; padding: 0 10px; }

/* menus */
ul.menu {
	font-size: 90%;
}

ul.menu li form {
    display: inline;
}

ul.menu li form input {
	font-family: Arial, "DejaVu Sans", Helvetica, Verdana, sans-serif;
	font-size: 1em;
	line-height: 1.1em;
	color: #333;
	border: 1px solid #CCC;
}

ul#main_menu {
	float: right;
	list-style-type: none;
	padding: 0px;
	margin-top: 10px;
}

ul#main_menu li {
	font-family: Arial, Helvetica, Verdana, sans-serif;
	margin-left: 0;
	margin-top: 0;
	margin-right: 10px;
	padding: 0;
	float: left;
	width: auto;
	text-align: left;
	font-size: 80%;
}

ul#main_menu li a {
	color: #20557B;
}

ul#main_menu li > a:hover {
	  background-color: transparent;
	  color: #cc6600;
}

ul#options_menu {
	float: left;
	list-style-type: none;
	padding: 0px;
	margin-top: 0px; 
}

ul#options_menu li {
    margin-top: 0;
    padding: 0px;
    border: 1px solid #888;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    background-color: #ddd;
    float: left;
    width: auto;
    text-align: left;
    font-size: 0.8em; 
}

ul.menu form#form_logout input[type=submit] {
    background-color: transparent;
    border: none;
    font-family: Arial, Helvetica, Verdana, sans-serif;
    font-size: inherit;
    padding: inherit;
    font-weight: inherit;
    color: #993357;
    text-decoration: none;
    cursor: pointer;
}

ul#dashboard {
	border: none;
	background-color: #556;
	float: left;
	list-style-type: none;
	padding: 0px;
	margin-top: 0px;
	width: 850px;
}

ul#dashboard li {
	font-family: Arial, Helvetica, Verdana, sans-serif;
	margin: 0 0 0 10px;
	padding: 0;
	float: left;
	width: auto;
	text-align: left;
	font-size: 90%;
}

ul#dashboard li a {
	color: #FFF;
}

ul#dashboard li > a:hover {
	background-color: transparent;
	color: #FF9933;
}

/* --------- small screen ------------- */
@media only screen and (max-width: 800px) { 

#container, #content { font-size: 20pt;  } 

  #content:before { 
  content: "800px"; 
  font-size: 10pt; 
  } 

}


/* --------- smaller screen ------------- */
@media only screen and (max-width: 360px) { 



#container, #content { font-size: 22pt;  } 

  #content:before { 
  content: "360px"; 
  font-size: 12pt; 
  } 

}

/*  When in portrait mode on an Android mobile
    and the soft keyboard is onscreen, the css incorrectly
    reports Landscape mode redrawing our side columns.
    e.g. click in an input box
    max-aspect-ratio: was 13/9 I have opted for 11/9
*/


/* ---- In portrait mode: lose side columns ----- */
/*@media only screen and (orientation : portrait) { */
    @media screen and (max-aspect-ratio: 11/9) {

#container, #center, #page {
    width: 100%;
    }

#center {
  margin-left: 0;
}
    
#leftcolumn, #rightcolumn {
    display: none;
  }

 }
 
 /* landscape */
 @media screen and (min-aspect-ratio: 11/9) 
 {
      #center, #page {
    width: 850px;
    }
 
 }