/* RESET */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input,abbr,article,aside,command,details,figcaption,figure,footer,header,hgroup,mark,meter,nav,output,progress,section,summary,time { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th,figcaption { font-size: 1em; font-weight: normal; font-style: normal; }
fieldset,iframe { border: none; }
caption,th { text-align: left; }
article,aside,footer,header,hgroup,nav,section,figure,figcaption { display: block; }
table { border-collapse: collapse; border-spacing: 0; margin: 0px auto; }

/* LAYOUT */
html { background-color:#fff; }


/* TYPE */
body { font: 13px/18px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif; color: white; -webkit-font-smoothing: antialiased; background-color: black; }

#persistentModalDialog { font: 13px/18px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif; color: white; -webkit-font-smoothing: antialiased; }

a { color: #08c; }
a:link, a:visited, a:active { text-decoration: none; }
a:hover { text-decoration: underline; }

div.notice
{
color: red;
font-weight: bold;
}

div.faq
{
font-size:13px;
font-style:italic;
color: black;
font-weight:bold;
}

div.pro a
{
font-size:24px;
color: red;
font-weight:bold;
}

#cent {
  text-align: center;
}

#actionOptionsTable tr:nth-child(odd)
{
	background-color: transparent;
	/* background-color: #FFFFFF; */
}
#actionOptionsTable tr:nth-child(even)
{
	background-color: #f2f2f2;
}
#textTable tr:nth-child(odd)
{
	background-color: transparent;
	/* background-color: #FFFFFF; */
}
#textTable tr:nth-child(even)
{
	background-color: #353535;
}
#creationTable tr:nth-child(even)
{
	background-color: #353535;
}
#textTablePopup tr:nth-child(odd)
{
	background-color: transparent;
	/* background-color: #FFFFFF; */
}
#textTablePopup tr:nth-child(even)
{
	background-color: #353535;
}

div.scroll
{
	width: 100%;
	overflow-y:scroll;
	height: auto;
	max-height: 200px;
}
div.scrollAll
{
	width: 100%;
	height:100%;
}
/*
div.picture
{
	background-color:transparent;
}

img
{
	background-color:transparent;
}
*/
/*
img
{
	background-color:white;
}
*/

/* Modal Header */
.modal-header {
  padding: 2px 16px;
  background-color: #527a20;
  color: white;
}

/* Modal Body */
.modal-body
{
	padding: 2px 16px;
	background-color: #3f3f3f;
}

/* Modal Footer */
.modal-footer {
  padding: 2px 16px;
  background-color: #7D6608;
  color: white;
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  width: 60%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Add Animation */
@keyframes animatetop {
  from {top: -300px; opacity: 0}
  to {top: 0; opacity: 1}
}









ul{
  margin-left:25px;
}


/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
 
  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
}

button.characterName {
  background-color: MidnightBlue;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameMidnightBlue {
  background-color: MidnightBlue;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameBlack {
  background-color: Black;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameWhite {
  background-color: White;
  color: black;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameOlive {
  background-color: Olive;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNamePurple {
  background-color: Purple;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameSaddleBrown {
  background-color: SaddleBrown;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameSeaGreen {
  background-color: SeaGreen;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameTeal {
  background-color: Teal;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameTomato {
  background-color: Tomato;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameDarkSlateGray {
  background-color: DarkSlateGray;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameDarkRed {
  background-color: DarkRed;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

button.characterNameDarkGreen {
  background-color: DarkGreen;
  color: white;
  padding: 8px 8px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  opacity: 0.8;
  transition: 0.3s;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}


button.characterName:hover {opacity: 1}

.cyan-gradient-text {
  /* standard gradient background */
  background: linear-gradient(white,cyan);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gray-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,cyan);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,cyan);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.orange-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,orange);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.green-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,green);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.blue-gradient-text {
  /* standard gradient background */
  background: linear-gradient(blue,lightgray);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.red-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,red);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.aquamarine-gradient-text {
  /* standard gradient background */
  background: linear-gradient(yellow,aquamarine);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.coral-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,coral);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gold-gradient-text {
  /* standard gradient background */
  background: linear-gradient(yellow,gold);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.lightsalmon-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightsalmon,gray);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.cornflowerblue-gradient-text {
  /* standard gradient background */
  background: linear-gradient(cornflowerblue,gray);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.crimson-gradient-text {
  /* standard gradient background */
  background: linear-gradient(crimson,gray);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.lightblue-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightblue,gray);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.lightgreen-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgreen,gray);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.yellow-gradient-text {
  /* standard gradient background */
  background: linear-gradient(yellow,gray);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.darkorchid-gradient-text {
  /* standard gradient background */
  background: linear-gradient(darkorchid,gray);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.tan-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,tan);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.whitesmoke-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,whitesmoke);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.lightgray-gradient-text {
  /* standard gradient background */
  background: linear-gradient(gray,lightgray);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.linen-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,linen);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.cyan-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,cyan);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.powderblue-gradient-text {
  /* standard gradient background */
  background: linear-gradient(lightgray,powderblue);

  /* clip hackery */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.bold {
	font-weight:bold;
}

.tan-text {
	color: tan;
}

.blue-text {
	color: blue;
}

.lightblue-text {
	color: lightblue;
}

.green-text {
	color: green;
}

.lightgreen-text {
	color: lightgreen;
}

.lightgray-text {
	color: lightgray;
}

.yellow-text {
	color: yellow;
}

.lightsalmon-text {
	color: lightsalmon;
}

.whitesmoke-text {
	color: whitesmoke;
}

.cornflowerblue-text {
	color: cornflowerblue;
}

.crimson-text {
	color: crimson;
}

.darkorchid-text {
	color: darkorchid;
}

.gold-text {
	color: gold;
}

.red-text {
	color: red;
}

.orange-text {
	color: orange;
}

.aquamarine-text {
	color: aquamarine;
}

.coral-text {
	color: coral;
}